diff --git a/public/js/laravel-tel-input.js b/public/js/laravel-tel-input.js index ada1466..cdb6074 100644 --- a/public/js/laravel-tel-input.js +++ b/public/js/laravel-tel-input.js @@ -1 +1 @@ -(()=>{var e,t={166:()=>{!function(){"use strict";function e(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:null,a="".concat(e,"=").concat(t,";");if(n){var u=new Date;u.setTime(u.getTime()+24*n*60*60*1e3),a+="expires=".concat(u.toUTCString(),";")}o&&(a+="path=".concat(o,";")),i&&(a+="domain=".concat(i,";")),document.cookie=a}function t(e){for(var t=e+"=",n=document.cookie.split(";"),o=0;o1&&void 0!==arguments[1]?arguments[1]:{},i="IntlTelInputSelectedCountry_".concat(n.dataset.phoneInputId);window.intlTelInputGlobals.autoCountry=t(i)||window.intlTelInputGlobals.autoCountry;var a=n.closest("form");if(a&&a.setAttribute("autocomplete","off"),null==o.geoIpLookup)delete o.geoIpLookup;else if("ipinfo"===o.geoIpLookup)o.geoIpLookup=function(n,o){var a=t(i);a?n(a):fetch("https://ipinfo.io/json").then((function(e){return e.json()})).then((function(e){return e})).then((function(t){var o,a=null===(o=t.country)||void 0===o?void 0:o.toUpperCase();n(a),e(i,a)})).catch((function(e){return n("US")}))};else if("function"==typeof window[o.geoIpLookup])o.geoIpLookup=window[o.geoIpLookup];else{if("function"!=typeof o.geoIpLookup)throw new TypeError("Laravel-Tel-Input: Undefined function '".concat(o.geoIpLookup,"' specified in tel-input.options.geoIpLookup."));delete o.geoIpLookup}if(null==o.customPlaceholder)delete o.customPlaceholder;else if("function"==typeof window[o.customPlaceholder])o.customPlaceholder=window[o.customPlaceholder];else{if("function"!=typeof o.customPlaceholder)throw new TypeError("Laravel-Tel-Input: Undefined function '".concat(o.customPlaceholder,"' specified in tel-input.options.customPlaceholder."));delete o.customPlaceholder}o.utilsScript&&(o.utilsScript="/"==o.utilsScript.charAt(0)?o.utilsScript:"/"+o.utilsScript);var u=window.intlTelInput(n,o),r=function(){var t=u.getSelectedCountryData();if(t.iso2){var o;if(e(i,null===(o=t.iso2)||void 0===o?void 0:o.toUpperCase()),this.dataset.phoneCountryInput&&t.iso2){var a=document.querySelector(this.dataset.phoneCountryInput);if(a){var r,l,d=null===(r=a.value)||void 0===r?void 0:r.trim();a.value=null===(l=t.iso2)||void 0===l?void 0:l.toUpperCase(),a.value===d&&""==a.value||a.dispatchEvent(new KeyboardEvent("change"))}}if(this.dataset.phoneDialCodeInput&&t.dialCode){var c=document.querySelector(this.dataset.phoneDialCodeInput);if(c){var v=c.value;c.value=t.dialCode,c.value===v&&""==c.value||c.dispatchEvent(new KeyboardEvent("change"))}}n.dispatchEvent(new KeyboardEvent("change"))}},l=function(){if(this.dataset.phoneInput){var e=document.querySelector(this.dataset.phoneInput);if(e){var t,n,o,i,a=null===(t=e.value)||void 0===t?void 0:t.trim();if(""!=a&&"+"!=a.charAt(0)&&"0"!=a.charAt(0)&&null===u.isValidNumber()&&(a="+".concat(a),e.value=a),""!=(null===(n=u.getNumber())||void 0===n?void 0:n.trim())?u.isValidNumber()?e.value=u.getNumber():e.value="":""!=a&&null===u.isValidNumber()&&(u.setNumber(a),e.value=u.getNumber()),e.value===a||""==e.value||!0!==u.isValidNumber()&&null!==u.isValidNumber()){if(!1===u.isValidNumber())e.dispatchEvent(new KeyboardEvent("change")),e.dispatchEvent(new KeyboardEvent("input")),e.dispatchEvent(new CustomEvent("telchange",{detail:{valid:!1,validNumber:e.value,number:u.getNumber(),country:null===(o=u.getSelectedCountryData().iso2)||void 0===o?void 0:o.toUpperCase(),countryName:u.getSelectedCountryData().name,dialCode:u.getSelectedCountryData().dialCode}}))}else e.dispatchEvent(new KeyboardEvent("change")),e.dispatchEvent(new KeyboardEvent("input")),e.dispatchEvent(new CustomEvent("telchange",{detail:{valid:!0,validNumber:e.value,number:u.getNumber(),country:null===(i=u.getSelectedCountryData().iso2)||void 0===i?void 0:i.toUpperCase(),countryName:u.getSelectedCountryData().name,dialCode:u.getSelectedCountryData().dialCode}}))}}};if(n.addEventListener("countrychange",r),n.addEventListener("change",l),n.dataset.phoneInput){var d=document.querySelector(n.dataset.phoneInput);if(d){var c,v=null===(c=d.value)||void 0===c?void 0:c.trim();""!=v&&"+"!=v.charAt(0)&&"0"!=v.charAt(0)&&(v="+".concat(v)),d.addEventListener("change",(function(){var e,t=null===(e=this.value)||void 0===e?void 0:e.trim();t!=v&&""!=t&&u.setNumber(t)}))}}if(n.dataset.phoneCountryInput){var p=document.querySelector(n.dataset.phoneCountryInput);p&&p.addEventListener("change",(function(){var e;u.setCountry(null===(e=this.value)||void 0===e?void 0:e.trim())}))}n.dispatchEvent(new KeyboardEvent("countrychange")),document.addEventListener("turbolinks:load",(function(){n&&n.dispatchEvent(new KeyboardEvent("countrychange"))})),document.addEventListener("turbo:load",(function(){n&&n.dispatchEvent(new KeyboardEvent("countrychange"))}))}function o(){if("function"!=typeof window.intlTelInput)throw new TypeError("Laravel-Tel-Input: requires International Telephone Input (https://github.com/jackocnr/intl-tel-input). Please install with NPM or include the CDN.");var e=laravelTelInputConfig,t=document.querySelectorAll(".iti--laravel-tel-input");if(t.length>0)for(var o=0;o{}},n={};function o(e){var i=n[e];if(void 0!==i)return i.exports;var a=n[e]={exports:{}};return t[e](a,a.exports,o),a.exports}o.m=t,e=[],o.O=(t,n,i,a)=>{if(!n){var u=1/0;for(c=0;c=a)&&Object.keys(o.O).every((e=>o.O[e](n[l])))?n.splice(l--,1):(r=!1,a0&&e[c-1][2]>a;c--)e[c]=e[c-1];e[c]=[n,i,a]},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={237:0,960:0};o.O.j=t=>0===e[t];var t=(t,n)=>{var i,a,[u,r,l]=n,d=0;for(i in r)o.o(r,i)&&(o.m[i]=r[i]);if(l)var c=l(o);for(t&&t(n);do(166)));var i=o.O(void 0,[960],(()=>o(76)));i=o.O(i)})(); \ No newline at end of file +(()=>{var e,t={166:()=>{!function(){"use strict";function e(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null,o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null,i=arguments.length>4&&void 0!==arguments[4]?arguments[4]:null,a="".concat(e,"=").concat(t,";");if(n){var r=new Date;r.setTime(r.getTime()+24*n*60*60*1e3),a+="expires=".concat(r.toUTCString(),";")}o&&(a+="path=".concat(o,";")),i&&(a+="domain=".concat(i,";")),document.cookie=a}function t(e){for(var t=e+"=",n=document.cookie.split(";"),o=0;o1&&void 0!==arguments[1]?arguments[1]:{},i="IntlTelInputSelectedCountry_".concat(n.dataset.phoneInputId);window.intlTelInputGlobals.autoCountry=t(i)||window.intlTelInputGlobals.autoCountry;var a=n.closest("form");if(a&&a.setAttribute("autocomplete","off"),null==o.geoIpLookup)delete o.geoIpLookup;else if("ipinfo"===o.geoIpLookup)o.geoIpLookup=function(n,o){var a=t(i);a?n(a):fetch("https://ipinfo.io/json").then((function(e){return e.json()})).then((function(e){return e})).then((function(t){var o,a=null===(o=t.country)||void 0===o?void 0:o.toUpperCase();n(a),e(i,a)})).catch((function(e){return n("US")}))};else if("function"==typeof window[o.geoIpLookup])o.geoIpLookup=window[o.geoIpLookup];else{if("function"!=typeof o.geoIpLookup)throw new TypeError("Laravel-Tel-Input: Undefined function '".concat(o.geoIpLookup,"' specified in tel-input.options.geoIpLookup."));delete o.geoIpLookup}if(null==o.customPlaceholder)delete o.customPlaceholder;else if("function"==typeof window[o.customPlaceholder])o.customPlaceholder=window[o.customPlaceholder];else{if("function"!=typeof o.customPlaceholder)throw new TypeError("Laravel-Tel-Input: Undefined function '".concat(o.customPlaceholder,"' specified in tel-input.options.customPlaceholder."));delete o.customPlaceholder}o.utilsScript&&(o.utilsScript="/"==o.utilsScript.charAt(0)?o.utilsScript:"/"+o.utilsScript);var r=window.intlTelInput(n,o),u=function(){var t=r.getSelectedCountryData();if(t.iso2){var o;if(e(i,null===(o=t.iso2)||void 0===o?void 0:o.toUpperCase()),this.dataset.phoneCountryInput&&t.iso2){var a=document.querySelector(this.dataset.phoneCountryInput);if(a){var u,l,c=null===(u=a.value)||void 0===u?void 0:u.trim();a.value=null===(l=t.iso2)||void 0===l?void 0:l.toUpperCase(),a.value===c&&""==a.value||a.dispatchEvent(new KeyboardEvent("change"))}}if(this.dataset.phoneDialCodeInput&&t.dialCode){var d=document.querySelector(this.dataset.phoneDialCodeInput);if(d){var v=d.value;d.value=t.dialCode,d.value===v&&""==d.value||d.dispatchEvent(new KeyboardEvent("change"))}}n.dispatchEvent(new KeyboardEvent("change"))}},l=function(){if(this.dataset.phoneInput){var e=document.querySelector(this.dataset.phoneInput);if(e){var t,n,o,i,a=null===(t=e.value)||void 0===t?void 0:t.trim();if(""!=a&&"+"!=a.charAt(0)&&"0"!=a.charAt(0)&&null===r.isValidNumber()&&(a="+".concat(a),e.value=a),""!=(null===(n=r.getNumber())||void 0===n?void 0:n.trim())?r.isValidNumber()?e.value=r.getNumber():e.value="":""!=a&&null===r.isValidNumber()&&(r.setNumber(a),e.value=r.getNumber()),e.value===a||""==e.value||!0!==r.isValidNumber()&&null!==r.isValidNumber()){if(!1===r.isValidNumber())e.dispatchEvent(new KeyboardEvent("change")),e.dispatchEvent(new KeyboardEvent("input")),e.dispatchEvent(new CustomEvent("telchange",{detail:{valid:!1,validNumber:e.value,number:r.getNumber(),country:null===(o=r.getSelectedCountryData().iso2)||void 0===o?void 0:o.toUpperCase(),countryName:r.getSelectedCountryData().name,dialCode:r.getSelectedCountryData().dialCode}}))}else e.dispatchEvent(new KeyboardEvent("change")),e.dispatchEvent(new KeyboardEvent("input")),e.dispatchEvent(new CustomEvent("telchange",{detail:{valid:!0,validNumber:e.value,number:r.getNumber(),country:null===(i=r.getSelectedCountryData().iso2)||void 0===i?void 0:i.toUpperCase(),countryName:r.getSelectedCountryData().name,dialCode:r.getSelectedCountryData().dialCode}}))}}};if(n.removeEventListener("countrychange",u),n.addEventListener("countrychange",u),n.removeEventListener("change",l),n.addEventListener("change",l),n.dataset.phoneInput){var c=document.querySelector(n.dataset.phoneInput);if(c){var d,v=null===(d=c.value)||void 0===d?void 0:d.trim();""!=v&&"+"!=v.charAt(0)&&"0"!=v.charAt(0)&&(v="+".concat(v));var s=function(){var e,t=null===(e=this.value)||void 0===e?void 0:e.trim();t!=v&&""!=t&&r.setNumber(t)};c.removeEventListener("change",s),c.addEventListener("change",s)}}if(n.dataset.phoneCountryInput){var p=document.querySelector(n.dataset.phoneCountryInput);if(p){var h=function(){var e;r.setCountry(null===(e=this.value)||void 0===e?void 0:e.trim())};p.removeEventListener("change",h),p.addEventListener("change",h)}}n.dispatchEvent(new KeyboardEvent("countrychange")),document.addEventListener("turbolinks:load",(function(){n&&n.dispatchEvent(new KeyboardEvent("countrychange"))})),document.addEventListener("turbo:load",(function(){n&&n.dispatchEvent(new KeyboardEvent("countrychange"))}))}function o(){if("function"!=typeof window.intlTelInput)throw new TypeError("Laravel-Tel-Input: requires International Telephone Input (https://github.com/jackocnr/intl-tel-input). Please install with NPM or include the CDN.");var e=laravelTelInputConfig,t=document.querySelectorAll(".iti--laravel-tel-input");if(t.length>0)for(var o=0;o{}},n={};function o(e){var i=n[e];if(void 0!==i)return i.exports;var a=n[e]={exports:{}};return t[e](a,a.exports,o),a.exports}o.m=t,e=[],o.O=(t,n,i,a)=>{if(!n){var r=1/0;for(d=0;d=a)&&Object.keys(o.O).every((e=>o.O[e](n[l])))?n.splice(l--,1):(u=!1,a0&&e[d-1][2]>a;d--)e[d]=e[d-1];e[d]=[n,i,a]},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={237:0,960:0};o.O.j=t=>0===e[t];var t=(t,n)=>{var i,a,[r,u,l]=n,c=0;for(i in u)o.o(u,i)&&(o.m[i]=u[i]);if(l)var d=l(o);for(t&&t(n);co(166)));var i=o.O(void 0,[960],(()=>o(76)));i=o.O(i)})(); \ No newline at end of file diff --git a/resources/js/laravel-tel-input.js b/resources/js/laravel-tel-input.js index ec8058e..2387cc6 100644 --- a/resources/js/laravel-tel-input.js +++ b/resources/js/laravel-tel-input.js @@ -214,7 +214,9 @@ } // Listen the tel inputs events + telInput.removeEventListener('countrychange', countryChangeEventFunc); telInput.addEventListener('countrychange', countryChangeEventFunc); + telInput.removeEventListener('change', telInputChangeEventFunc); telInput.addEventListener('change', telInputChangeEventFunc); // listen and sync phone number with tel input if any @@ -225,21 +227,25 @@ if (oldValue != '' && oldValue.charAt(0) != '+' && oldValue.charAt(0) != '0') { oldValue = `+${oldValue}`; } - phoneInput.addEventListener('change', function () { + const changeHandler = function () { let newValue = this.value?.trim(); if (newValue != oldValue && newValue != '') { itiPhone.setNumber(newValue); } - }); + } + phoneInput.removeEventListener('change', changeHandler); + phoneInput.addEventListener('change', changeHandler); } } // listen and sync phone country with tel input if any if (telInput.dataset.phoneCountryInput) { const phoneCountryInput = document.querySelector(telInput.dataset.phoneCountryInput); if (phoneCountryInput) { - phoneCountryInput.addEventListener('change', function () { + const changeHandler = function () { itiPhone.setCountry(this.value?.trim()); - }); + } + phoneCountryInput.removeEventListener('change', changeHandler); + phoneCountryInput.addEventListener('change', changeHandler); } } diff --git a/resources/views/components/laravel-tel-input.blade.php b/resources/views/components/laravel-tel-input.blade.php index 52cbfe7..858a317 100644 --- a/resources/views/components/laravel-tel-input.blade.php +++ b/resources/views/components/laravel-tel-input.blade.php @@ -1,9 +1,11 @@ {{-- Hidden phone input --}} wire('model') }} id="{{ $id }}" name="{{ $name }}" + @if ($attributes->whereStartsWith('wire:model')->first()) + {{ $attributes->wire('model') }} + @endif @if ($attributes->has('value')) value="{{ $attributes->get('value') }}" @endif