telpick 1.0.6 → 1.0.8

package/dist/telpick.es.js

@@ -1,57 +1,617 @@
-class _ {
-  constructor({ code: o = null, onChange: r = () => {
-  }, styleOverrides: d = {} } = {}) {
-    this.code = o, this.onChange = r, this.styleOverrides = d, this.codes = [], this.selectedCode = o, this.isDropdownOpen = !1, this.searchQuery = "", this.container = null, this.dropdown = null, this._outsideHandler = null;
+const A = [
+  {
+    country: "Afganistán",
+    code: "+93",
+    flag: "/flags/af.png",
+    country_code: "AF"
+  },
+  {
+    country: "Albania",
+    code: "+355",
+    flag: "/flags/al.webp",
+    country_code: "AL"
+  },
+  {
+    country: "Alemania",
+    code: "+49",
+    flag: "/flags/de.webp",
+    country_code: "DE"
+  },
+  {
+    country: "Andorra",
+    code: "+376",
+    flag: "/flags/ad.webp",
+    country_code: "AD"
+  },
+  {
+    country: "Antigua y Barbuda",
+    code: "+1",
+    flag: "/flags/ag.webp",
+    country_code: "AG"
+  },
+  {
+    country: "Arabia Saudita",
+    code: "+966",
+    flag: "/flags/sa.webp",
+    country_code: "SA"
+  },
+  {
+    country: "Argentina",
+    code: "+54",
+    flag: "/flags/ar.webp",
+    country_code: "AR"
+  },
+  {
+    country: "Australia",
+    code: "+61",
+    flag: "/flags/au.webp",
+    country_code: "AU"
+  },
+  {
+    country: "Austria",
+    code: "+43",
+    flag: "/flags/at.webp",
+    country_code: "AT"
+  },
+  {
+    country: "Bahamas",
+    code: "+1",
+    flag: "/flags/bs.webp",
+    country_code: "BS"
+  },
+  {
+    country: "Bangladés",
+    code: "+880",
+    flag: "/flags/bd.webp",
+    country_code: "BD"
+  },
+  {
+    country: "Barbados",
+    code: "+1",
+    flag: "/flags/bb.webp",
+    country_code: "BB"
+  },
+  {
+    country: "Bélgica",
+    code: "+32",
+    flag: "/flags/be.webp",
+    country_code: "BE"
+  },
+  {
+    country: "Belice",
+    code: "+501",
+    flag: "/flags/bz.webp",
+    country_code: "BZ"
+  },
+  {
+    country: "Bielorrusia",
+    code: "+375",
+    flag: "/flags/by.webp",
+    country_code: "BY"
+  },
+  {
+    country: "Bolivia",
+    code: "+591",
+    flag: "/flags/bo.webp",
+    country_code: "BO"
+  },
+  {
+    country: "Bosnia y Herzegovina",
+    code: "+387",
+    flag: "/flags/ba.webp",
+    country_code: "BA"
+  },
+  {
+    country: "Brasil",
+    code: "+55",
+    flag: "/flags/br.webp",
+    country_code: "BR"
+  },
+  {
+    country: "Bulgaria",
+    code: "+359",
+    flag: "/flags/bg.webp",
+    country_code: "BG"
+  },
+  {
+    country: "Canadá",
+    code: "+1",
+    flag: "/flags/ca.webp",
+    country_code: "CA"
+  },
+  {
+    country: "Chile",
+    code: "+56",
+    flag: "/flags/cl.webp",
+    country_code: "CL"
+  },
+  {
+    country: "China",
+    code: "+86",
+    flag: "/flags/cn.webp",
+    country_code: "CN"
+  },
+  {
+    country: "Colombia",
+    code: "+57",
+    flag: "/flags/co.webp",
+    country_code: "CO"
+  },
+  {
+    country: "Corea del Sur",
+    code: "+82",
+    flag: "/flags/kr.webp",
+    country_code: "KR"
+  },
+  {
+    country: "Costa Rica",
+    code: "+506",
+    flag: "/flags/cr.webp",
+    country_code: "CR"
+  },
+  {
+    country: "Croacia",
+    code: "+385",
+    flag: "/flags/hr.webp",
+    country_code: "HR"
+  },
+  {
+    country: "Cuba",
+    code: "+53",
+    flag: "/flags/cu.webp",
+    country_code: "CU"
+  },
+  {
+    country: "Dinamarca",
+    code: "+45",
+    flag: "/flags/dk.webp",
+    country_code: "DK"
+  },
+  {
+    country: "Dominica",
+    code: "+1",
+    flag: "/flags/dm.webp",
+    country_code: "DM"
+  },
+  {
+    country: "Ecuador",
+    code: "+593",
+    flag: "/flags/ec.webp",
+    country_code: "EC"
+  },
+  {
+    country: "Egipto",
+    code: "+20",
+    flag: "/flags/eg.webp",
+    country_code: "EG"
+  },
+  {
+    country: "El Salvador",
+    code: "+503",
+    flag: "/flags/sv.webp",
+    country_code: "SV"
+  },
+  {
+    country: "España",
+    code: "+34",
+    flag: "/flags/es.webp",
+    country_code: "ES"
+  },
+  {
+    country: "Estados Unidos",
+    code: "+1",
+    flag: "/flags/us.webp",
+    country_code: "US"
+  },
+  {
+    country: "Estonia",
+    code: "+372",
+    flag: "/flags/ee.webp",
+    country_code: "EE"
+  },
+  {
+    country: "Filipinas",
+    code: "+63",
+    flag: "/flags/ph.webp",
+    country_code: "PH"
+  },
+  {
+    country: "Finlandia",
+    code: "+358",
+    flag: "/flags/fi.webp",
+    country_code: "FI"
+  },
+  {
+    country: "Francia",
+    code: "+33",
+    flag: "/flags/fr.webp",
+    country_code: "FR"
+  },
+  {
+    country: "Granada",
+    code: "+1",
+    flag: "/flags/gd.webp",
+    country_code: "GD"
+  },
+  {
+    country: "Grecia",
+    code: "+30",
+    flag: "/flags/gr.webp",
+    country_code: "GR"
+  },
+  {
+    country: "Guatemala",
+    code: "+502",
+    flag: "/flags/gt.webp",
+    country_code: "GT"
+  },
+  {
+    country: "Guyana",
+    code: "+592",
+    flag: "/flags/gy.webp",
+    country_code: "GY"
+  },
+  {
+    country: "Haití",
+    code: "+509",
+    flag: "/flags/ht.webp",
+    country_code: "HT"
+  },
+  {
+    country: "Honduras",
+    code: "+504",
+    flag: "/flags/hn.webp",
+    country_code: "HN"
+  },
+  {
+    country: "Hungría",
+    code: "+36",
+    flag: "/flags/hu.webp",
+    country_code: "HU"
+  },
+  {
+    country: "India",
+    code: "+91",
+    flag: "/flags/in.webp",
+    country_code: "IN"
+  },
+  {
+    country: "Indonesia",
+    code: "+62",
+    flag: "/flags/id.webp",
+    country_code: "ID"
+  },
+  {
+    country: "Irak",
+    code: "+964",
+    flag: "/flags/iq.webp",
+    country_code: "IQ"
+  },
+  {
+    country: "Irlanda",
+    code: "+353",
+    flag: "/flags/ie.webp",
+    country_code: "IE"
+  },
+  {
+    country: "Islandia",
+    code: "+354",
+    flag: "/flags/is.webp",
+    country_code: "IS"
+  },
+  {
+    country: "Israel",
+    code: "+972",
+    flag: "/flags/il.webp",
+    country_code: "IL"
+  },
+  {
+    country: "Italia",
+    code: "+39",
+    flag: "/flags/it.webp",
+    country_code: "IT"
+  },
+  {
+    country: "Jamaica",
+    code: "+1",
+    flag: "/flags/jm.webp",
+    country_code: "JM"
+  },
+  {
+    country: "Japón",
+    code: "+81",
+    flag: "/flags/jp.webp",
+    country_code: "JP"
+  },
+  {
+    country: "Kenia",
+    code: "+254",
+    flag: "/flags/ke.webp",
+    country_code: "KE"
+  },
+  {
+    country: "Letonia",
+    code: "+371",
+    flag: "/flags/lv.webp",
+    country_code: "LV"
+  },
+  {
+    country: "Lituania",
+    code: "+370",
+    flag: "/flags/lt.webp",
+    country_code: "LT"
+  },
+  {
+    country: "Luxemburgo",
+    code: "+352",
+    flag: "/flags/lu.webp",
+    country_code: "LU"
+  },
+  {
+    country: "Malasia",
+    code: "+60",
+    flag: "/flags/my.webp",
+    country_code: "MY"
+  },
+  {
+    country: "Malta",
+    code: "+356",
+    flag: "/flags/mt.webp",
+    country_code: "MT"
+  },
+  {
+    country: "México",
+    code: "+52",
+    flag: "/flags/mx.webp",
+    country_code: "MX"
+  },
+  {
+    country: "Mónaco",
+    code: "+377",
+    flag: "/flags/mc.webp",
+    country_code: "MC"
+  },
+  {
+    country: "Nicaragua",
+    code: "+505",
+    flag: "/flags/ni.webp",
+    country_code: "NI"
+  },
+  {
+    country: "Nigeria",
+    code: "+234",
+    flag: "/flags/ng.webp",
+    country_code: "NG"
+  },
+  {
+    country: "Noruega",
+    code: "+47",
+    flag: "/flags/no.webp",
+    country_code: "NO"
+  },
+  {
+    country: "Nueva Zelanda",
+    code: "+64",
+    flag: "/flags/nz.webp",
+    country_code: "NZ"
+  },
+  {
+    country: "Países Bajos",
+    code: "+31",
+    flag: "/flags/nl.webp",
+    country_code: "NL"
+  },
+  {
+    country: "Pakistán",
+    code: "+92",
+    flag: "/flags/pk.webp",
+    country_code: "PK"
+  },
+  {
+    country: "Panamá",
+    code: "+507",
+    flag: "/flags/pa.webp",
+    country_code: "PA"
+  },
+  {
+    country: "Paraguay",
+    code: "+595",
+    flag: "/flags/py.webp",
+    country_code: "PY"
+  },
+  {
+    country: "Perú",
+    code: "+51",
+    flag: "/flags/pe.webp",
+    country_code: "PE"
+  },
+  {
+    country: "Polonia",
+    code: "+48",
+    flag: "/flags/pl.webp",
+    country_code: "PL"
+  },
+  {
+    country: "Portugal",
+    code: "+351",
+    flag: "/flags/pt.webp",
+    country_code: "PT"
+  },
+  {
+    country: "Reino Unido",
+    code: "+44",
+    flag: "/flags/gb.webp",
+    country_code: "GB"
+  },
+  {
+    country: "República Checa",
+    code: "+420",
+    flag: "/flags/cz.webp",
+    country_code: "CZ"
+  },
+  {
+    country: "República Dominicana",
+    code: "+1",
+    flag: "/flags/do.webp",
+    country_code: "DO"
+  },
+  {
+    country: "Rumanía",
+    code: "+40",
+    flag: "/flags/ro.webp",
+    country_code: "RO"
+  },
+  {
+    country: "Rusia",
+    code: "+7",
+    flag: "/flags/ru.webp",
+    country_code: "RU"
+  },
+  {
+    country: "San Cristóbal y Nieves",
+    code: "+1",
+    flag: "/flags/kn.webp",
+    country_code: "KN"
+  },
+  {
+    country: "San Vicente y las Granadinas",
+    code: "+1",
+    flag: "/flags/vc.webp",
+    country_code: "VC"
+  },
+  {
+    country: "Santa Lucía",
+    code: "+1",
+    flag: "/flags/lc.webp",
+    country_code: "LC"
+  },
+  {
+    country: "Singapur",
+    code: "+65",
+    flag: "/flags/sg.webp",
+    country_code: "SG"
+  },
+  {
+    country: "Sudáfrica",
+    code: "+27",
+    flag: "/flags/za.webp",
+    country_code: "ZA"
+  },
+  {
+    country: "Suecia",
+    code: "+46",
+    flag: "/flags/se.webp",
+    country_code: "SE"
+  },
+  {
+    country: "Suiza",
+    code: "+41",
+    flag: "/flags/ch.webp",
+    country_code: "CH"
+  },
+  {
+    country: "Surinam",
+    code: "+597",
+    flag: "/flags/sr.webp",
+    country_code: "SR"
+  },
+  {
+    country: "Tailandia",
+    code: "+66",
+    flag: "/flags/th.webp",
+    country_code: "TH"
+  },
+  {
+    country: "Trinidad y Tobago",
+    code: "+1",
+    flag: "/flags/tt.webp",
+    country_code: "TT"
+  },
+  {
+    country: "Ucrania",
+    code: "+380",
+    flag: "/flags/ua.webp",
+    country_code: "UA"
+  },
+  {
+    country: "Uruguay",
+    code: "+598",
+    flag: "/flags/uy.webp",
+    country_code: "UY"
+  },
+  {
+    country: "Venezuela",
+    code: "+58",
+    flag: "/flags/ve.webp",
+    country_code: "VE"
+  },
+  {
+    country: "Vietnam",
+    code: "+84",
+    flag: "/flags/vn.webp",
+    country_code: "VN"
   }
-  async init(o) {
-    this.container = o;
-    const d = await (await fetch("src/assets/country-code.json")).json();
-    if (this.codes = d.sort((c, e) => c.country.localeCompare(e.country, "es")), this.code) {
-      const c = this.codes.find((e) => e.country_code === this.code);
+];
+class E {
+  constructor({ code: t = null, onChange: d = () => {
+  }, styleOverrides: c = {} } = {}) {
+    this.code = t, this.onChange = d, this.styleOverrides = c, this.codes = [], this.selectedCode = t, this.isDropdownOpen = !1, this.searchQuery = "", this.container = null, this.dropdown = null, this._outsideHandler = null;
+  }
+  _getAssetsBase() {
+    if (typeof import.meta < "u" && import.meta.url)
+      try {
+        return new URL("./assets", self.location).href + "/";
+      } catch {
+      }
+    return "";
+  }
+  async init(t) {
+    if (this.container = t, this.codes = [...A].sort((c, a) => c.country.localeCompare(a.country, "es")), this._assetsBase = this._getAssetsBase(), this.code) {
+      const c = this.codes.find((a) => a.country_code === this.code);
       c && (this.selectedCode = c.country_code);
     } else {
       const c = [
         async () => {
           try {
-            const s = await (await fetch("https://ip-api.com/json/?fields=countryCode")).json();
-            if (s.countryCode)
-              return this.codes.find((t) => t.country_code === s.countryCode);
+            const e = await (await fetch("https://ip-api.com/json/?fields=countryCode")).json();
+            if (e.countryCode)
+              return this.codes.find((r) => r.country_code === e.countryCode);
           } catch {
           }
           return null;
         },
         async () => {
           try {
-            const s = await (await fetch("https://get.geojs.io/v1/ip/country.json")).json();
-            if (s.country)
-              return this.codes.find((t) => t.country_code === s.country);
+            const e = await (await fetch("https://get.geojs.io/v1/ip/country.json")).json();
+            if (e.country)
+              return this.codes.find((r) => r.country_code === e.country);
           } catch {
           }
           return null;
         },
         async () => {
           try {
-            const s = await (await fetch("https://ipapi.co/json/")).json();
-            if (s.country_code)
-              return this.codes.find((t) => t.country_code === s.country_code);
+            const e = await (await fetch("https://ipapi.co/json/")).json();
+            if (e.country_code)
+              return this.codes.find((r) => r.country_code === e.country_code);
           } catch {
           }
           return null;
         }
       ];
-      let e = null;
+      let a = null;
       for (const n of c)
         try {
-          if (e = await Promise.race([
+          if (a = await Promise.race([
             n(),
-            new Promise((s) => setTimeout(() => s(null), 3e3))
-          ]), e)
+            new Promise((e) => setTimeout(() => e(null), 3e3))
+          ]), a)
             break;
         } catch {
         }
-      if (!e)
+      if (!a)
         try {
-          const n = Intl.DateTimeFormat().resolvedOptions().timeZone, t = {
+          const n = Intl.DateTimeFormat().resolvedOptions().timeZone, r = {
             "America/Lima": "PE",
             "America/Bogota": "CO",
             "America/Mexico_City": "MX",
@@ -114,92 +674,92 @@ class _ {
             "Africa/Nairobi": "KE",
             "Africa/Lagos": "NG"
           }[n];
-          t && (e = this.codes.find((i) => i.country_code === t));
+          r && (a = this.codes.find((m) => m.country_code === r));
         } catch {
         }
-      if (e)
-        this.selectedCode = e.country_code;
+      if (a)
+        this.selectedCode = a.country_code;
       else {
-        const n = this.codes.find((s) => s.country_code === "CO");
+        const n = this.codes.find((e) => e.country_code === "CO");
         n && (this.selectedCode = n.country_code);
       }
     }
     this.render();
-    const p = this.codes.find((c) => c.country_code === this.selectedCode);
-    p && this.onChange(p), this._setupOutsideClick();
+    const d = this.codes.find((c) => c.country_code === this.selectedCode);
+    d && this.onChange(d), this._setupOutsideClick();
   }
   render() {
     this.container.innerHTML = "";
-    const o = document.createElement("button");
-    o.className = "telpick-btn", Object.assign(o.style, this.styleOverrides), o.onclick = () => {
+    const t = document.createElement("button");
+    t.className = "telpick-btn", Object.assign(t.style, this.styleOverrides), t.onclick = () => {
       this.isDropdownOpen = !this.isDropdownOpen, this.render();
     };
-    const r = document.createElement("div");
-    r.className = "telpick-flag";
-    const d = this.codes.find((e) => e.country_code === this.selectedCode) || { flag: "", code: "", country: "" };
-    if (d.flag) {
+    const d = document.createElement("div");
+    d.className = "telpick-flag";
+    const c = this.codes.find((e) => e.country_code === this.selectedCode) || { flag: "", code: "", country: "" };
+    if (c.flag) {
       const e = document.createElement("img");
-      e.src = "src/assets" + d.flag, e.className = "w-full h-full object-cover", e.alt = "flag", r.appendChild(e);
+      e.src = (this._assetsBase || "src/assets") + (c.flag.startsWith("/") ? c.flag : "/" + c.flag), e.className = "w-full h-full object-cover", e.alt = "flag", d.appendChild(e);
     }
-    o.appendChild(r);
-    const p = document.createElement("span");
-    p.textContent = d.code, o.appendChild(p);
-    const c = document.createElement("span");
-    if (c.className = "ml-auto", c.textContent = "▼", o.appendChild(c), this.container.appendChild(o), this.isDropdownOpen) {
-      this.dropdown = document.createElement("div"), this.dropdown.className = "telpick-dropdown", this.dropdown.onclick = (t) => t.stopPropagation(), this.dropdown.onmousedown = (t) => t.stopPropagation();
+    t.appendChild(d);
+    const a = document.createElement("span");
+    a.textContent = c.code, t.appendChild(a);
+    const n = document.createElement("span");
+    if (n.className = "ml-auto", n.textContent = "▼", t.appendChild(n), this.container.appendChild(t), this.isDropdownOpen) {
+      this.dropdown = document.createElement("div"), this.dropdown.className = "telpick-dropdown", this.dropdown.onclick = (o) => o.stopPropagation(), this.dropdown.onmousedown = (o) => o.stopPropagation();
       const e = document.createElement("input");
-      e.className = "telpick-search", e.type = "text", e.placeholder = "Buscar país...", e.value = this.searchQuery, e.oninput = (t) => {
-        var m;
-        t.stopPropagation();
-        const i = t.target, f = i.selectionStart || 0, u = i.value;
+      e.className = "telpick-search", e.type = "text", e.placeholder = "Buscar país...", e.value = this.searchQuery, e.oninput = (o) => {
+        var g;
+        o.stopPropagation();
+        const l = o.target, y = l.selectionStart || 0, u = l.value;
         this.searchQuery = u;
-        const l = (m = this.dropdown) == null ? void 0 : m.querySelector("ul");
-        l ? (l.innerHTML = "", (this.searchQuery ? this.codes.filter((a) => a.country.toLowerCase().includes(this.searchQuery.toLowerCase())) : this.codes).forEach((a) => {
-          const h = document.createElement("li"), w = a.country_code === this.selectedCode && this.selectedCode !== null && this.selectedCode !== void 0;
-          h.className = `telpick-item ${w ? "telpick-item-selected" : ""}`, h.onclick = () => {
-            this.selectedCode = a.country_code, this.onChange(a), this.isDropdownOpen = !1, this.searchQuery = "", this.render();
+        const i = (g = this.dropdown) == null ? void 0 : g.querySelector("ul");
+        i ? (i.innerHTML = "", (this.searchQuery ? this.codes.filter((s) => s.country.toLowerCase().includes(this.searchQuery.toLowerCase())) : this.codes).forEach((s) => {
+          const f = document.createElement("li"), C = s.country_code === this.selectedCode && this.selectedCode !== null && this.selectedCode !== void 0;
+          f.className = `telpick-item ${C ? "telpick-item-selected" : ""}`, f.onclick = () => {
+            this.selectedCode = s.country_code, this.onChange(s), this.isDropdownOpen = !1, this.searchQuery = "", this.render();
           };
-          const A = document.createElement("div");
-          A.className = "telpick-flag";
-          const y = document.createElement("img");
-          y.src = "src/assets" + a.flag, y.className = "w-full h-full object-cover", y.alt = "flag", A.appendChild(y), h.appendChild(A);
-          const E = document.createElement("span");
-          E.textContent = a.country, h.appendChild(E);
-          const g = document.createElement("span");
-          g.className = "ml-auto", g.textContent = a.code, h.appendChild(g), l.appendChild(h);
+          const w = document.createElement("div");
+          w.className = "telpick-flag";
+          const h = document.createElement("img");
+          h.src = (this._assetsBase || "src/assets") + (s.flag.startsWith("/") ? s.flag : "/" + s.flag), h.className = "w-full h-full object-cover", h.alt = "flag", w.appendChild(h), f.appendChild(w);
+          const b = document.createElement("span");
+          b.textContent = s.country, f.appendChild(b);
+          const _ = document.createElement("span");
+          _.className = "ml-auto", _.textContent = s.code, f.appendChild(_), i.appendChild(f);
         }), requestAnimationFrame(() => {
           if (e) {
             e.focus();
-            const a = Math.min(f + 1, u.length);
-            e.setSelectionRange(a, a);
+            const s = Math.min(y + 1, u.length);
+            e.setSelectionRange(s, s);
           }
         })) : this.render();
-      }, e.onclick = (t) => t.stopPropagation(), e.onmousedown = (t) => t.stopPropagation(), this.dropdown.appendChild(e);
-      const n = document.createElement("ul");
-      n.style.maxHeight = "130px", n.style.overflowY = "auto", (this.searchQuery ? this.codes.filter((t) => t.country.toLowerCase().includes(this.searchQuery.toLowerCase())) : this.codes).forEach((t) => {
-        const i = document.createElement("li"), f = t.country_code === this.selectedCode && this.selectedCode !== null && this.selectedCode !== void 0;
-        i.className = `telpick-item ${f ? "telpick-item-selected" : ""}`, i.setAttribute("aria-selected", f), i.onclick = () => {
-          this.selectedCode = t.country_code, this.onChange(t), this.isDropdownOpen = !1, this.searchQuery = "", this.render();
+      }, e.onclick = (o) => o.stopPropagation(), e.onmousedown = (o) => o.stopPropagation(), this.dropdown.appendChild(e);
+      const r = document.createElement("ul");
+      r.style.maxHeight = "130px", r.style.overflowY = "auto", (this.searchQuery ? this.codes.filter((o) => o.country.toLowerCase().includes(this.searchQuery.toLowerCase())) : this.codes).forEach((o) => {
+        const l = document.createElement("li"), y = o.country_code === this.selectedCode && this.selectedCode !== null && this.selectedCode !== void 0;
+        l.className = `telpick-item ${y ? "telpick-item-selected" : ""}`, l.setAttribute("aria-selected", y), l.onclick = () => {
+          this.selectedCode = o.country_code, this.onChange(o), this.isDropdownOpen = !1, this.searchQuery = "", this.render();
         };
         const u = document.createElement("div");
         u.className = "telpick-flag";
-        const l = document.createElement("img");
-        l.src = "src/assets" + t.flag, l.className = "w-full h-full object-cover", l.alt = "flag", u.appendChild(l), i.appendChild(u);
-        const m = document.createElement("span");
-        m.textContent = t.country, i.appendChild(m);
-        const C = document.createElement("span");
-        C.className = "ml-auto", C.textContent = t.code, i.appendChild(C), n.appendChild(i);
-      }), this.dropdown.appendChild(n), this.container.appendChild(this.dropdown), requestAnimationFrame(() => {
+        const i = document.createElement("img");
+        i.src = (this._assetsBase || "src/assets") + (o.flag.startsWith("/") ? o.flag : "/" + o.flag), i.className = "w-full h-full object-cover", i.alt = "flag", u.appendChild(i), l.appendChild(u);
+        const g = document.createElement("span");
+        g.textContent = o.country, l.appendChild(g);
+        const p = document.createElement("span");
+        p.className = "ml-auto", p.textContent = o.code, l.appendChild(p), r.appendChild(l);
+      }), this.dropdown.appendChild(r), this.container.appendChild(this.dropdown), requestAnimationFrame(() => {
         e && e.focus();
       });
     }
   }
   _setupOutsideClick() {
-    this._outsideHandler && document.removeEventListener("click", this._outsideHandler), this._outsideHandler = (o) => {
-      const r = o.target;
-      if (this.isDropdownOpen && this.container && r) {
-        const d = this.container.querySelector(".telpick-dropdown");
-        !this.container.contains(r) && (!d || !d.contains(r)) && (this.isDropdownOpen = !1, this.render());
+    this._outsideHandler && document.removeEventListener("click", this._outsideHandler), this._outsideHandler = (t) => {
+      const d = t.target;
+      if (this.isDropdownOpen && this.container && d) {
+        const c = this.container.querySelector(".telpick-dropdown");
+        !this.container.contains(d) && (!c || !c.contains(d)) && (this.isDropdownOpen = !1, this.render());
       }
     }, document.addEventListener("click", this._outsideHandler, !0);
   }
@@ -207,7 +767,7 @@ class _ {
     this._outsideHandler && document.removeEventListener("mousedown", this._outsideHandler), this.container.innerHTML = "";
   }
 }
-window.Telpick = _;
+window.Telpick = E;
 export {
-  _ as Telpick
+  E as Telpick
 };