@descope/web-components-ui 1.0.381 → 1.0.383

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';
@@ -5139,6 +5139,7 @@ const DateFieldClass = compose(
       outlineWidth: { ...overlay },
       outlineColor: { ...overlay },
       outlineStyle: { ...overlay },
+      direction: { ...overlay },
     },
   }),
   draggableMixin,
@@ -7941,6 +7942,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'];
@@ -8000,9 +8027,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);
@@ -17013,7 +17038,6 @@ const calendar = {
   [vars$5.calendarPadding]: '1em',
 
   [vars$5.topNavVerticalPadding]: '1em',
-  [vars$5.topNavHorizontalPadding]: '1em',
   [vars$5.topNavAlignment]: 'space-between',
   [vars$5.topNavGap]: '0',
   [vars$5.topNavSelectorsGap]: '0.5em',
@@ -17036,10 +17060,8 @@ const calendar = {
 
   [vars$5.weekdayFontSize]: '0.875em',
   [vars$5.weekdayFontWeight]: '500',
-  [vars$5.weekdayTextColor]: globalRefs$4.colors.surface.dark,
 
   // day table cell
-  [vars$5.dayWidth]: '2.705em',
   [vars$5.dayHeight]: '3.125em',
 
   // day value
@@ -17103,39 +17125,7 @@ const vars$4 = DateFieldClass.cssVarList;
 
 const dateField = {
   [vars$4.hostWidth]: refs.width,
-  [vars$4.hostMinWidth]: refs.minWidth,
   [vars$4.hostDirection]: refs.direction,
-  [vars$4.fontSize]: refs.fontSize,
-  [vars$4.fontFamily]: refs.fontFamily,
-  [vars$4.labelFontSize]: refs.labelFontSize,
-  [vars$4.labelFontWeight]: refs.labelFontWeight,
-  [vars$4.labelTextColor]: refs.labelTextColor,
-  [vars$4.errorMessageTextColor]: refs.errorMessageTextColor,
-  [vars$4.inputValueTextColor]: refs.valueTextColor,
-  [vars$4.inputPlaceholderColor]: refs.placeholderTextColor,
-  [vars$4.inputBorderWidth]: refs.borderWidth,
-  [vars$4.inputBorderStyle]: refs.borderStyle,
-  [vars$4.inputBorderColor]: refs.borderColor,
-  [vars$4.inputBorderRadius]: refs.borderRadius,
-  [vars$4.inputOutlineWidth]: refs.outlineWidth,
-  [vars$4.inputOutlineStyle]: refs.outlineStyle,
-  [vars$4.inputOutlineColor]: refs.outlineColor,
-  [vars$4.inputOutlineOffset]: refs.outlineOffset,
-  [vars$4.inputBackgroundColor]: refs.backgroundColor,
-  [vars$4.labelRequiredIndicator]: refs.requiredIndicator,
-  [vars$4.inputHorizontalPadding]: refs.horizontalPadding,
-  [vars$4.inputHeight]: refs.inputHeight,
-  [vars$4.labelPosition]: refs.labelPosition,
-  [vars$4.labelTopPosition]: refs.labelTopPosition,
-  [vars$4.labelHorizontalPosition]: refs.labelHorizontalPosition,
-  [vars$4.inputTransformY]: refs.inputTransformY,
-  [vars$4.inputTransition]: refs.inputTransition,
-  [vars$4.marginInlineStart]: refs.marginInlineStart,
-  [vars$4.placeholderOpacity]: refs.placeholderOpacity,
-  [vars$4.inputVerticalAlignment]: refs.inputVerticalAlignment,
-  [vars$4.valueInputHeight]: refs.valueInputHeight,
-  [vars$4.valueInputMarginBottom]: refs.valueInputMarginBottom,
-
   [vars$4.iconMargin]: '0.375em',
 
   [vars$4.overlay.marginTop]: `calc(${refs.outlineWidth} + 1px)`,