@countriesdb/widget 0.1.33 → 0.1.35

package/dist/initialization.js

@@ -1,7 +1,7 @@
 /**
  * Widget initialization logic
  */
-import { CountriesDBClient } from '@countriesdb/widget-core';
+import { CountriesDBClient, buildSubdivisionTree } from '@countriesdb/widget-core';
 import { initializeSelect, populateCountrySelect, buildSubdivisionOptionsHTML, applyPreselectedValue, handleApiError, } from './dom-manipulation';
 import { dispatchReadyEvent, dispatchUpdateEvent, isWidgetInitiatedEvent, } from './event-system';
 import { triggerFollowLogic, handleFollowRelatedFromSubdivision, handleFollowUpwardFromSubdivision, handleFollowUpwardFromCountry, } from './follow-logic';
@@ -156,7 +156,13 @@ export async function updateSubdivisionSelect(select, apiKey, backendUrl, state,
                 if (!userSelectionRestored) {
                     // Check if preselected value exists (applyPreselectedValue will read it from select element)
                     const hasPreselectedValue = (select.getAttribute('data-preselected') || select.dataset.preselected || select.dataset._widgetTempPreselect) !== undefined;
-                    if (hasPreselectedValue) {
+                    const preselectedConsumed = select.dataset._widgetPreselectedConsumed === '1';
+                    // Only apply preselected if:
+                    // 1. It exists AND
+                    // 2. Either it hasn't been consumed yet, OR this is the initial load (not a reload)
+                    // This prevents reapplying preselected values on user-initiated country changes
+                    // But allows them on initial load and on reload: true (which clears the consumed flag)
+                    if (hasPreselectedValue && (!preselectedConsumed || !isReload)) {
                         applyPreselectedValue(select, apiKey);
                         dispatchUpdateEvent(select, {
                             type: 'subdivision',
@@ -171,16 +177,64 @@ export async function updateSubdivisionSelect(select, apiKey, backendUrl, state,
                             const preselectedSubdivision = subdivisions.find((subdivision) => subdivision.preselected);
                             if (preselectedSubdivision) {
                                 const isMultiple = select.hasAttribute('multiple');
+                                let subdivisionToSelect = preselectedSubdivision;
+                                // Check if the preselected subdivision is disabled (parent with children when allowParentSelection is false)
+                                if (!config.allowParentSelection && !isMultiple) {
+                                    const option = Array.from(select.options).find((opt) => opt.value === preselectedSubdivision.code);
+                                    // If option is disabled, find the first child subdivision
+                                    if (option && option.disabled) {
+                                        const tree = buildSubdivisionTree(subdivisions);
+                                        // Find the node in the tree
+                                        function findNodeInTree(nodes, code) {
+                                            for (const node of nodes) {
+                                                if (node.code === code) {
+                                                    return node;
+                                                }
+                                                if (node.children && node.children.length > 0) {
+                                                    const found = findNodeInTree(node.children, code);
+                                                    if (found)
+                                                        return found;
+                                                }
+                                            }
+                                            return null;
+                                        }
+                                        const preselectedNode = findNodeInTree(tree, preselectedSubdivision.code);
+                                        // Get the first child (recursively if needed)
+                                        function getFirstChild(node) {
+                                            if (!node || !node.children || node.children.length === 0) {
+                                                return null;
+                                            }
+                                            // Sort children to get consistent first child
+                                            const sortedChildren = [...node.children].sort((a, b) => {
+                                                const nameA = a.name || '';
+                                                const nameB = b.name || '';
+                                                return nameA.localeCompare(nameB);
+                                            });
+                                            const firstChild = sortedChildren[0];
+                                            // If first child also has children and would be disabled, recurse
+                                            if (firstChild.children && firstChild.children.length > 0) {
+                                                const deeperChild = getFirstChild(firstChild);
+                                                return deeperChild || firstChild;
+                                            }
+                                            return firstChild;
+                                        }
+                                        const firstChild = preselectedNode ? getFirstChild(preselectedNode) : null;
+                                        if (firstChild) {
+                                            // Find the subdivision object by code
+                                            subdivisionToSelect = subdivisions.find((sub) => sub.code === firstChild.code) || preselectedSubdivision;
+                                        }
+                                    }
+                                }
                                 if (isMultiple) {
                                     // For multi-select, find and select the option
-                                    const option = Array.from(select.options).find((opt) => opt.value === preselectedSubdivision.code);
+                                    const option = Array.from(select.options).find((opt) => opt.value === subdivisionToSelect.code);
                                     if (option) {
                                         option.selected = true;
                                     }
                                 }
                                 else {
                                     // Single select: set value directly
-                                    select.value = preselectedSubdivision.code;
+                                    select.value = subdivisionToSelect.code;
                                 }
                                 dispatchUpdateEvent(select, {
                                     type: 'subdivision',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@countriesdb/widget",
-  "version": "0.1.33",
+  "version": "0.1.35",
   "description": "Country and state/province select widget with ISO 3166-1 and ISO 3166-2 codes. Auto-populates dropdowns with up-to-date country and subdivision data in multiple languages. Easy integration for forms, location selection, and address validation.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",