@countriesdb/widget 0.1.24 → 0.1.26

package/README.md

@@ -78,7 +78,6 @@ import { CountriesWidgetLoad } from '@countriesdb/widget';
 
 CountriesWidgetLoad({
   publicKey: 'YOUR_PUBLIC_KEY',
-  backendUrl: 'https://api.countriesdb.com',
   defaultLanguage: 'en',
   enableGeolocation: true
 });

package/dist/index.esm.js

@@ -506,27 +506,47 @@ async function setupSubdivisionSelection(apiKey, backendUrl, state, config) {
                 select.innerHTML += `<option value="${defaultValue}" disabled>Error: No country select present</option>`;
             }
         }
+        // Remove old event handlers if they exist (for re-initialization)
+        const oldHandlers = state.eventHandlers.get(select);
+        if (oldHandlers) {
+            if (oldHandlers.update) {
+                select.removeEventListener('change', oldHandlers.update);
+            }
+            if (oldHandlers.followRelated) {
+                select.removeEventListener('change', oldHandlers.followRelated);
+            }
+            if (oldHandlers.followUpward) {
+                select.removeEventListener('change', oldHandlers.followUpward);
+            }
+        }
+        // Create new event handlers
+        const handlers = {};
         // Always dispatch an update event for user-initiated subdivision changes
-        select.addEventListener('change', (event) => {
+        handlers.update = (event) => {
             if (isWidgetInitiatedEvent(event)) {
                 return;
             }
             dispatchUpdateEvent(select, { type: 'subdivision', reason: 'regular' });
-        });
+        };
+        select.addEventListener('change', handlers.update);
         // --- follow_related (forward direction) ---
-        select.addEventListener('change', async (event) => {
+        handlers.followRelated = async (event) => {
             if (isWidgetInitiatedEvent(event)) {
                 return;
             }
             await handleFollowRelatedFromSubdivision(select, apiKey, backendUrl, state, config.followRelated, (s, key, code) => updateSubdivisionSelect(s, key, backendUrl, state, config, code));
-        });
+        };
+        select.addEventListener('change', handlers.followRelated);
         // --- follow_upward (reverse direction) ---
-        select.addEventListener('change', async (event) => {
+        handlers.followUpward = async (event) => {
             if (isWidgetInitiatedEvent(event)) {
                 return;
             }
             await handleFollowUpwardFromSubdivision(select, apiKey, backendUrl, state, config.followUpward, (s, key, code) => updateSubdivisionSelect(s, key, backendUrl, state, config, code));
-        });
+        };
+        select.addEventListener('change', handlers.followUpward);
+        // Store handlers for future cleanup
+        state.eventHandlers.set(select, handlers);
     }
 }
 /**
@@ -745,8 +765,13 @@ async function setupCountrySelection(apiKey, backendUrl, state, config, subdivis
                 // Subdivisions will be loaded by event handler
                 loadedInitialSubdivisions = true;
             }
-            // On change => update subdivisions
-            select.addEventListener('change', async (event) => {
+            // Remove old event handlers if they exist (for re-initialization)
+            const oldCountryHandlers = state.eventHandlers.get(select);
+            if (oldCountryHandlers?.countryChange) {
+                select.removeEventListener('change', oldCountryHandlers.countryChange);
+            }
+            // Create new country change handler
+            const countryChangeHandler = async (event) => {
                 if (isWidgetInitiatedEvent(event)) {
                     return;
                 }
@@ -768,7 +793,12 @@ async function setupCountrySelection(apiKey, backendUrl, state, config, subdivis
                 if (config.followUpward && !select.multiple && picked.is_subdivision_of) {
                     await handleFollowUpwardFromCountry(select, apiKey, backendUrl, state, config.followUpward, (s, key, code) => updateSubdivisionSelect(s, key, backendUrl, state, subdivisionConfig, code));
                 }
-            });
+            };
+            // Store and attach the handler
+            const countryHandlers = state.eventHandlers.get(select) || {};
+            countryHandlers.countryChange = countryChangeHandler;
+            state.eventHandlers.set(select, countryHandlers);
+            select.addEventListener('change', countryChangeHandler);
         }
         catch (error) {
             console.error('Failed to fetch countries:', error);
@@ -843,6 +873,7 @@ async function CountriesWidgetLoad(options = {}) {
             subdivisionsMap: new WeakMap(),
             subdivisionsLanguageMap: new WeakMap(),
             isInitializing: new Set(),
+            eventHandlers: new WeakMap(),
         };
         // Use empty string if publicKey is missing (will show error when API calls fail)
         const apiKey = config.publicKey || '';
@@ -895,23 +926,27 @@ async function CountriesWidgetLoad(options = {}) {
  * Get configuration from options or script URL parameters
  */
 function getConfigFromOptionsOrScript(options) {
+    // Check for global config first (for bundled widgets that need config before auto-init)
+    const globalConfig = typeof window !== 'undefined' && window.CountriesDBConfig
+        ? window.CountriesDBConfig
+        : null;
     // Try to get config from script URL (for backward compatibility with widget.blade.php)
     let scriptUrl = null;
     try {
         let loaderScript = null;
         // First try document.currentScript (works during script execution)
+        // But only if it matches the widget pattern (not a bundled file)
         if (document.currentScript && document.currentScript instanceof HTMLScriptElement) {
-            loaderScript = document.currentScript;
+            const src = document.currentScript.src;
+            if (src && (src.includes('@countriesdb/widget') || src.includes('widget/dist/index.js'))) {
+                loaderScript = document.currentScript;
+            }
         }
-        else {
-            // Fallback: find script tag with @countriesdb/widget in src
+        // If currentScript didn't match, search for widget script
+        if (!loaderScript) {
             const scripts = Array.from(document.getElementsByTagName('script'));
             loaderScript = scripts.find((s) => s.src && (s.src.includes('@countriesdb/widget') ||
                 s.src.includes('widget/dist/index.js'))) || null;
-            // If still not found, try the last script with src
-            if (!loaderScript) {
-                loaderScript = scripts.filter((s) => s.src).pop() || null;
-            }
         }
         if (loaderScript && loaderScript.src) {
             scriptUrl = new URL(loaderScript.src);
@@ -921,39 +956,57 @@ function getConfigFromOptionsOrScript(options) {
         // Ignore errors
     }
     const config = {
-        publicKey: options.publicKey || scriptUrl?.searchParams.get('public_key') || '',
-        backendUrl: options.backendUrl || scriptUrl?.searchParams.get('backend_url') || getBackendUrlFromScript(),
-        defaultLanguage: options.defaultLanguage || scriptUrl?.searchParams.get('default_language') || undefined,
-        forcedLanguage: options.forcedLanguage || scriptUrl?.searchParams.get('forced_language') || undefined,
+        // Priority: options > globalConfig > scriptUrl params > defaults
+        publicKey: options.publicKey ?? globalConfig?.publicKey ?? scriptUrl?.searchParams.get('public_key') ?? '',
+        backendUrl: options.backendUrl ?? globalConfig?.backendUrl ?? scriptUrl?.searchParams.get('backend_url') ?? getBackendUrlFromScript(),
+        defaultLanguage: options.defaultLanguage ?? globalConfig?.defaultLanguage ?? scriptUrl?.searchParams.get('default_language') ?? undefined,
+        forcedLanguage: options.forcedLanguage ?? globalConfig?.forcedLanguage ?? scriptUrl?.searchParams.get('forced_language') ?? undefined,
         showSubdivisionType: options.showSubdivisionType !== undefined
             ? options.showSubdivisionType
-            : parseBoolean(scriptUrl?.searchParams.get('show_subdivision_type') ?? '1'),
+            : globalConfig?.showSubdivisionType !== undefined
+                ? globalConfig.showSubdivisionType
+                : parseBoolean(scriptUrl?.searchParams.get('show_subdivision_type') ?? '1'),
         followRelated: options.followRelated !== undefined
             ? options.followRelated
-            : parseBoolean(scriptUrl?.searchParams.get('follow_related') ?? 'false'),
+            : globalConfig?.followRelated !== undefined
+                ? globalConfig.followRelated
+                : parseBoolean(scriptUrl?.searchParams.get('follow_related') ?? 'false'),
         followUpward: options.followUpward !== undefined
             ? options.followUpward
-            : parseBoolean(scriptUrl?.searchParams.get('follow_upward') ?? 'false'),
+            : globalConfig?.followUpward !== undefined
+                ? globalConfig.followUpward
+                : parseBoolean(scriptUrl?.searchParams.get('follow_upward') ?? 'false'),
         allowParentSelection: options.allowParentSelection !== undefined
             ? options.allowParentSelection
-            : parseBoolean(scriptUrl?.searchParams.get('allow_parent_selection') ?? 'false'),
+            : globalConfig?.allowParentSelection !== undefined
+                ? globalConfig.allowParentSelection
+                : parseBoolean(scriptUrl?.searchParams.get('allow_parent_selection') ?? 'false'),
         isoCountryNames: options.isoCountryNames !== undefined
             ? options.isoCountryNames
-            : parseBoolean(scriptUrl?.searchParams.get('iso_country_names') ?? 'false'),
+            : globalConfig?.isoCountryNames !== undefined
+                ? globalConfig.isoCountryNames
+                : parseBoolean(scriptUrl?.searchParams.get('iso_country_names') ?? 'false'),
         subdivisionRomanizationPreference: options.subdivisionRomanizationPreference ||
+            globalConfig?.subdivisionRomanizationPreference ||
             scriptUrl?.searchParams.get('subdivision_romanization_preference') ||
             undefined,
         preferLocalVariant: options.preferLocalVariant !== undefined
             ? options.preferLocalVariant
-            : parseBoolean(scriptUrl?.searchParams.get('prefer_local_variant') ?? 'false'),
+            : globalConfig?.preferLocalVariant !== undefined
+                ? globalConfig.preferLocalVariant
+                : parseBoolean(scriptUrl?.searchParams.get('prefer_local_variant') ?? 'false'),
         preferOfficialSubdivisions: options.preferOfficialSubdivisions !== undefined
             ? options.preferOfficialSubdivisions
-            : parseBoolean(scriptUrl?.searchParams.get('prefer_official') ?? 'false'),
-        countryNameFilter: options.countryNameFilter,
-        subdivisionNameFilter: options.subdivisionNameFilter,
+            : globalConfig?.preferOfficialSubdivisions !== undefined
+                ? globalConfig.preferOfficialSubdivisions
+                : parseBoolean(scriptUrl?.searchParams.get('prefer_official') ?? 'false'),
+        countryNameFilter: options.countryNameFilter ?? globalConfig?.countryNameFilter,
+        subdivisionNameFilter: options.subdivisionNameFilter ?? globalConfig?.subdivisionNameFilter,
         autoInit: options.autoInit !== undefined
             ? options.autoInit
-            : parseBoolean(scriptUrl?.searchParams.get('auto_init') ?? 'true'),
+            : globalConfig?.autoInit !== undefined
+                ? globalConfig.autoInit
+                : parseBoolean(scriptUrl?.searchParams.get('auto_init') ?? 'true'),
     };
     // Resolve filter functions from global scope if specified by name
     if (scriptUrl) {
@@ -981,18 +1034,19 @@ function getBackendUrlFromScript() {
     try {
         let loaderScript = null;
         // First try document.currentScript (works during script execution)
+        // But only if it matches the widget pattern (not a bundled file)
         if (document.currentScript && document.currentScript instanceof HTMLScriptElement) {
-            loaderScript = document.currentScript;
+            const src = document.currentScript.src;
+            if (src && (src.includes('@countriesdb/widget') || src.includes('widget/dist/index.js'))) {
+                loaderScript = document.currentScript;
+            }
         }
-        else {
-            // Fallback: find script tag with @countriesdb/widget in src
+        // If currentScript didn't match, search for widget script
+        if (!loaderScript) {
+            // Only consider script tags that loaded the widget bundle
             const scripts = Array.from(document.getElementsByTagName('script'));
             loaderScript = scripts.find((s) => s.src && (s.src.includes('@countriesdb/widget') ||
                 s.src.includes('widget/dist/index.js'))) || null;
-            // If still not found, try the last script with src
-            if (!loaderScript) {
-                loaderScript = scripts.filter((s) => s.src).pop() || null;
-            }
         }
         if (loaderScript && loaderScript.src) {
             const scriptUrl = new URL(loaderScript.src);
@@ -1075,18 +1129,28 @@ if (typeof window !== 'undefined') {
         // Find the script tag that loaded this widget
         let loaderScript = null;
         // First try document.currentScript (works during script execution)
+        // But only if it matches the widget pattern (not a bundled file)
         if (document.currentScript && document.currentScript instanceof HTMLScriptElement) {
-            loaderScript = document.currentScript;
+            const src = document.currentScript.src;
+            if (src && (src.includes('@countriesdb/widget') || src.includes('widget/dist/index.js'))) {
+                loaderScript = document.currentScript;
+            }
         }
-        else {
-            // Fallback: find script tag with @countriesdb/widget in src
+        // If currentScript didn't match, search for widget script
+        if (!loaderScript) {
             const scripts = Array.from(document.getElementsByTagName('script'));
             loaderScript = scripts.find((s) => s.src && (s.src.includes('@countriesdb/widget') ||
                 s.src.includes('widget/dist/index.js'))) || null;
         }
         // Default to auto-init = true (only disable if explicitly set to false)
         let shouldAutoInit = true;
-        if (loaderScript && loaderScript.src) {
+        const globalConfig = typeof window !== 'undefined'
+            ? window.CountriesDBConfig || null
+            : null;
+        if (globalConfig && typeof globalConfig.autoInit !== 'undefined') {
+            shouldAutoInit = !!globalConfig.autoInit;
+        }
+        else if (loaderScript && loaderScript.src) {
             try {
                 const scriptUrl = new URL(loaderScript.src);
                 const autoInit = scriptUrl.searchParams.get('auto_init');