intl-tel-input 29.4.0 → 29.4.1

package/dist/js/intlTelInputWithUtils.mjs

@@ -3442,7 +3442,7 @@ var UI = class {
       this.#detachedCountrySelectorEl.remove();
       this.#detachedCountrySelectorEl.style.top = "";
       this.#detachedCountrySelectorEl.style.bottom = "";
-      this.#detachedCountrySelectorEl.style.height = "";
+      this.#detachedCountrySelectorEl.style.removeProperty("--iti-virtual-keyboard-height");
       this.#detachedCountrySelectorEl.style.paddingLeft = "";
       this.#detachedCountrySelectorEl.style.paddingRight = "";
     } else {
@@ -3501,14 +3501,16 @@ var UI = class {
     this.telInputEl.style.anchorName = existing && existing !== "none" ? `${existing}, ${anchorName}` : anchorName;
     this.#detachedCountrySelectorEl.style.positionAnchor = anchorName;
   }
-  // Adjust the fullscreen popup dimensions to match the visual viewport,
-  // so it stays above the virtual keyboard on mobile devices.
+  // Tell the CSS how much of the fullscreen popup is covered by the virtual keyboard, so it can fit the
+  // country selector above it, while the popup itself (the dark backdrop) stays fullscreen behind the keyboard.
   #adjustFullscreenPopupToViewport() {
     const vv = window.visualViewport;
-    if (!vv || !this.#detachedCountrySelectorEl) {
+    const popup = this.#detachedCountrySelectorEl;
+    if (!vv || !popup) {
       return;
     }
-    this.#detachedCountrySelectorEl.style.height = `${vv.height}px`;
+    const virtualKeyboardHeight = Math.max(0, popup.offsetHeight - vv.height);
+    popup.style.setProperty("--iti-virtual-keyboard-height", `${virtualKeyboardHeight}px`);
   }
   // UI: Whether the country selector is currently open (visible).
   isCountrySelectorOpen() {
@@ -4978,7 +4980,7 @@ var intlTelInput = Object.assign(
     attachUtils,
     startedLoadingUtils: false,
     startedLoadingAutoCountry: false,
-    version: "29.4.0",
+    version: "29.4.1",
     NUMBER_FORMAT,
     NUMBER_TYPE,
     VALIDATION_ERROR,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intl-tel-input",
-  "version": "29.4.0",
+  "version": "29.4.1",
   "description": "A JavaScript library for entering, formatting, and validating international telephone numbers",
   "type": "module",
   "license": "MIT",