@descope/flow-components 3.1.4 → 3.1.5

package/dist/fm/mf-manifest.json

@@ -5,7 +5,7 @@
     "name": "flowComponents",
     "type": "app",
     "buildInfo": {
-      "buildVersion": "3.1.4",
+      "buildVersion": "3.1.5",
       "buildName": "@descope/flow-components"
     },
     "remoteEntry": {

package/dist/fm/mf-stats.json

@@ -5,7 +5,7 @@
     "name": "flowComponents",
     "type": "app",
     "buildInfo": {
-      "buildVersion": "3.1.4",
+      "buildVersion": "3.1.5",
       "buildName": "@descope/flow-components"
     },
     "remoteEntry": {

package/dist/index.cjs.js

@@ -88530,10 +88530,14 @@ function requireIndex_cjs () {
 	  return `<div data-id="${escapedStateCode}" data-name="${escapedSearchTerms}" data-label="${escapedLabel}">${escapedLabel}</div>`;
 	};
 
-	const cityItem = ({ name }) => {
+	const cityItem = ({ name, translations, lang }) => {
+	  const displayName = resolveTranslation({ name, translations }, lang);
+	  const searchTerms = [displayName];
+	  if (displayName !== name) searchTerms.push(name);
 	  const escapedId = escapeHtml(name);
-	  const escapedName = escapeHtml(name);
-	  return `<div data-id="${escapedId}" data-name="${escapedName}">${escapedName}</div>`;
+	  const escapedSearchTerms = escapeHtml(searchTerms.join(' '));
+	  const escapedLabel = escapeHtml(displayName);
+	  return `<div data-id="${escapedId}" data-name="${escapedSearchTerms}" data-label="${escapedLabel}">${escapedLabel}</div>`;
 	};
 
 	const comboBoxHTML = (id) =>
@@ -88593,6 +88597,7 @@ function requireIndex_cjs () {
 	  #countriesMap = new Map();
 	  #cachedCountries = null;
 	  #cachedSubdivisions = null;
+	  #cachedCities = null;
 	  #labels = null;
 
 	  // Value requested programmatically before data has loaded.
@@ -88639,8 +88644,8 @@ function requireIndex_cjs () {
 	    const lang = this.getAttribute('lang') || undefined;
 	    if (!lang) return undefined;
 	    try {
-	      Intl.getCanonicalLocales(lang);
-	      return lang;
+	      const [canonical] = Intl.getCanonicalLocales(lang);
+	      return canonical;
 	    } catch {
 	      return undefined; // invalid BCP47 tag — fall back to English
 	    }
@@ -88823,8 +88828,11 @@ function requireIndex_cjs () {
 
 	  #setupValueTransform() {
 	    // Display only the item name in the input, while data-name includes ISO codes for search
-	    [this.#countryComboBox, this.#subdivisionComboBox].forEach((combo) => {
-	       
+	    [
+	      this.#countryComboBox,
+	      this.#subdivisionComboBox,
+	      this.#cityComboBox,
+	    ].forEach((combo) => {
 	      combo.customValueTransformFn = (val) => {
 	        const item = combo.baseElement?.items?.find(
 	          (i) => i['data-name'] === val,
@@ -88969,7 +88977,11 @@ function requireIndex_cjs () {
 	    if (cities) {
 	      this.#cityVisible = cities.length > 0;
 	      if (cities.length > 0) {
-	        this.#cityComboBox.data = cities;
+	        this.#cachedCities = cities;
+	        this.#cityComboBox.data = cities.map((c) => ({
+	          ...c,
+	          lang: this.#lang,
+	        }));
 	        if (pendingCity) toSelect.push([this.#cityComboBox, pendingCity]);
 	      }
 	    }
@@ -89080,7 +89092,6 @@ function requireIndex_cjs () {
 	      if (!this.#pendingValue && this.#defaultCountry)
 	        this.#onCountrySelected(this.#defaultCountry);
 	    } catch (e) {
-	       
 	      console.error(`[${componentName$V}] Failed to load countries`, e);
 	    } finally {
 	      this.#countryComboBox.removeAttribute('loading');
@@ -89105,7 +89116,6 @@ function requireIndex_cjs () {
 	        this.#loadCities(countryIso2);
 	      }
 	    } catch (e) {
-	       
 	      console.error(
 	        `[${componentName$V}] Failed to load subdivisions for ${countryIso2}`,
 	        e,
@@ -89127,10 +89137,13 @@ function requireIndex_cjs () {
 	      this.#cityVisible = cities.length > 0;
 	      this.#refreshState();
 	      if (cities.length > 0) {
-	        this.#cityComboBox.data = cities;
+	        this.#cachedCities = cities;
+	        this.#cityComboBox.data = cities.map((c) => ({
+	          ...c,
+	          lang: this.#lang,
+	        }));
 	      }
 	    } catch (e) {
-	       
 	      console.error(
 	        `[${componentName$V}] Failed to load cities for ${countryIso2}${stateCode ? `/${stateCode}` : ''}`,
 	        e,
@@ -89155,6 +89168,14 @@ function requireIndex_cjs () {
 	      if (prevSubdivision)
 	        this.#selectItemById(this.#subdivisionComboBox, prevSubdivision);
 	    }
+	    if (this.#cachedCities && this.#cityVisible) {
+	      const prevCity = this.#cityComboBox.value;
+	      this.#cityComboBox.data = this.#cachedCities.map((c) => ({
+	        ...c,
+	        lang: this.#lang,
+	      }));
+	      if (prevCity) this.#selectItemById(this.#cityComboBox, prevCity);
+	    }
 	    // Re-apply translated subdivision type label for the new lang
 	    const currentIso2 = this.#countryComboBox.value;
 	    if (currentIso2) {
@@ -89268,6 +89289,7 @@ function requireIndex_cjs () {
 	  #resetCity() {
 	    this.#cityComboBox.value = '';
 	    this.#cityComboBox.data = [];
+	    this.#cachedCities = null;
 	    this.#cityVisible = false;
 	    this.#refreshState();
 	  }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/flow-components",
-  "version": "3.1.4",
+  "version": "3.1.5",
   "description": "",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -97,7 +97,7 @@
     "webpack-subresource-integrity": "5.2.0-rc.1"
   },
   "dependencies": {
-    "@descope/web-components-ui": "3.1.4"
+    "@descope/web-components-ui": "3.1.5"
   },
   "peerDependencies": {
     "react": ">= 18"