@pure-ds/core 0.7.36 → 0.7.38

package/src/js/common/localization-resource-provider.js

@@ -71,6 +71,59 @@ function normalizeAliasMap(aliases = {}) {
   return normalized;
 }
 
+function resolveAliasTarget(aliasKey, aliases, localeSet) {
+  const values = Array.isArray(aliases?.[aliasKey]) ? aliases[aliasKey] : [];
+  for (const value of values) {
+    const normalizedValue = normalizeLocaleTag(value);
+    if (localeSet.has(normalizedValue)) {
+      return normalizedValue;
+    }
+  }
+  return "";
+}
+
+function createAliasLookup({ aliases, localeSet }) {
+  const lookup = new Map();
+
+  for (const locale of localeSet) {
+    lookup.set(locale, locale);
+  }
+
+  for (const key of Object.keys(aliases || {})) {
+    const target = resolveAliasTarget(key, aliases, localeSet);
+    if (!target) {
+      throw new Error(
+        `[i18n] Locale alias "${key}" does not map to any configured locale.`
+      );
+    }
+    lookup.set(key, target);
+  }
+
+  return lookup;
+}
+
+function resolveConfiguredLocale(locale, { defaultLocale, aliasLookup }) {
+  const normalized = normalizeLocaleTag(locale);
+  if (!normalized) {
+    return defaultLocale;
+  }
+
+  const direct = aliasLookup.get(normalized);
+  if (direct) {
+    return direct;
+  }
+
+  const base = toBaseLocale(normalized);
+  const baseMapped = base ? aliasLookup.get(base) : "";
+  if (baseMapped) {
+    return baseMapped;
+  }
+
+  throw new Error(
+    `[i18n] Locale alias "${locale}" is not configured. Add an alias entry for "${base || normalized}".`
+  );
+}
+
 function normalizeBundleShape(bundle) {
   if (!bundle || typeof bundle !== "object" || Array.isArray(bundle)) {
     return {};
@@ -177,6 +230,7 @@ function buildCandidateLocales({ locale, effectiveLocale, defaultLocale, aliases
  *   locales: string[],
  *   provider: {
  *     locales: string[],
+ *     resolveLocale: (locale: string) => string,
  *     loadLocale: (context: { locale: string }) => Promise<Record<string, string | { content?: string }>>,
  *   },
  * }}
@@ -186,6 +240,7 @@ export function createJSONLocalization(options = {}) {
   const locales = toLocaleList(options?.locales, defaultLocale);
   const localeSet = new Set(locales);
   const aliases = normalizeAliasMap(options?.aliases || {});
+  const aliasLookup = createAliasLookup({ aliases, localeSet });
   const cache = options?.cache instanceof Map ? options.cache : new Map();
   const basePath = normalizeBasePath(options?.basePath);
   const requestInit =
@@ -194,21 +249,10 @@ export function createJSONLocalization(options = {}) {
       : {};
 
   const resolveEffectiveLocale = (locale) => {
-    const normalized = normalizeLocaleTag(locale);
-    if (!normalized) {
-      return defaultLocale;
-    }
-
-    if (localeSet.has(normalized)) {
-      return normalized;
-    }
-
-    const base = toBaseLocale(normalized);
-    if (localeSet.has(base)) {
-      return base;
-    }
-
-    return defaultLocale;
+    return resolveConfiguredLocale(locale, {
+      defaultLocale,
+      aliasLookup,
+    });
   };
 
   const loadLocale = async ({ locale }) => {
@@ -268,6 +312,7 @@ export function createJSONLocalization(options = {}) {
     locales: [...locales],
     provider: {
       locales: [...locales],
+      resolveLocale: resolveEffectiveLocale,
       loadLocale,
     },
   };

package/src/js/common/localization.js

@@ -11,10 +11,22 @@ const __localizationState = {
   reconcileTimer: null,
   requestedKeys: new Set(),
   textNodeKeyMap: new WeakMap(),
+  attributeKeyMap: new WeakMap(),
   valueToKeys: new Map(),
   missingWarnings: new Set(),
 };
 
+const __LOCALIZABLE_ATTRIBUTES = [
+  "title",
+  "placeholder",
+  "aria-label",
+  "aria-description",
+  "aria-placeholder",
+  "aria-roledescription",
+  "alt",
+  "label",
+];
+
 const __isStrTagged = (val) =>
   Boolean(val) && typeof val !== "string" && typeof val === "object" && "strTag" in val;
 
@@ -33,6 +45,15 @@ function __resolveLocaleCandidate(locale) {
   if (!normalized) {
     return __localizationState.defaultLocale;
   }
+
+  const resolveLocale = __localizationState.provider?.resolveLocale;
+  if (typeof resolveLocale === "function") {
+    const resolved = __normalizeLocale(resolveLocale(locale));
+    if (resolved) {
+      return resolved;
+    }
+  }
+
   return normalized;
 }
 
@@ -98,7 +119,14 @@ function __resolveProvider(config) {
         ? provider.setLocale
         : null;
 
-  if (!translate && !loadLocale && !setLocale) {
+  const resolveLocale =
+    typeof config?.resolveLocale === "function"
+      ? config.resolveLocale
+      : typeof provider?.resolveLocale === "function"
+        ? provider.resolveLocale
+        : null;
+
+  if (!translate && !loadLocale && !setLocale && !resolveLocale) {
     return null;
   }
 
@@ -106,6 +134,7 @@ function __resolveProvider(config) {
     translate,
     loadLocale,
     setLocale,
+    resolveLocale,
   };
 }
 
@@ -599,10 +628,135 @@ async function __localizeRequestedTextNodes() {
   }
 }
 
+function __getElementAttributeKeyMap(element) {
+  let map = __localizationState.attributeKeyMap.get(element);
+  if (!map) {
+    map = new Map();
+    __localizationState.attributeKeyMap.set(element, map);
+  }
+  return map;
+}
+
+async function __localizeAttribute(element, attrName) {
+  if (!element || typeof element.getAttribute !== "function") {
+    return;
+  }
+
+  const rawValue = element.getAttribute(attrName);
+  if (typeof rawValue !== "string" || !rawValue.length) {
+    return;
+  }
+
+  const keyMap = __getElementAttributeKeyMap(element);
+  let key = keyMap.get(attrName) || null;
+
+  if (!key || !__localizationState.requestedKeys.has(key)) {
+    key = __findRequestedKeyForText(rawValue);
+  }
+
+  if (!key) {
+    const segmentMatch = __findRequestedSubsegmentForText(rawValue);
+    if (!segmentMatch) {
+      return;
+    }
+
+    const scopedLocale = __resolveContextLocale({ element });
+    await __loadLocaleInternal(scopedLocale, "attribute");
+
+    const translated = __resolveTranslation(segmentMatch.key, segmentMatch.values, { element }, null);
+    const translatedText = segmentMatch.values.length
+      ? __replacePlaceholders(translated, (index) => segmentMatch.values[index])
+      : translated;
+
+    const localizedValue =
+      rawValue.slice(0, segmentMatch.start) +
+      translatedText +
+      rawValue.slice(segmentMatch.end);
+
+    if (localizedValue !== rawValue) {
+      element.setAttribute(attrName, localizedValue);
+    }
+
+    keyMap.set(attrName, segmentMatch.key);
+    return;
+  }
+
+  keyMap.set(attrName, key);
+
+  const scopedLocale = __resolveContextLocale({ element });
+  await __loadLocaleInternal(scopedLocale, "attribute");
+
+  const values = __resolveTemplateValuesForText(key, rawValue);
+  const translated = __resolveTranslation(key, values, { element }, null);
+  const translatedText = values.length
+    ? __replacePlaceholders(translated, (index) => values[index])
+    : translated;
+
+  if (translatedText !== rawValue) {
+    element.setAttribute(attrName, translatedText);
+  }
+}
+
+async function __localizeRequestedAttributes() {
+  if (typeof document === "undefined" || __localizationState.requestedKeys.size === 0) {
+    return;
+  }
+
+  const root = document.body || document.documentElement;
+  if (!root) {
+    return;
+  }
+
+  const roots = [];
+  const seenRoots = new Set();
+
+  const addRoot = (candidateRoot) => {
+    if (!candidateRoot || seenRoots.has(candidateRoot)) {
+      return;
+    }
+
+    seenRoots.add(candidateRoot);
+    roots.push(candidateRoot);
+  };
+
+  addRoot(root);
+
+  for (let index = 0; index < roots.length; index += 1) {
+    const currentRoot = roots[index];
+    if (!currentRoot || typeof currentRoot.querySelectorAll !== "function") {
+      continue;
+    }
+
+    const elements = currentRoot.querySelectorAll("*");
+    for (const element of elements) {
+      const shadowRoot = element?.shadowRoot;
+      if (shadowRoot) {
+        addRoot(shadowRoot);
+      }
+    }
+  }
+
+  for (const scanRoot of roots) {
+    if (!scanRoot || typeof scanRoot.querySelectorAll !== "function") {
+      continue;
+    }
+
+    const elements = scanRoot.querySelectorAll("*");
+    for (const element of elements) {
+      for (const attrName of __LOCALIZABLE_ATTRIBUTES) {
+        if (element.hasAttribute(attrName)) {
+          await __localizeAttribute(element, attrName);
+        }
+      }
+    }
+  }
+}
+
 async function __reconcileLocalization() {
   const detectedLocales = __collectDetectedLocales();
   await __ensureDetectedLocalesLoaded(detectedLocales);
   await __localizeRequestedTextNodes();
+  await __localizeRequestedAttributes();
   __pruneUndetectedLocales(detectedLocales);
 }
 
@@ -748,6 +902,7 @@ export function configureLocalization(config = null) {
   __localizationState.loadingByLocale.clear();
   __localizationState.requestedKeys.clear();
   __localizationState.textNodeKeyMap = new WeakMap();
+  __localizationState.attributeKeyMap = new WeakMap();
   __localizationState.valueToKeys.clear();
   __localizationState.missingWarnings.clear();
 
@@ -767,11 +922,18 @@ export function configureLocalization(config = null) {
     Object.prototype.hasOwnProperty.call(config, "provider") ||
     Object.prototype.hasOwnProperty.call(config, "translate") ||
     Object.prototype.hasOwnProperty.call(config, "loadLocale") ||
-    Object.prototype.hasOwnProperty.call(config, "setLocale")
+    Object.prototype.hasOwnProperty.call(config, "setLocale") ||
+    Object.prototype.hasOwnProperty.call(config, "resolveLocale")
   ) {
     __localizationState.provider = __resolveProvider(config);
   }
 
+  if (__localizationState.provider?.resolveLocale) {
+    __localizationState.defaultLocale = __resolveLocaleCandidate(
+      __localizationState.defaultLocale
+    );
+  }
+
   __attachLangObserver();
   __scheduleReconcile();
 

package/src/js/pds-core/pds-live.js

@@ -3,6 +3,7 @@
  * Separated to keep the base runtime bundle lean for production/static usage.
  */
 import { Generator } from "./pds-generator.js";
+import { msg } from "../common/localization.js";
 import { applyStyles, adoptLayers, adoptPrimitives } from "./pds-runtime.js";
 import {
   presets,
@@ -309,10 +310,10 @@ async function ensureLiveEditToggleButton() {
       return li;
     };
 
-    menu.appendChild(createItem("toggle", "Toggle live editing", "pencil"));
-    menu.appendChild(createItem("open-settings", "Open Settings", "gear"));
+    menu.appendChild(createItem("toggle", msg("Toggle live editing"), "pencil"));
+    menu.appendChild(createItem("open-settings", msg("Open Settings"), "gear"));
     menu.appendChild(createSeparator());
-    menu.appendChild(createItem("reset-config", "Reset Config", "arrow-counter-clockwise"));
+    menu.appendChild(createItem("reset-config", msg("Reset Config"), "arrow-counter-clockwise"));
 
     await ensureSharedQuickModeToggleMenuItem(menu);
 

package/src/js/pds.d.ts

@@ -124,6 +124,7 @@ export interface PDSLocalizationTranslateContext {
 
 export interface PDSLocalizationProvider {
   translate?: (context: PDSLocalizationTranslateContext) => string | undefined | null;
+  resolveLocale?: (locale: string) => string;
   loadLocale?: (context: {
     locale: string;
     defaultLocale: string;
@@ -154,6 +155,7 @@ export interface PDSLocalizationConfig {
   messages?: PDSLocalizationMessages;
   provider?: PDSLocalizationProvider;
   translate?: PDSLocalizationProvider["translate"];
+  resolveLocale?: PDSLocalizationProvider["resolveLocale"];
   loadLocale?: PDSLocalizationProvider["loadLocale"];
   setLocale?: PDSLocalizationProvider["setLocale"];
 }