telpick 1.0.6 → 1.0.7

package/dist/telpick.umd.js

@@ -0,0 +1 @@
+(function(u,C){typeof exports=="object"&&typeof module<"u"?C(exports):typeof define=="function"&&define.amd?define(["exports"],C):(u=typeof globalThis<"u"?globalThis:u||self,C(u.Telpick={}))})(this,function(u){"use strict";const C="";class k{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}async init(o){this.container=o;const d=await(await fetch("src/assets/country-code.json")).json();if(this.codes=d.sort((i,e)=>i.country.localeCompare(e.country,"es")),this.code){const i=this.codes.find(e=>e.country_code===this.code);i&&(this.selectedCode=i.country_code)}else{const i=[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)}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)}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)}catch{}return null}];let e=null;for(const n of i)try{if(e=await Promise.race([n(),new Promise(s=>setTimeout(()=>s(null),3e3))]),e)break}catch{}if(!e)try{const n=Intl.DateTimeFormat().resolvedOptions().timeZone,t={"America/Lima":"PE","America/Bogota":"CO","America/Mexico_City":"MX","America/Argentina/Buenos_Aires":"AR","America/Santiago":"CL","America/Caracas":"VE","America/Montevideo":"UY","America/Asuncion":"PY","America/La_Paz":"BO","America/Guayaquil":"EC","America/Panama":"PA","America/Costa_Rica":"CR","America/Managua":"NI","America/Tegucigalpa":"HN","America/Guatemala":"GT","America/El_Salvador":"SV","America/Havana":"CU","America/Santo_Domingo":"DO","America/Jamaica":"JM","America/Port-au-Prince":"HT","Europe/Madrid":"ES","Europe/London":"GB","Europe/Paris":"FR","Europe/Berlin":"DE","Europe/Rome":"IT","Europe/Amsterdam":"NL","Europe/Brussels":"BE","Europe/Vienna":"AT","Europe/Zurich":"CH","Europe/Stockholm":"SE","Europe/Oslo":"NO","Europe/Copenhagen":"DK","Europe/Helsinki":"FI","Europe/Warsaw":"PL","Europe/Prague":"CZ","Europe/Bucharest":"RO","Europe/Moscow":"RU","America/New_York":"US","America/Chicago":"US","America/Denver":"US","America/Los_Angeles":"US","America/Toronto":"CA","America/Vancouver":"CA","Asia/Tokyo":"JP","Asia/Shanghai":"CN","Asia/Hong_Kong":"CN","Asia/Seoul":"KR","Asia/Singapore":"SG","Asia/Bangkok":"TH","Asia/Jakarta":"ID","Asia/Manila":"PH","Asia/Kolkata":"IN","Asia/Dubai":"AE","Asia/Riyadh":"SA","Australia/Sydney":"AU","Australia/Melbourne":"AU","Pacific/Auckland":"NZ","Africa/Cairo":"EG","Africa/Johannesburg":"ZA","Africa/Nairobi":"KE","Africa/Lagos":"NG"}[n];t&&(e=this.codes.find(c=>c.country_code===t))}catch{}if(e)this.selectedCode=e.country_code;else{const n=this.codes.find(s=>s.country_code==="CO");n&&(this.selectedCode=n.country_code)}}this.render();const m=this.codes.find(i=>i.country_code===this.selectedCode);m&&this.onChange(m),this._setupOutsideClick()}render(){this.container.innerHTML="";const o=document.createElement("button");o.className="telpick-btn",Object.assign(o.style,this.styleOverrides),o.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 e=document.createElement("img");e.src="src/assets"+d.flag,e.className="w-full h-full object-cover",e.alt="flag",r.appendChild(e)}o.appendChild(r);const m=document.createElement("span");m.textContent=d.code,o.appendChild(m);const i=document.createElement("span");if(i.className="ml-auto",i.textContent="▼",o.appendChild(i),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();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 f;t.stopPropagation();const c=t.target,y=c.selectionStart||0,h=c.value;this.searchQuery=h;const l=(f=this.dropdown)==null?void 0:f.querySelector("ul");l?(l.innerHTML="",(this.searchQuery?this.codes.filter(a=>a.country.toLowerCase().includes(this.searchQuery.toLowerCase())):this.codes).forEach(a=>{const p=document.createElement("li"),S=a.country_code===this.selectedCode&&this.selectedCode!==null&&this.selectedCode!==void 0;p.className=`telpick-item ${S?"telpick-item-selected":""}`,p.onclick=()=>{this.selectedCode=a.country_code,this.onChange(a),this.isDropdownOpen=!1,this.searchQuery="",this.render()};const E=document.createElement("div");E.className="telpick-flag";const g=document.createElement("img");g.src="src/assets"+a.flag,g.className="w-full h-full object-cover",g.alt="flag",E.appendChild(g),p.appendChild(E);const _=document.createElement("span");_.textContent=a.country,p.appendChild(_);const w=document.createElement("span");w.className="ml-auto",w.textContent=a.code,p.appendChild(w),l.appendChild(p)}),requestAnimationFrame(()=>{if(e){e.focus();const a=Math.min(y+1,h.length);e.setSelectionRange(a,a)}})):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 c=document.createElement("li"),y=t.country_code===this.selectedCode&&this.selectedCode!==null&&this.selectedCode!==void 0;c.className=`telpick-item ${y?"telpick-item-selected":""}`,c.setAttribute("aria-selected",y),c.onclick=()=>{this.selectedCode=t.country_code,this.onChange(t),this.isDropdownOpen=!1,this.searchQuery="",this.render()};const h=document.createElement("div");h.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",h.appendChild(l),c.appendChild(h);const f=document.createElement("span");f.textContent=t.country,c.appendChild(f);const A=document.createElement("span");A.className="ml-auto",A.textContent=t.code,c.appendChild(A),n.appendChild(c)}),this.dropdown.appendChild(n),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())}},document.addEventListener("click",this._outsideHandler,!0)}destroy(){this._outsideHandler&&document.removeEventListener("mousedown",this._outsideHandler),this.container.innerHTML=""}}window.Telpick=k,u.Telpick=k,Object.defineProperty(u,Symbol.toStringTag,{value:"Module"})});

package/dist/telpick.vue.es.js

@@ -1,22 +1,25 @@
+import { h as t } from "vue";
 import { Telpick as i } from "./telpick.es.js";
-function o(n, { emit: t }) {
-  let e = null;
-  return {
-    mounted() {
-      e = new i({
-        code: n.code,
-        onChange: (r) => t("update:code", r),
-        styleOverrides: n.styleOverrides || {}
-      }), e.init(this.$el);
-    },
-    beforeUnmount() {
-      e && e.destroy();
-    },
-    render() {
-      return null;
-    }
-  };
-}
+const r = {
+  props: {
+    code: { type: String, default: null },
+    styleOverrides: { type: Object, default: () => ({}) }
+  },
+  emits: ["update:code"],
+  mounted() {
+    this.telpickInstance = new i({
+      code: this.code,
+      onChange: (e) => this.$emit("update:code", e),
+      styleOverrides: this.styleOverrides || {}
+    }), this.telpickInstance.init(this.$el);
+  },
+  beforeUnmount() {
+    this.telpickInstance && this.telpickInstance.destroy();
+  },
+  render() {
+    return t("div");
+  }
+};
 export {
-  o as TelpickVue
+  r as TelpickVue
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "telpick",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Multi-platform country and phone code selector with a modern design, smooth animations, and automatic IP detection.",
   "main": "dist/telpick.es.js",
   "module": "dist/telpick.es.js",
@@ -8,6 +8,7 @@
   "exports": {
     ".": {
       "import": "./dist/telpick.es.js",
+      "require": "./dist/telpick.umd.js",
       "types": "./dist/telpick.d.ts"
     },
     "./vue": {
@@ -34,7 +35,7 @@
     "LICENSE"
   ],
   "scripts": {
-    "build": "vite build",
+    "build": "vite build && vite build --config vite.config.umd.js",
     "build:demo": "vite build --config vite.config.demo.js",
     "deploy:demo": "npm run build:demo && gh-pages -d docs",
     "dev": "vite",