From 14ab03ac7ca750b8720ac956907ad688bffc321b Mon Sep 17 00:00:00 2001
From: Volker Schukai <volker.schukai@schukai.com>
Date: Sun, 5 Jan 2025 13:22:08 +0100
Subject: [PATCH] fix: optimize local-picker #276
---
nix/config/release.nix | 2 +-
.../accessibility/locale-picker.mjs | 465 ++++++++++--------
.../stylesheet/locale-picker.mjs | 19 +-
source/i18n/locale.mjs | 302 ++++++------
source/i18n/map/languages.mjs | 176 +++----
source/i18n/util.mjs | 24 +-
source/monster.mjs | 1 +
7 files changed, 535 insertions(+), 454 deletions(-)
diff --git a/nix/config/release.nix b/nix/config/release.nix
index 7d729110b..5dc508eab 100644
--- a/nix/config/release.nix
+++ b/nix/config/release.nix
@@ -3,4 +3,4 @@
commit = "84aecd765941e10844c0ca62c0fae69487d45793";
name = "Monster";
mnemonic = "monster";
-}
\ No newline at end of file
+}
diff --git a/source/components/accessibility/locale-picker.mjs b/source/components/accessibility/locale-picker.mjs
index bf3d7caf9..de5e59532 100644
--- a/source/components/accessibility/locale-picker.mjs
+++ b/source/components/accessibility/locale-picker.mjs
@@ -17,13 +17,16 @@ import {
ATTRIBUTE_ROLE,
} from "../../dom/constants.mjs";
import {CustomControl} from "../../dom/customcontrol.mjs";
-import {CustomElement, updaterTransformerMethodsSymbol} from "../../dom/customelement.mjs";
+import {
+ CustomElement,
+ updaterTransformerMethodsSymbol,
+} from "../../dom/customelement.mjs";
import {
assembleMethodSymbol,
registerCustomElement,
} from "../../dom/customelement.mjs";
import {findTargetElementFromEvent} from "../../dom/events.mjs";
-import {isFunction} from "../../types/is.mjs";
+import {isFunction, isObject} from "../../types/is.mjs";
import {LocalePickerStyleSheet} from "./stylesheet/locale-picker.mjs";
import {fireCustomEvent} from "../../dom/events.mjs";
import {detectUserLanguagePreference} from "../../i18n/util.mjs";
@@ -69,7 +72,8 @@ const detectedLanguagesSymbol = Symbol("detectedLanguages");
*
* @fragments /fragments/components/accessibility/locale-picker/
*
- * @example /examples/components/accessibility//locale-picker-simple
+ * @example /examples/components/accessibility/locale-picker-simple Simple example
+ * @example /examples/components/accessibility/locale-picker-reset Reset Selection
*
* @issue https://localhost.alvine.dev:8443/development/issues/closed/276.html
*
@@ -90,7 +94,7 @@ class LocalePicker extends CustomElement {
/**
*
- * @return {Components.LocalePicker
+ * @return {LocalePicker}
*/
[assembleMethodSymbol]() {
super[assembleMethodSymbol]();
@@ -109,12 +113,16 @@ class LocalePicker extends CustomElement {
* @property {Object} templates Template definitions
* @property {string} templates.main Main template
* @property {Object} labels Label definitions
- * @property {Object} actions Callbacks
- * @property {string} actions.click="throw Error" Callback when clicked
+ * @property {string} labels.headline Headline
+ * @property {string} labels.text Text
+ * @property {string} labels.button-label Button label
+ * @property {string} labels.button-no-thanks Button no thanks
+ * @property {string} labels.headline-other Headline other languages
+ * @property {Function} callbacks.getTranslation Callback to get the translation for the labels
* @property {Object} features Features
- * @property {boolean} features.removeOnSelected=false Remove the element when a language is selected
- * @property {Object} classes CSS classes
- * @property {boolean} disabled=false Disabled state
+ * @property {boolean} features.removeOnSelected Remove the element when a language is selected
+ * @property {boolean} features.showAlways Show the element always
+ * @property {boolean} disabled Disabled state
*/
get defaults() {
return Object.assign({}, super.defaults, {
@@ -122,21 +130,21 @@ class LocalePicker extends CustomElement {
main: getTemplate(),
},
labels: {
- "headline": "Welcome to our Website",
- "text": "This page is currently displayed in ${currentLabel}. However, we also offer this page in your preferred language. Would you like to switch?",
+ headline: "Welcome to our Website",
+ text: "This page is currently displayed in ${currentLabel}. However, we also offer this page in your preferred language. Would you like to switch?",
"button-label": "Switch to ${preferred.label}",
"button-no-thanks": "No, thanks",
"headline-other": "Other languages",
},
- classes: {},
+
+ callbacks: {
+ "getTranslation": getTranslation,
+ },
+
disabled: false,
features: {
removeOnSelected: false,
- },
- actions: {
- click: () => {
- throw new Error("the click action is not defined");
- },
+ showAlways: false,
},
});
}
@@ -145,60 +153,92 @@ class LocalePicker extends CustomElement {
* Private method that provides a mapping of transformer methods keyed by their names.
* These transformer methods define custom transformations for given input values.
*
- * @returns {Object} An object containing transformer methods. Each method is keyed by its name.
- * The provided transformer "my-transformer" processes an input value based on its type:
- * - Appends "!" if the value is a string.
- * - Increments the value by 1 if the type is "Zahl".
- * - Returns the value unchanged for other types.
+ * @private
+ * @return {Object} An object containing transformer methods for internal use.
*/
[updaterTransformerMethodsSymbol]() {
return {
"replace-placeholder": (value) => {
- const formatter = new Formatter(this[detectedLanguagesSymbol])
+ const formatter = new Formatter(this[detectedLanguagesSymbol]);
return formatter.format(value);
-
- }
+ },
};
- };
-
+ }
/**
* Lifecycle method that is called when the custom element is appended into a document-connected element.
* Invokes the parent class's connectedCallback method and retrieves the user's preferred language.
* Logs the preferred language to the console.
*
- * @return {void} This method does not return a value.
+ * @return {void}
*/
connectedCallback() {
super.connectedCallback();
this[detectedLanguagesSymbol] = detectUserLanguagePreference();
+ if (!isObject(this[detectedLanguagesSymbol]?.preferred) && this.getOption("features.showAlways") !== true) {
+ this.hide();
+
+ if (this.getOption("features.removeOnSelected")) {
+ this.remove();
+ }
+ return;
+ }
+
+ if (!isObject(this[detectedLanguagesSymbol]?.preferred)) {
+ this[detectedLanguagesSymbol].preferred = {
+ fullLang: "en",
+ baseLang: "en",
+ label: "English",
+ }
+ }
+
const stored = localStorage.getItem(buildStorageKey.call(this));
- if (stored) {
+ if (stored&& this.getOption("features.showAlways") !== true) {
if (this.getOption("features.removeOnSelected")) {
this.remove();
}
return;
}
- this.style.display = "block";
+ this.show();
- if (this[otherLanguagesElementSymbol] instanceof HTMLElement &&
+ if (
+ this[otherLanguagesElementSymbol] instanceof HTMLElement &&
this[detectedLanguagesSymbol].offerable &&
- this[detectedLanguagesSymbol].offerable.length > 1) {
+ this[detectedLanguagesSymbol].offerable.length > 1
+ ) {
this[otherLanguagesElementSymbol].classList.remove("hidden");
- this[otherLanguagesElementSymbol].setOption('mapping.labelTemplate', '${label}')
- this[otherLanguagesElementSymbol].setOption('mapping.valueTemplate', '${href}')
- this[otherLanguagesElementSymbol].importOptions(this[detectedLanguagesSymbol]?.offerable || []);
+ this[otherLanguagesElementSymbol].setOption(
+ "mapping.labelTemplate",
+ "${label}",
+ );
+ this[otherLanguagesElementSymbol].setOption(
+ "mapping.valueTemplate",
+ "${href}",
+ );
+ this[otherLanguagesElementSymbol].importOptions(
+ this[detectedLanguagesSymbol]?.offerable || [],
+ );
}
- const translations = getTranslation(this[detectedLanguagesSymbol].offerable[0].baseLang);
- this.setOption('labels', translations.labels);
- if (this[otherLanguagesElementSymbol]) {
- this[otherLanguagesElementSymbol].setOption('labels.select-an-option', translations.selectAnOption);
+ if (this[detectedLanguagesSymbol].offerable && this[detectedLanguagesSymbol].offerable.length > 0) {
+ const getTranslationCallback = this.getOption("callbacks.getTranslation");
+ if (isFunction(getTranslationCallback)) {
+ const translations = getTranslationCallback(
+ this[detectedLanguagesSymbol].offerable[0].baseLang,
+ );
+
+ this.setOption("labels", translations.labels);
+ if (this[otherLanguagesElementSymbol]) {
+ this[otherLanguagesElementSymbol].setOption(
+ "labels.select-an-option",
+ translations.selectAnOption,
+ );
+ }
+ }
}
-
}
/**
@@ -208,6 +248,38 @@ class LocalePicker extends CustomElement {
*/
reset() {
localStorage.removeItem(buildStorageKey.call(this));
+ this.show();
+ return this;
+ }
+
+ /**
+ * Hides the locale picker.
+ *
+ * @returns {LocalePicker}
+ */
+ hide() {
+ this.style.display = "none";
+
+ if(!this[localePickerElementSymbol]) {
+ return this;
+ }
+
+ this[localePickerElementSymbol].style.display = "none";
+ return this;
+ }
+
+ /**
+ * Shows the locale picker.
+ * @returns {LocalePicker}
+ */
+ show() {
+ this.style.display = "block";
+
+ if(!this[localePickerElementSymbol]) {
+ return this;
+ }
+
+ this[localePickerElementSymbol].style.display = "block";
return this;
}
@@ -260,20 +332,20 @@ function initEventHandler() {
callback.call(self, event);
});
- this[buttonNoThanksElementSymbol].setOption('actions.click', () => {
+ this[buttonNoThanksElementSymbol].setOption("actions.click", () => {
localStorage.setItem(buildStorageKey.call(this), "1");
- this.style.display = "none";
+ this.hide();
if (this.getOption("features.removeOnSelected")) {
this.remove();
}
});
- this[buttonLanguageElementSymbol].setOption('actions.click', () => {
+ this[buttonLanguageElementSymbol].setOption("actions.click", () => {
localStorage.setItem(buildStorageKey.call(this), "1");
- window.location.href = this[detectedLanguagesSymbol].offerable[0].href;
+ window.location.href = this[detectedLanguagesSymbol].offerable?.[0]?.href;
});
- this[otherLanguagesElementSymbol].addEventListener('change', (event) => {
+ this[otherLanguagesElementSymbol].addEventListener("change", (event) => {
const element = findTargetElementFromEvent(
event,
ATTRIBUTE_ROLE,
@@ -281,14 +353,13 @@ function initEventHandler() {
);
if (element) {
- const selected = element.value;
+ const selected = element?.value;
if (selected) {
localStorage.setItem(buildStorageKey.call(this), "1");
window.location.href = selected;
}
}
-
- })
+ });
return this;
}
@@ -298,7 +369,7 @@ function initEventHandler() {
* @returns {string}
*/
function buildStorageKey() {
- return 'locale-picker-' + this[detectedLanguagesSymbol].current;
+ return "locale-picker-" + this[detectedLanguagesSymbol].current;
}
/**
@@ -308,246 +379,243 @@ function buildStorageKey() {
*/
function getTranslation(lang) {
const map = {
- "en": {
- "headline": "Welcome to our Website",
- "text": "This page is currently displayed in ${currentLabel}. However, we also offer this page in your preferred language. Would you like to switch?",
+ en: {
+ headline: "Welcome to our Website",
+ text: "This page is currently displayed in ${currentLabel}. However, we also offer this page in your preferred language. Would you like to switch?",
"button-label": "Switch to ${preferred.label}",
"button-no-thanks": "No, thanks",
- "headline-other": "Other languages"
+ "headline-other": "Other languages",
},
- "de": {
- "headline": "Willkommen auf unserer Webseite",
- "text": "Diese Seite wird aktuell auf ${currentLabel} angezeigt. Wir bieten jedoch auch diese Seite in Ihrer bevorzugten Sprache an. Möchten Sie wechseln?",
+ de: {
+ headline: "Willkommen auf unserer Webseite",
+ text: "Diese Seite wird aktuell auf ${currentLabel} angezeigt. Wir bieten jedoch auch diese Seite in Ihrer bevorzugten Sprache an. Möchten Sie wechseln?",
"button-label": "Wechseln zu ${preferred.label}",
"button-no-thanks": "Nein, danke",
- "headline-other": "Andere Sprachen"
+ "headline-other": "Andere Sprachen",
},
- "fr": {
- "headline": "Bienvenue sur notre site web",
- "text": "Cette page est actuellement affichée en ${currentLabel}. Cependant, nous proposons également cette page dans votre langue préférée. Souhaitez-vous changer?",
+ fr: {
+ headline: "Bienvenue sur notre site web",
+ text: "Cette page est actuellement affichée en ${currentLabel}. Cependant, nous proposons également cette page dans votre langue préférée. Souhaitez-vous changer?",
"button-label": "Changer pour ${preferred.label}",
"button-no-thanks": "Non, merci",
- "headline-other": "Autres langues"
+ "headline-other": "Autres langues",
},
- "es": {
- "headline": "Bienvenido a nuestro sitio web",
- "text": "Esta página se muestra actualmente en ${currentLabel}. Sin embargo, también ofrecemos esta página en su idioma preferido. ¿Le gustaría cambiar?",
+ es: {
+ headline: "Bienvenido a nuestro sitio web",
+ text: "Esta página se muestra actualmente en ${currentLabel}. Sin embargo, también ofrecemos esta página en su idioma preferido. ¿Le gustaría cambiar?",
"button-label": "Cambiar a ${preferred.label}",
"button-no-thanks": "No, gracias",
- "headline-other": "Otros idiomas"
+ "headline-other": "Otros idiomas",
},
- "it": {
- "headline": "Benvenuti sul nostro sito web",
- "text": "Questa pagina è attualmente visualizzata in ${currentLabel}. Tuttavia, offriamo anche questa pagina nella tua lingua preferita. Vuoi cambiare?",
+ it: {
+ headline: "Benvenuti sul nostro sito web",
+ text: "Questa pagina è attualmente visualizzata in ${currentLabel}. Tuttavia, offriamo anche questa pagina nella tua lingua preferita. Vuoi cambiare?",
"button-label": "Cambia nella ${preferred.label}",
"button-no-thanks": "No, grazie",
- "headline-other": "Altre lingue"
+ "headline-other": "Altre lingue",
},
- "pt": {
- "headline": "Bem-vindo ao nosso site",
- "text": "Esta página está atualmente exibida em ${currentLabel}. No entanto, também oferecemos esta página no seu idioma preferido. Gostaria de mudar?",
+ pt: {
+ headline: "Bem-vindo ao nosso site",
+ text: "Esta página está atualmente exibida em ${currentLabel}. No entanto, também oferecemos esta página no seu idioma preferido. Gostaria de mudar?",
"button-label": "Mudar para ${preferred.label}",
"button-no-thanks": "Não, obrigado",
- "headline-other": "Outros idiomas"
+ "headline-other": "Outros idiomas",
},
- "nl": {
- "headline": "Welkom op onze website",
- "text": "Deze pagina wordt momenteel weergegeven in ${currentLabel}. We bieden deze pagina echter ook aan in uw voorkeurstaal. Wilt u overschakelen?",
+ nl: {
+ headline: "Welkom op onze website",
+ text: "Deze pagina wordt momenteel weergegeven in ${currentLabel}. We bieden deze pagina echter ook aan in uw voorkeurstaal. Wilt u overschakelen?",
"button-label": "Overschakelen naar ${preferred.label}",
"button-no-thanks": "Nee, bedankt",
- "headline-other": "Andere talen"
+ "headline-other": "Andere talen",
},
- "pl": {
- "headline": "Witamy na naszej stronie",
- "text": "Ta strona jest obecnie wyświetlana po ${currentLabel}. Oferujemy jednak również tę stronę w Twoim preferowanym języku. Czy chcesz przełączyć?",
+ pl: {
+ headline: "Witamy na naszej stronie",
+ text: "Ta strona jest obecnie wyświetlana po ${currentLabel}. Oferujemy jednak również tę stronę w Twoim preferowanym języku. Czy chcesz przełączyć?",
"button-label": "Przełącz na ${preferred.label}",
"button-no-thanks": "Nie, dziękuję",
- "headline-other": "Inne języki"
+ "headline-other": "Inne języki",
},
- "ru": {
- "headline": "Добро пожаловать на наш сайт",
- "text": "Эта страница в настоящее время отображается на ${currentLabel}. Однако мы также предлагаем эту страницу на вашем предпочтительном языке. Хотите переключиться?",
+ ru: {
+ headline: "Добро пожаловать на наш сайт",
+ text: "Эта страница в настоящее время отображается на ${currentLabel}. Однако мы также предлагаем эту страницу на вашем предпочтительном языке. Хотите переключиться?",
"button-label": "Переключиться на ${preferred.label}",
"button-no-thanks": "Нет, спасибо",
- "headline-other": "Другие языки"
+ "headline-other": "Другие языки",
},
- "cs": {
- "headline": "Vítejte na našem webu",
- "text": "Tato stránka je aktuálně zobrazena v ${currentLabel}. Nabízíme však tuto stránku také ve vašem preferovaném jazyce. Chcete přejít?",
+ cs: {
+ headline: "Vítejte na našem webu",
+ text: "Tato stránka je aktuálně zobrazena v ${currentLabel}. Nabízíme však tuto stránku také ve vašem preferovaném jazyce. Chcete přejít?",
"button-label": "Přejít na ${preferred.label}",
"button-no-thanks": "Ne, děkuji",
- "headline-other": "Další jazyky"
+ "headline-other": "Další jazyky",
},
- "sk": {
- "headline": "Vitajte na našej webovej stránke",
- "text": "Táto stránka je v súčasnosti zobrazená v ${currentLabel}. Ponúkame však túto stránku aj vo vašom preferovanom jazyku. Chcete prejsť?",
+ sk: {
+ headline: "Vitajte na našej webovej stránke",
+ text: "Táto stránka je v súčasnosti zobrazená v ${currentLabel}. Ponúkame však túto stránku aj vo vašom preferovanom jazyku. Chcete prejsť?",
"button-label": "Prepnúť na ${preferred.label}",
"button-no-thanks": "Nie, ďakujem",
- "headline-other": "Iné jazyky"
+ "headline-other": "Iné jazyky",
},
-
- "bg": {
- "headline": "Добре дошли на нашия уебсайт",
- "text": "Тази страница в момента се показва на ${currentLabel}. Въпреки това, предлагаме също тази страница на Вашия предпочитан език. Желаете ли да превключите?",
+ bg: {
+ headline: "Добре дошли на нашия уебсайт",
+ text: "Тази страница в момента се показва на ${currentLabel}. Въпреки това, предлагаме също тази страница на Вашия предпочитан език. Желаете ли да превключите?",
"button-label": "Превключете на ${preferred.label}",
"button-no-thanks": "Не, благодаря",
- "headline-other": "Други езици"
+ "headline-other": "Други езици",
},
- "hr": {
- "headline": "Dobrodošli na našu web stranicu",
- "text": "Ova stranica trenutno je prikazana na ${currentLabel}. Međutim, nudimo i ovu stranicu na vašem preferiranom jeziku. Želite li prebaciti?",
+ hr: {
+ headline: "Dobrodošli na našu web stranicu",
+ text: "Ova stranica trenutno je prikazana na ${currentLabel}. Međutim, nudimo i ovu stranicu na vašem preferiranom jeziku. Želite li prebaciti?",
"button-label": "Prebaci na ${preferred.label}",
"button-no-thanks": "Ne, hvala",
- "headline-other": "Drugi jezici"
+ "headline-other": "Drugi jezici",
},
- "fi": {
- "headline": "Tervetuloa verkkosivustollemme",
- "text": "Tämä sivu on tällä hetkellä näkyvissä ${currentLabel}. Tarjoamme kuitenkin tätä sivua myös suosimallasi kielellä. Haluaisitko vaihtaa?",
+ fi: {
+ headline: "Tervetuloa verkkosivustollemme",
+ text: "Tämä sivu on tällä hetkellä näkyvissä ${currentLabel}. Tarjoamme kuitenkin tätä sivua myös suosimallasi kielellä. Haluaisitko vaihtaa?",
"button-label": "Vaihda ${preferred.label}",
"button-no-thanks": "Ei kiitos",
- "headline-other": "Muut kielet"
+ "headline-other": "Muut kielet",
},
- "sv": {
- "headline": "Välkommen till vår webbplats",
- "text": "Denna sida visas för närvarande på ${currentLabel}. Vi erbjuder dock även denna sida på ditt föredragna språk. Skulle du vilja byta?",
+ sv: {
+ headline: "Välkommen till vår webbplats",
+ text: "Denna sida visas för närvarande på ${currentLabel}. Vi erbjuder dock även denna sida på ditt föredragna språk. Skulle du vilja byta?",
"button-label": "Byt till ${preferred.label}",
"button-no-thanks": "Nej tack",
- "headline-other": "Andra språk"
+ "headline-other": "Andra språk",
},
- "el": {
- "headline": "Καλώς ήρθατε στην ιστοσελίδα μας",
- "text": "Αυτή η σελίδα εμφανίζεται προς το παρόν στα ${currentLabel}. Ωστόσο, προσφέρουμε επίσης αυτή τη σελίδα στην προτιμώμενη γλώσσα σας. Θα θέλατε να αλλάξετε;",
+ el: {
+ headline: "Καλώς ήρθατε στην ιστοσελίδα μας",
+ text: "Αυτή η σελίδα εμφανίζεται προς το παρόν στα ${currentLabel}. Ωστόσο, προσφέρουμε επίσης αυτή τη σελίδα στην προτιμώμενη γλώσσα σας. Θα θέλατε να αλλάξετε;",
"button-label": "Αλλαγή σε ${preferred.label}",
"button-no-thanks": "Όχι, ευχαριστώ",
- "headline-other": "Άλλες γλώσσες"
+ "headline-other": "Άλλες γλώσσες",
},
- "hu": {
- "headline": "Üdvözöljük weboldalunkon",
- "text": "Ez az oldal jelenleg ${currentLabel} nyelven jelenik meg. Azonban kínáljuk ezt az oldalt a preferált nyelvén is. Szeretne váltani?",
+ hu: {
+ headline: "Üdvözöljük weboldalunkon",
+ text: "Ez az oldal jelenleg ${currentLabel} nyelven jelenik meg. Azonban kínáljuk ezt az oldalt a preferált nyelvén is. Szeretne váltani?",
"button-label": "Váltás ${preferred.label} nyelvre",
"button-no-thanks": "Nem, köszönöm",
- "headline-other": "További nyelvek"
+ "headline-other": "További nyelvek",
},
- "ro": {
- "headline": "Bine ați venit pe site-ul nostru",
- "text": "Această pagină este afișată în prezent în ${currentLabel}. Totuși, oferim de asemenea această pagină în limba dumneavoastră preferată. Doriți să schimbați?",
+ ro: {
+ headline: "Bine ați venit pe site-ul nostru",
+ text: "Această pagină este afișată în prezent în ${currentLabel}. Totuși, oferim de asemenea această pagină în limba dumneavoastră preferată. Doriți să schimbați?",
"button-label": "Schimbați în ${preferred.label}",
"button-no-thanks": "Nu, mulțumesc",
- "headline-other": "Alte limbi"
+ "headline-other": "Alte limbi",
},
- "da": {
- "headline": "Velkommen til vores hjemmeside",
- "text": "Denne side vises i øjeblikket på ${currentLabel}. Vi tilbyder dog også denne side på dit foretrukne sprog. Vil du skifte?",
+ da: {
+ headline: "Velkommen til vores hjemmeside",
+ text: "Denne side vises i øjeblikket på ${currentLabel}. Vi tilbyder dog også denne side på dit foretrukne sprog. Vil du skifte?",
"button-label": "Skift til ${preferred.label}",
"button-no-thanks": "Nej tak",
- "headline-other": "Andre sprog"
+ "headline-other": "Andre sprog",
},
- "no": {
- "headline": "Velkommen til vår nettside",
- "text": "Denne siden vises for øyeblikket på ${currentLabel}. Vi tilbyr imidlertid også denne siden på ditt foretrukne språk. Ønsker du å bytte?",
+ no: {
+ headline: "Velkommen til vår nettside",
+ text: "Denne siden vises for øyeblikket på ${currentLabel}. Vi tilbyr imidlertid også denne siden på ditt foretrukne språk. Ønsker du å bytte?",
"button-label": "Bytt til ${preferred.label}",
"button-no-thanks": "Nei, takk",
- "headline-other": "Andre språk"
+ "headline-other": "Andre språk",
},
- "hi": {
- "headline": "हमारी वेबसाइट पर आपका स्वागत है",
- "text": "यह पृष्ठ वर्तमान में ${currentLabel} में प्रदर्शित हो रहा है। हालांकि, हम इस पृष्ठ को आपकी पसंदीदा भाषा में भी प्रदान करते हैं। क्या आप स्विच करना चाहेंगे?",
+ hi: {
+ headline: "हमारी वेबसाइट पर आपका स्वागत है",
+ text: "यह पृष्ठ वर्तमान में ${currentLabel} में प्रदर्शित हो रहा है। हालांकि, हम इस पृष्ठ को आपकी पसंदीदा भाषा में भी प्रदान करते हैं। क्या आप स्विच करना चाहेंगे?",
"button-label": "${preferred.label} में स्विच करें",
"button-no-thanks": "नहीं, धन्यवाद",
- "headline-other": "अन्य भाषाएँ"
+ "headline-other": "अन्य भाषाएँ",
},
- "bn": {
- "headline": "আমাদের ওয়েবসাইটে আপনাকে স্বাগতম",
- "text": "এই পৃষ্ঠাটি বর্তমানে ${currentLabel} প্রদর্শিত হচ্ছে। তবে, আমরা এই পৃষ্ঠাটি আপনার পছন্দের ভাষায়ও অফার করি। আপনি কি সুইচ করতে চান?",
+ bn: {
+ headline: "আমাদের ওয়েবসাইটে আপনাকে স্বাগতম",
+ text: "এই পৃষ্ঠাটি বর্তমানে ${currentLabel} প্রদর্শিত হচ্ছে। তবে, আমরা এই পৃষ্ঠাটি আপনার পছন্দের ভাষায়ও অফার করি। আপনি কি সুইচ করতে চান?",
"button-label": "${preferred.label}-এ সুইচ করুন",
"button-no-thanks": "না, ধন্যবাদ",
- "headline-other": "অন্যান্য ভাষাসমূহ"
+ "headline-other": "অন্যান্য ভাষাসমূহ",
},
- "ta": {
- "headline": "எங்கள் இணையதளத்திற்கு வருக",
- "text": "இந்த பக்கம் தற்போது ${currentLabel} என்ற மொழியில் காட்சியளிக்கப்படுகிறது. எனினும், நாங்கள் இந்த பக்கத்தை உங்கள் விருப்ப மொழியிலும் வழங்குகிறோம். நீங்கள் மாற்ற விரும்புகிறீர்களா?",
+ ta: {
+ headline: "எங்கள் இணையதளத்திற்கு வருக",
+ text: "இந்த பக்கம் தற்போது ${currentLabel} என்ற மொழியில் காட்சியளிக்கப்படுகிறது. எனினும், நாங்கள் இந்த பக்கத்தை உங்கள் விருப்ப மொழியிலும் வழங்குகிறோம். நீங்கள் மாற்ற விரும்புகிறீர்களா?",
"button-label": "${preferred.label}-க்கு மாற்றவும்",
"button-no-thanks": "இல்லை, நன்றி",
- "headline-other": "மற்ற மொழிகள்"
+ "headline-other": "மற்ற மொழிகள்",
},
- "te": {
- "headline": "మా వెబ్సైట్కు స్వాగతం",
- "text": "ఈ పేజీ ప్రస్తుతం ${currentLabel}లో ప్రదర్శితం అవుతున్నది. అయితే, మేము ఈ పేజీని మీ ఇష్టపడే భాషలో కూడా అందిస్తున్నాము. మీరు మార్చాలనుకుంటున్నారా?",
+ te: {
+ headline: "మా వెబ్సైట్కు స్వాగతం",
+ text: "ఈ పేజీ ప్రస్తుతం ${currentLabel}లో ప్రదర్శితం అవుతున్నది. అయితే, మేము ఈ పేజీని మీ ఇష్టపడే భాషలో కూడా అందిస్తున్నాము. మీరు మార్చాలనుకుంటున్నారా?",
"button-label": "${preferred.label}కి మార్చండి",
"button-no-thanks": "కాదు, ధన్యవాదాలు",
- "headline-other": "ఇతర భాషలు"
+ "headline-other": "ఇతర భాషలు",
},
- "mr": {
- "headline": "आपले आमच्या वेबसाइटवर स्वागत आहे",
- "text": "हे पान सध्या ${currentLabel}मध्ये दाखविले जात आहे. परंतु, आम्ही हे पान आपल्या पसंतीच्या भाषेतही देत आहोत. आपण स्विच करू इच्छिता का?",
+ mr: {
+ headline: "आपले आमच्या वेबसाइटवर स्वागत आहे",
+ text: "हे पान सध्या ${currentLabel}मध्ये दाखविले जात आहे. परंतु, आम्ही हे पान आपल्या पसंतीच्या भाषेतही देत आहोत. आपण स्विच करू इच्छिता का?",
"button-label": "${preferred.label}मध्ये स्विच करा",
"button-no-thanks": "नाही, धन्यवाद",
- "headline-other": "इतर भाषा"
+ "headline-other": "इतर भाषा",
},
- "zh": {
- "headline": "欢迎访问我们的网站",
- "text": "本页面当前显示为${currentLabel}。然而，我们还提供您偏好的语言版本。您想切换吗？",
+ zh: {
+ headline: "欢迎访问我们的网站",
+ text: "本页面当前显示为${currentLabel}。然而，我们还提供您偏好的语言版本。您想切换吗？",
"button-label": "切换到${preferred.label}",
"button-no-thanks": "不，谢谢",
- "headline-other": "其他语言"
+ "headline-other": "其他语言",
},
- "ja": {
- "headline": "私たちのウェブサイトへようこそ",
- "text": "このページは現在${currentLabel}で表示されています。しかし、私たちはあなたの好みの言語でこのページを提供しています。切り替えますか？",
+ ja: {
+ headline: "私たちのウェブサイトへようこそ",
+ text: "このページは現在${currentLabel}で表示されています。しかし、私たちはあなたの好みの言語でこのページを提供しています。切り替えますか？",
"button-label": "${preferred.label}に切り替える",
"button-no-thanks": "いいえ、結構です",
- "headline-other": "他の言語"
- }
- }
+ "headline-other": "他の言語",
+ },
+ };
const selectAnOption = {
- "en": "Select a language",
- "de": "Wählen Sie eine Sprache",
- "fr": "Sélectionnez une langue",
- "es": "Seleccione un idioma",
- "it": "Seleziona una lingua",
- "pt": "Selecione um idioma",
- "nl": "Selecteer een taal",
- "pl": "Wybierz język",
- "ru": "Выберите язык",
- "cs": "Vyberte jazyk",
- "sk": "Vyberte jazyk",
- "bg": "Изберете език",
- "hr": "Odaberite jezik",
- "fi": "Valitse kieli",
- "sv": "Välj ett språk",
- "el": "Επιλέξτε γλώσσα",
- "hu": "Válasszon egy nyelvet",
- "ro": "Selectați o limbă",
- "da": "Vælg et sprog",
- "no": "Velg et språk",
- "hi": "एक भाषा चुनें",
- "bn": "একটি ভাষা নির্বাচন করুন",
- "ta": "ஒரு மொழியைத் தேர்ந்தெடுக்கவும்",
- "te": "భాషను ఎంచుకోండి",
- "mr": "एक भाषा निवडा",
- "zh": "选择一种语言",
- "ja": "言語を選択してください"
+ en: "Select a language",
+ de: "Wählen Sie eine Sprache",
+ fr: "Sélectionnez une langue",
+ es: "Seleccione un idioma",
+ it: "Seleziona una lingua",
+ pt: "Selecione um idioma",
+ nl: "Selecteer een taal",
+ pl: "Wybierz język",
+ ru: "Выберите язык",
+ cs: "Vyberte jazyk",
+ sk: "Vyberte jazyk",
+ bg: "Изберете език",
+ hr: "Odaberite jezik",
+ fi: "Valitse kieli",
+ sv: "Välj ett språk",
+ el: "Επιλέξτε γλώσσα",
+ hu: "Válasszon egy nyelvet",
+ ro: "Selectați o limbă",
+ da: "Vælg et sprog",
+ no: "Velg et språk",
+ hi: "एक भाषा चुनें",
+ bn: "একটি ভাষা নির্বাচন করুন",
+ ta: "ஒரு மொழியைத் தேர்ந்தெடுக்கவும்",
+ te: "భాషను ఎంచుకోండి",
+ mr: "एक भाषा निवडा",
+ zh: "选择一种语言",
+ ja: "言語を選択してください",
};
- const result = {}
+ const result = {};
if (map[lang]) {
- result['labels'] = map[lang];
+ result["labels"] = map[lang];
} else {
- result['labels'] = map['en'];
+ result["labels"] = map["en"];
}
if (selectAnOption[lang]) {
- result['selectAnOption'] = selectAnOption[lang];
+ result["selectAnOption"] = selectAnOption[lang];
} else {
- result['selectAnOption'] = selectAnOption['en'];
+ result["selectAnOption"] = selectAnOption["en"];
}
return result;
-
-
}
/**
@@ -560,21 +628,18 @@ function initControlReferences() {
);
this[otherLanguagesElementSymbol] = this.shadowRoot.querySelector(
- `[${ATTRIBUTE_ROLE}="other-languages"]`
+ `[${ATTRIBUTE_ROLE}="other-languages"]`,
);
this[buttonNoThanksElementSymbol] = this.shadowRoot.querySelector(
- `[${ATTRIBUTE_ROLE}="button-no-thanks"]`
+ `[${ATTRIBUTE_ROLE}="button-no-thanks"]`,
);
this[buttonLanguageElementSymbol] = this.shadowRoot.querySelector(
- `[${ATTRIBUTE_ROLE}="button-language"]`
+ `[${ATTRIBUTE_ROLE}="button-language"]`,
);
-
-
}
-
/**
* @private
* @return {string}
diff --git a/source/components/accessibility/stylesheet/locale-picker.mjs b/source/components/accessibility/stylesheet/locale-picker.mjs
index 192a2f44c..f5647bc0f 100644
--- a/source/components/accessibility/stylesheet/locale-picker.mjs
+++ b/source/components/accessibility/stylesheet/locale-picker.mjs
@@ -10,10 +10,10 @@
* For more information about purchasing a commercial license, please contact schukai GmbH.
*/
-import {addAttributeToken} from "../../../dom/attributes.mjs";
-import {ATTRIBUTE_ERRORMESSAGE} from "../../../dom/constants.mjs";
+import { addAttributeToken } from "../../../dom/attributes.mjs";
+import { ATTRIBUTE_ERRORMESSAGE } from "../../../dom/constants.mjs";
-export {LocalePickerStyleSheet}
+export { LocalePickerStyleSheet };
/**
* @private
@@ -22,10 +22,17 @@ export {LocalePickerStyleSheet}
const LocalePickerStyleSheet = new CSSStyleSheet();
try {
- LocalePickerStyleSheet.insertRule(`
+ LocalePickerStyleSheet.insertRule(
+ `
@layer localepicker {
:where(html){line-height:1.15;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}:where(h1){font-size:2em;margin-block-end:.67em;margin-block-start:.67em}:where(dl,ol,ul) :where(dl,ol,ul){margin-block-end:0;margin-block-start:0}:where(hr){box-sizing:content-box;color:inherit;height:0}:where(abbr[title]){text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,pre,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(table){border-color:currentColor;text-indent:0}:where(button,input,select){margin:0}:where(button){text-transform:none}:where(button,input:is([type=button i],[type=reset i],[type=submit i])){-webkit-appearance:button}:where(progress){vertical-align:baseline}:where(select){text-transform:none}:where(textarea){margin:0}:where(input[type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focus-inner{border-style:none;padding:0}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focusring{outline:1px dotted ButtonText}:where(:-moz-ui-invalid){box-shadow:none}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(summary){display:list-item}html{height:100%}body,html{min-height:calc(100vh - 40px)}body{box-sizing:border-box;margin:0;padding:0;word-break:break-word}body:focus-visible{outline:none}:focus-visible{outline:none}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.grid{display:grid}.inline-grid{display:inline-grid}.flex{display:flex}.inline-flex{display:inline-flex}.hidden,.hide,.none{display:none}.visible{visibility:visible}.invisible{visibility:hidden}.monster-button-primary,button{align-items:center;background-color:var(--monster-bg-color-primary-1);background-position:50%;border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);color:var(--monster-color-primary-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-primary{background-color:var(--monster-bg-color-primary-4);border-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-button-secondary{background-color:var(--monster-bg-color-primary-1);background-color:var(--monster-bg-color-secondary-4);border-color:var(--monster-bg-color-secondary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-primary-1);color:var(--monster-color-secondary-4)}.monster-button-secondary,.monster-button-tertiary{align-items:center;background-position:50%;box-shadow:var(--monster-box-shadow-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-tertiary{background-color:var(--monster-bg-color-primary-1);background-color:var(--monster-bg-color-tertiary-4);border-color:var(--monster-bg-color-tertiary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-primary-1);color:var(--monster-color-tertiary-4)}.monster-button-outline-primary{background-color:var(--monster-bg-color-primary-1);background-color:var(--monster-color-primary-4);border-color:var(--monster-bg-color-primary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-primary-1);color:var(--monster-bg-color-primary-4)}.monster-button-outline-primary,.monster-button-outline-secondary{align-items:center;background-position:50%;box-shadow:var(--monster-box-shadow-1);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}.monster-button-outline-secondary{background-color:var(--monster-bg-color-primary-1);background-color:var(--monster-color-secondary-4);border-color:var(--monster-bg-color-secondary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);color:var(--monster-color-primary-1);color:var(--monster-bg-color-secondary-4)}.monster-button-outline-tertiary{align-items:center;background-color:var(--monster-bg-color-primary-1);background-color:var(--monster-color-tertiary-4);background-position:50%;border-color:var(--monster-bg-color-tertiary-4);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style);border-width:var(--monster-border-width);box-shadow:var(--monster-box-shadow-1);color:var(--monster-color-primary-1);color:var(--monster-bg-color-tertiary-4);cursor:pointer;display:flex;font-family:var(--monster-font-family);font-size:1rem;font-weight:400;gap:.4rem;justify-content:center;line-height:1.5;outline:none;overflow:hidden;padding:.375rem .75rem;position:relative;text-align:center;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:-webkit-fill-available;width:-moz-available;width:stretch}button:active,button:hover{box-shadow:var(--monster-box-shadow-2);transition:background .8s,color .25s .0833333333s}button:active{z-index:var(--monster-z-index-outline)}.monster-button-bar,.monster-button-group{align-content:center;align-items:stretch;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between}.monster-button-group{box-sizing:border-box;gap:0;margin:1rem 0}.monster-button-group>:not(:last-child){margin-right:calc(var(--monster-border-width)*-1)}.monster-button-group :hover{box-shadow:none}button:focus{outline:1px dashed var(--monster-color-selection-4);outline-offset:2px;z-index:var(--monster-z-index-outline)}@media (prefers-color-scheme:light){button:focus{outline:1px dashed var(--monster-color-selection-3);outline-offset:2px;z-index:var(--monster-z-index-outline)}}[data-monster-role=control]{box-sizing:border-box;outline:none;width:100%}[data-monster-role=control].flex{align-items:center;display:flex;flex-direction:row}:host{box-sizing:border-box;display:block}:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,\"Quicksand\",\"Segoe UI\",\"Roboto\",\"Oxygen\",\"Ubuntu\",\"Cantarell\",\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";--monster-font-family-monospace:\"Consolas\",\"Courier New\",\"Roboto Mono\",\"Source Code Pro\",\"Fira Mono\",monospace;--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-cinnamon-1);--monster-color-primary-4:var(--monster-color-cinnamon-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-6);--monster-bg-color-primary-4:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1)}}:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1)}}:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3)}}:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3)}}:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}}:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045;--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-theme-control-bg-color:var(--monster-color-seashell-1);--monster-theme-control-color:var(--monster-color-seashell-6);--monster-theme-control-hover-color:var(--monster-color-seashell-6);--monster-theme-control-hover-bg-color:var(--monster-color-seashell-2);--monster-theme-control-border-width:2px;--monster-theme-control-border-style:solid;--monster-theme-control-border-radius:0;--monster-theme-control-border-color:var(--monster-color-primary-1)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-control-bg-color:var(--monster-color-gray-5);--monster-theme-control-color:var(--monster-color-gray-1);--monster-theme-control-border-color:var(--monster-color-gray-3);--monster-theme-control-hover-color:var(--monster-color-gray-1);--monster-theme-control-hover-bg-color:var(--monster-color-gray-6)}}:after,:before,:root{--monster-theme-on-color:var(--monster-color-green-1);--monster-theme-on-bg-color:var(--monster-color-green-5);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-on-color:var(--monster-color-gray-6);--monster-theme-on-bg-color:var(--monster-color-gray-1);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-5)}}:after,:before,:root{--monster-border-style:solid;--monster-border-width:3px;--monster-border-radius:0;--monster-outline-width:1px;--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px;--monster-dragger-width:2px;--monster-dragger-handle-width:4px;--monster-dragger-handle-height:50px}span.monster-fx-ripple{animation:monster-fx-ripple .6s linear;background-color:hsla(0,0%,100%,.7);border-radius:50%;position:absolute;transform:scale(0)}@keyframes monster-fx-ripple{to{opacity:0;transform:scale(4)}}[data-monster-role=container]{display:grid;gap:.3rem;grid-template-columns:1fr 1fr;grid-template-rows:auto auto}[data-monster-role=button-language],[data-monster-role=button-no-thanks]{grid-row:1}[data-monster-role=other-languages]{grid-column:1/-1;grid-row:2}
-}`, 0);
+}`,
+ 0,
+ );
} catch (e) {
- addAttributeToken(document.getRootNode().querySelector('html'), ATTRIBUTE_ERRORMESSAGE, e + "");
+ addAttributeToken(
+ document.getRootNode().querySelector("html"),
+ ATTRIBUTE_ERRORMESSAGE,
+ e + "",
+ );
}
diff --git a/source/i18n/locale.mjs b/source/i18n/locale.mjs
index 12aa93808..524c89ec4 100644
--- a/source/i18n/locale.mjs
+++ b/source/i18n/locale.mjs
@@ -12,12 +12,12 @@
* SPDX-License-Identifier: AGPL-3.0
*/
-import {instanceSymbol} from "../constants.mjs";
-import {Base} from "../types/base.mjs";
-import {validateString} from "../types/validate.mjs";
-import {clone} from "../util/clone.mjs";
+import { instanceSymbol } from "../constants.mjs";
+import { Base } from "../types/base.mjs";
+import { validateString } from "../types/validate.mjs";
+import { clone } from "../util/clone.mjs";
-export {Locale, parseLocale};
+export { Locale, parseLocale };
/**
* @type {symbol}
@@ -69,116 +69,116 @@ const localeStringSymbol = Symbol("localeString");
* @see https://datatracker.ietf.org/doc/html/rfc3066
*/
class Locale extends Base {
- /**
- * @param {string} language
- * @param {string} [region]
- * @param {string} [script]
- * @param {string} [variants]
- * @param {string} [extlang]
- * @param {string} [privateUse]
- * @throws {Error} unsupported locale
- */
- constructor(language, region, script, variants, extlang, privateUse) {
- super();
+ /**
+ * @param {string} language
+ * @param {string} [region]
+ * @param {string} [script]
+ * @param {string} [variants]
+ * @param {string} [extlang]
+ * @param {string} [privateUse]
+ * @throws {Error} unsupported locale
+ */
+ constructor(language, region, script, variants, extlang, privateUse) {
+ super();
- this[propertiesSymbol] = {
- language: language === undefined ? undefined : validateString(language),
- script: script === undefined ? undefined : validateString(script),
- region: region === undefined ? undefined : validateString(region),
- variants: variants === undefined ? undefined : validateString(variants),
- extlang: extlang === undefined ? undefined : validateString(extlang),
- privateUse:
- privateUse === undefined ? undefined : validateString(privateUse),
- };
+ this[propertiesSymbol] = {
+ language: language === undefined ? undefined : validateString(language),
+ script: script === undefined ? undefined : validateString(script),
+ region: region === undefined ? undefined : validateString(region),
+ variants: variants === undefined ? undefined : validateString(variants),
+ extlang: extlang === undefined ? undefined : validateString(extlang),
+ privateUse:
+ privateUse === undefined ? undefined : validateString(privateUse),
+ };
- const s = [];
- if (language !== undefined) s.push(language);
- if (script !== undefined) s.push(script);
- if (region !== undefined) s.push(region);
- if (variants !== undefined) s.push(variants);
- if (extlang !== undefined) s.push(extlang);
- if (privateUse !== undefined) s.push(privateUse);
+ const s = [];
+ if (language !== undefined) s.push(language);
+ if (script !== undefined) s.push(script);
+ if (region !== undefined) s.push(region);
+ if (variants !== undefined) s.push(variants);
+ if (extlang !== undefined) s.push(extlang);
+ if (privateUse !== undefined) s.push(privateUse);
- if (s.length === 0) {
- throw new Error("unsupported locale");
- }
+ if (s.length === 0) {
+ throw new Error("unsupported locale");
+ }
- this[localeStringSymbol] = s.join("-");
- }
+ this[localeStringSymbol] = s.join("-");
+ }
- /**
- * This method is called by the `instanceof` operator.
- * @return {symbol}
- * @since 3.27.0
- */
- static get [instanceSymbol]() {
- return Symbol.for("@schukai/monster/i18n/locale@@instance");
- }
+ /**
+ * This method is called by the `instanceof` operator.
+ * @return {symbol}
+ * @since 3.27.0
+ */
+ static get [instanceSymbol]() {
+ return Symbol.for("@schukai/monster/i18n/locale@@instance");
+ }
- /**
- * @return {string}
- */
- get localeString() {
- return this[localeStringSymbol];
- }
+ /**
+ * @return {string}
+ */
+ get localeString() {
+ return this[localeStringSymbol];
+ }
- /**
- * @return {string|undefined}
- */
- get language() {
- return this[propertiesSymbol].language;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get language() {
+ return this[propertiesSymbol].language;
+ }
- /**
- * @return {string|undefined}
- */
- get region() {
- return this[propertiesSymbol].region;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get region() {
+ return this[propertiesSymbol].region;
+ }
- /**
- * @return {string|undefined}
- */
- get script() {
- return this[propertiesSymbol].script;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get script() {
+ return this[propertiesSymbol].script;
+ }
- /**
- * @return {string|undefined}
- */
- get variants() {
- return this[propertiesSymbol].variants;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get variants() {
+ return this[propertiesSymbol].variants;
+ }
- /**
- * @return {string|undefined}
- */
- get extlang() {
- return this[propertiesSymbol].extlang;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get extlang() {
+ return this[propertiesSymbol].extlang;
+ }
- /**
- * @return {string|undefined}
- */
- get privateUse() {
- return this[propertiesSymbol].privateValue;
- }
+ /**
+ * @return {string|undefined}
+ */
+ get privateUse() {
+ return this[propertiesSymbol].privateValue;
+ }
- /**
- * @return {string}
- */
- toString() {
- return `${this.localeString}`;
- }
+ /**
+ * @return {string}
+ */
+ toString() {
+ return `${this.localeString}`;
+ }
- /**
- * The structure has the following: language, script, region, variants, extlang, privateUse
- *
- * @return {Monster.I18n.LocaleMap}
- */
- getMap() {
- return clone(this[propertiesSymbol]);
- }
+ /**
+ * The structure has the following: language, script, region, variants, extlang, privateUse
+ *
+ * @return {Monster.I18n.LocaleMap}
+ */
+ getMap() {
+ return clone(this[propertiesSymbol]);
+ }
}
/**
@@ -260,63 +260,63 @@ class Locale extends Base {
* @throws {Error} unsupported locale
*/
function parseLocale(locale) {
- locale = validateString(locale).replace(/_/g, "-");
+ locale = validateString(locale).replace(/_/g, "-");
- let language;
- let region;
- let variants;
- let parts;
- let script;
- let extlang;
- const regexRegular =
- "(art-lojban|cel-gaulish|no-bok|no-nyn|zh-guoyu|zh-hakka|zh-min|zh-min-nan|zh-xiang)";
- const regexIrregular =
- "(en-GB-oed|i-ami|i-bnn|i-default|i-enochian|i-hak|i-klingon|i-lux|i-mingo|i-navajo|i-pwn|i-tao|i-tay|i-tsu|sgn-BE-FR|sgn-BE-NL|sgn-CH-DE)";
- const regexGrandfathered = `(${regexIrregular}|${regexRegular})`;
- const regexPrivateUse = "(x(-[A-Za-z0-9]{1,8})+)";
- const regexSingleton = "[0-9A-WY-Za-wy-z]";
- const regexExtension = `(${regexSingleton}(-[A-Za-z0-9]{2,8})+)`;
- const regexVariant = "([A-Za-z0-9]{5,8}|[0-9][A-Za-z0-9]{3})";
- const regexRegion = "([A-Za-z]{2}|[0-9]{3})";
- const regexScript = "([A-Za-z]{4})";
- const regexExtlang = "([A-Za-z]{3}(-[A-Za-z]{3}){0,2})";
- const regexLanguage = `(([A-Za-z]{2,3}(-${regexExtlang})?)|[A-Za-z]{4}|[A-Za-z]{5,8})`;
- const regexLangtag = `(${regexLanguage}(-${regexScript})?(-${regexRegion})?(-${regexVariant})*(-${regexExtension})*(-${regexPrivateUse})?)`;
- const regexLanguageTag = `^(${regexGrandfathered}|${regexLangtag}|${regexPrivateUse})$`;
- const regex = new RegExp(regexLanguageTag);
- let match;
+ let language;
+ let region;
+ let variants;
+ let parts;
+ let script;
+ let extlang;
+ const regexRegular =
+ "(art-lojban|cel-gaulish|no-bok|no-nyn|zh-guoyu|zh-hakka|zh-min|zh-min-nan|zh-xiang)";
+ const regexIrregular =
+ "(en-GB-oed|i-ami|i-bnn|i-default|i-enochian|i-hak|i-klingon|i-lux|i-mingo|i-navajo|i-pwn|i-tao|i-tay|i-tsu|sgn-BE-FR|sgn-BE-NL|sgn-CH-DE)";
+ const regexGrandfathered = `(${regexIrregular}|${regexRegular})`;
+ const regexPrivateUse = "(x(-[A-Za-z0-9]{1,8})+)";
+ const regexSingleton = "[0-9A-WY-Za-wy-z]";
+ const regexExtension = `(${regexSingleton}(-[A-Za-z0-9]{2,8})+)`;
+ const regexVariant = "([A-Za-z0-9]{5,8}|[0-9][A-Za-z0-9]{3})";
+ const regexRegion = "([A-Za-z]{2}|[0-9]{3})";
+ const regexScript = "([A-Za-z]{4})";
+ const regexExtlang = "([A-Za-z]{3}(-[A-Za-z]{3}){0,2})";
+ const regexLanguage = `(([A-Za-z]{2,3}(-${regexExtlang})?)|[A-Za-z]{4}|[A-Za-z]{5,8})`;
+ const regexLangtag = `(${regexLanguage}(-${regexScript})?(-${regexRegion})?(-${regexVariant})*(-${regexExtension})*(-${regexPrivateUse})?)`;
+ const regexLanguageTag = `^(${regexGrandfathered}|${regexLangtag}|${regexPrivateUse})$`;
+ const regex = new RegExp(regexLanguageTag);
+ let match;
- if ((match = regex.exec(locale)) !== null) {
- if (match.index === regex.lastIndex) {
- regex.lastIndex++;
- }
- }
+ if ((match = regex.exec(locale)) !== null) {
+ if (match.index === regex.lastIndex) {
+ regex.lastIndex++;
+ }
+ }
- if (match === undefined || match === null) {
- throw new Error("unsupported locale");
- }
+ if (match === undefined || match === null) {
+ throw new Error("unsupported locale");
+ }
- if (match[6] !== undefined) {
- language = match[6];
+ if (match[6] !== undefined) {
+ language = match[6];
- parts = language.split("-");
- if (parts.length > 1) {
- language = parts[0];
- extlang = parts[1];
- }
- }
+ parts = language.split("-");
+ if (parts.length > 1) {
+ language = parts[0];
+ extlang = parts[1];
+ }
+ }
- if (match[14] !== undefined) {
- region = match[14];
- }
+ if (match[14] !== undefined) {
+ region = match[14];
+ }
- if (match[12] !== undefined) {
- script = match[12];
- }
+ if (match[12] !== undefined) {
+ script = match[12];
+ }
- if (match[16] !== undefined) {
- variants = match[16];
- }
+ if (match[16] !== undefined) {
+ variants = match[16];
+ }
- return new Locale(language, region, script, variants, extlang);
+ return new Locale(language, region, script, variants, extlang);
}
diff --git a/source/i18n/map/languages.mjs b/source/i18n/map/languages.mjs
index 123bb6838..1660af365 100644
--- a/source/i18n/map/languages.mjs
+++ b/source/i18n/map/languages.mjs
@@ -13,92 +13,92 @@
*/
export const languages = {
- "en": "English",
- "en-GB": "English (United Kingdom)",
- "en-US": "English (United States)",
- "en-CA": "English (Canada)",
- "en-AU": "English (Australia)",
- "es": "Español",
- "es-ES": "Español (España)",
- "es-MX": "Español (México)",
- "es-AR": "Español (Argentina)",
- "zh": "中文",
- "zh-CN": "中文（简体）",
- "zh-TW": "中文（繁體）",
- "zh-HK": "中文（香港）",
- "fr": "Français",
- "fr-FR": "Français (France)",
- "fr-CA": "Français (Canada)",
- "fr-BE": "Français (Belgique)",
- "de": "Deutsch",
- "de-DE": "Deutsch (Deutschland)",
- "de-AT": "Deutsch (Österreich)",
- "de-CH": "Deutsch (Schweiz)",
- "ja": "日本語",
- "ru": "Русский",
- "ru-RU": "Русский (Россия)",
- "it": "Italiano",
- "it-IT": "Italiano (Italia)",
- "pt": "Português",
- "pt-PT": "Português (Portugal)",
- "pt-BR": "Português (Brasil)",
- "ko": "한국어",
- "ar": "العربية",
- "hi": "हिन्दी",
- "bn": "বাংলা",
- "pa": "ਪੰਜਾਬੀ",
- "id": "Bahasa Indonesia",
- "vi": "Tiếng Việt",
- "tr": "Türkçe",
- "tr-TR": "Türkçe (Türkiye)",
- "pl": "Polski",
- "pl-PL": "Polski (Polska)",
- "uk": "Українська",
- "uk-UA": "Українська (Україна)",
- "ro": "Română",
- "ro-RO": "Română (România)",
- "nl": "Nederlands",
- "nl-NL": "Nederlands (Nederland)",
- "el": "Ελληνικά",
- "el-GR": "Ελληνικά (Ελλάδα)",
- "hu": "Magyar",
- "hu-HU": "Magyar (Magyarország)",
- "sv": "Svenska",
- "sv-SE": "Svenska (Sverige)",
- "cs": "Čeština",
- "cs-CZ": "Čeština (Česká republika)",
- "bg": "Български",
- "bg-BG": "Български (България)",
- "da": "Dansk",
- "da-DK": "Dansk (Danmark)",
- "fi": "Suomi",
- "fi-FI": "Suomi (Suomi)",
- "sk": "Slovenčina",
- "sk-SK": "Slovenčina (Slovensko)",
- "he": "עברית",
- "th": "ไทย",
- "sr": "Српски",
- "sr-RS": "Српски (Србија)",
- "no": "Norsk",
- "no-NO": "Norsk (Norge)",
- "lt": "Lietuvių",
- "lt-LT": "Lietuvių (Lietuva)",
- "lv": "Latviešu",
- "lv-LV": "Latviešu (Latvija)",
- "et": "Eesti",
- "et-EE": "Eesti (Eesti)",
- "hr": "Hrvatski",
- "hr-HR": "Hrvatski (Hrvatska)",
- "sl": "Slovenščina",
- "sl-SI": "Slovenščina (Slovenija)",
- "mt": "Malti",
- "mt-MT": "Malti (Malta)",
- "is": "Íslenska",
- "is-IS": "Íslenska (Ísland)",
- "ga": "Gaeilge",
- "ga-IE": "Gaeilge (Éire)",
- "cy": "Cymraeg",
- "cy-GB": "Cymraeg (Y Deyrnas Unedig)",
- "sq": "Shqip",
- "sq-AL": "Shqip (Shqipëria)"
+ en: "English",
+ "en-GB": "English (United Kingdom)",
+ "en-US": "English (United States)",
+ "en-CA": "English (Canada)",
+ "en-AU": "English (Australia)",
+ es: "Español",
+ "es-ES": "Español (España)",
+ "es-MX": "Español (México)",
+ "es-AR": "Español (Argentina)",
+ zh: "中文",
+ "zh-CN": "中文（简体）",
+ "zh-TW": "中文（繁體）",
+ "zh-HK": "中文（香港）",
+ fr: "Français",
+ "fr-FR": "Français (France)",
+ "fr-CA": "Français (Canada)",
+ "fr-BE": "Français (Belgique)",
+ de: "Deutsch",
+ "de-DE": "Deutsch (Deutschland)",
+ "de-AT": "Deutsch (Österreich)",
+ "de-CH": "Deutsch (Schweiz)",
+ ja: "日本語",
+ ru: "Русский",
+ "ru-RU": "Русский (Россия)",
+ it: "Italiano",
+ "it-IT": "Italiano (Italia)",
+ pt: "Português",
+ "pt-PT": "Português (Portugal)",
+ "pt-BR": "Português (Brasil)",
+ ko: "한국어",
+ ar: "العربية",
+ hi: "हिन्दी",
+ bn: "বাংলা",
+ pa: "ਪੰਜਾਬੀ",
+ id: "Bahasa Indonesia",
+ vi: "Tiếng Việt",
+ tr: "Türkçe",
+ "tr-TR": "Türkçe (Türkiye)",
+ pl: "Polski",
+ "pl-PL": "Polski (Polska)",
+ uk: "Українська",
+ "uk-UA": "Українська (Україна)",
+ ro: "Română",
+ "ro-RO": "Română (România)",
+ nl: "Nederlands",
+ "nl-NL": "Nederlands (Nederland)",
+ el: "Ελληνικά",
+ "el-GR": "Ελληνικά (Ελλάδα)",
+ hu: "Magyar",
+ "hu-HU": "Magyar (Magyarország)",
+ sv: "Svenska",
+ "sv-SE": "Svenska (Sverige)",
+ cs: "Čeština",
+ "cs-CZ": "Čeština (Česká republika)",
+ bg: "Български",
+ "bg-BG": "Български (България)",
+ da: "Dansk",
+ "da-DK": "Dansk (Danmark)",
+ fi: "Suomi",
+ "fi-FI": "Suomi (Suomi)",
+ sk: "Slovenčina",
+ "sk-SK": "Slovenčina (Slovensko)",
+ he: "עברית",
+ th: "ไทย",
+ sr: "Српски",
+ "sr-RS": "Српски (Србија)",
+ no: "Norsk",
+ "no-NO": "Norsk (Norge)",
+ lt: "Lietuvių",
+ "lt-LT": "Lietuvių (Lietuva)",
+ lv: "Latviešu",
+ "lv-LV": "Latviešu (Latvija)",
+ et: "Eesti",
+ "et-EE": "Eesti (Eesti)",
+ hr: "Hrvatski",
+ "hr-HR": "Hrvatski (Hrvatska)",
+ sl: "Slovenščina",
+ "sl-SI": "Slovenščina (Slovenija)",
+ mt: "Malti",
+ "mt-MT": "Malti (Malta)",
+ is: "Íslenska",
+ "is-IS": "Íslenska (Ísland)",
+ ga: "Gaeilge",
+ "ga-IE": "Gaeilge (Éire)",
+ cy: "Cymraeg",
+ "cy-GB": "Cymraeg (Y Deyrnas Unedig)",
+ sq: "Shqip",
+ "sq-AL": "Shqip (Shqipëria)",
};
diff --git a/source/i18n/util.mjs b/source/i18n/util.mjs
index 14f752b03..41f760039 100644
--- a/source/i18n/util.mjs
+++ b/source/i18n/util.mjs
@@ -36,8 +36,9 @@ export function detectUserLanguagePreference() {
}
// add to preferredLanguages all the base languages of the preferred languages
- preferredLanguages = preferredLanguages.concat(preferredLanguages.map(lang => lang.split("-")[0]));
-
+ preferredLanguages = preferredLanguages.concat(
+ preferredLanguages.map((lang) => lang.split("-")[0]),
+ );
if (!currentLang && preferredLanguages.length === 0) {
return {
@@ -56,11 +57,14 @@ export function detectUserLanguagePreference() {
const availableLanguages = [...linkTags].map((link) => {
const fullLang = link.hreflang;
const baseLang = fullLang.split("-")[0];
- let label = link.getAttribute('data-monster-label')
+ let label = link.getAttribute("data-monster-label");
if (!label) {
- label = languages?.[fullLang]
+ label = link.getAttribute("title");
if (!label) {
- label = languages?.[baseLang]
+ label = languages?.[fullLang];
+ if (!label) {
+ label = languages?.[baseLang];
+ }
}
}
@@ -73,7 +77,11 @@ export function detectUserLanguagePreference() {
});
// filter availableLanguages to only include languages that are in the preferredLanguages array
- const offerableLanguages = availableLanguages.filter(lang => preferredLanguages.includes(lang.fullLang) || preferredLanguages.includes(lang.baseLang));
+ const offerableLanguages = availableLanguages.filter(
+ (lang) =>
+ preferredLanguages.includes(lang.fullLang) ||
+ preferredLanguages.includes(lang.baseLang),
+ );
if (offerableLanguages.length === 0) {
return {
@@ -103,7 +111,7 @@ export function detectUserLanguagePreference() {
const bestMatch = offerableLanguages[0];
const bestMatchWeight = getWeight(bestMatch);
- const currentLabel = languages?.[currentLang] || currentLang
+ const currentLabel = languages?.[currentLang] || currentLang;
// If we found a language that matches user preferences (weight > 1)
if (bestMatchWeight > 0) {
@@ -114,7 +122,7 @@ export function detectUserLanguagePreference() {
full: bestMatch.fullLang,
base: bestMatch.baseLang,
label: bestMatch.label,
- href : bestMatch.href,
+ href: bestMatch.href,
},
available: availableLanguages.map((lang) => ({
...lang,
diff --git a/source/monster.mjs b/source/monster.mjs
index 99b862f41..8af87adfb 100644
--- a/source/monster.mjs
+++ b/source/monster.mjs
@@ -91,6 +91,7 @@ export * from "./components/datatable/embedded-pagination.mjs";
export * from "./components/datatable/status.mjs";
export * from "./components/datatable/change-button.mjs";
export * from "./components/datatable/constants.mjs";
+export * from "./components/accessibility/locale-picker.mjs";
export * from "./components/state/log/entry.mjs";
export * from "./components/state/state.mjs";
export * from "./components/state/log.mjs";
--
GitLab