@descope/web-components-ui 1.0.380 → 1.0.382

package/dist/index.esm.js

@@ -13,7 +13,7 @@ import debounce from 'lodash.debounce';
 import '@vaadin/password-field';
 import MarkdownIt from 'markdown-it';
 import '@vaadin/text-area';
-import parsePhone from 'libphonenumber-js/min';
+import { parsePhoneNumberFromString } from 'libphonenumber-js/min';
 import '@vaadin/grid';
 import { GridSortColumn } from '@vaadin/grid/vaadin-grid-sort-column';
 import { GridSelectionColumn } from '@vaadin/grid/vaadin-grid-selection-column';
@@ -4703,9 +4703,6 @@ class RawDateFieldClass extends BaseInputClass$8 {
     this.baseElement.noCloseOnOutsideClick = true;
     this.baseElement.renderer = this.#popoverRenderer.bind(this);
 
-    // override vaadin's constructed stylesheet which hides the host element
-    overrideConstructedStylesheet(this.baseElement);
-
     // block popover events from focusing/blurring the text-field
     this.baseElement.addEventListener('click', (e) => {
       e.preventDefault();
@@ -4717,6 +4714,8 @@ class RawDateFieldClass extends BaseInputClass$8 {
     // popoverRenderer should run only once, when the popover is first rendering.
     if (!root.firstChild) {
       root.appendChild(this.#getPopoverContent());
+      // override vaadin's constructed stylesheet which hides the host element
+      overrideConstructedStylesheet(this.baseElement);
 
       // To prevent position flickering of the dialog we set opacity to 0
       root.style.setProperty('opacity', '0');
@@ -7942,6 +7941,32 @@ const comboBoxItem = ({ code, dialCode, name: country }) => `
 	</div>
 `;
 
+const parsePhoneNumber = (val) => {
+  const value = val || '';
+  let countryCode = '';
+  let phoneNumber = '';
+
+  // Attempt to parse the value using libphonenumber-js
+  const parsed = parsePhoneNumberFromString(value);
+
+  if (parsed) {
+    if (parsed.countryCallingCode) {
+      countryCode = `+${parsed.countryCallingCode}`;
+    }
+
+    if (parsed.nationalNumber) {
+      phoneNumber = parsed.nationalNumber;
+    }
+  } else {
+    // Fallback: assume a dash separates country code and phone number
+    const [country, phone] = value.split('-');
+    countryCode = country || '';
+    phoneNumber = phone || '';
+  }
+
+  return [countryCode, phoneNumber];
+};
+
 const componentName$C = getComponentName('phone-field-internal');
 
 const commonAttrs$1 = ['disabled', 'size', 'bordered', 'invalid', 'readonly'];
@@ -8001,9 +8026,7 @@ let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$6 {
   }
 
   set value(val) {
-    const parsed = parsePhone(val || '');
-    const countryCode = parsed?.countryCallingCode ? `+${parsed.countryCallingCode}` : '';
-    const phoneNumber = parsed?.nationalNumber || '';
+    const [countryCode, phoneNumber] = parsePhoneNumber(val);
 
     if (countryCode) {
       const countryCodeItem = this.getCountryByDialCode(countryCode);