@ornikar/kitt-universal 9.40.0 → 9.41.0

package/dist/index-browser-all.es.web.js

@@ -19,6 +19,7 @@ import { styled as styled$1 } from '@linaria/react';
 import { Portal } from 'react-portal';
 import { CSSTransition } from 'react-transition-group';
 import { parse } from 'twemoji-parser';
+import { parseNumber, getCountryCallingCode, isValidNumber } from 'libphonenumber-js';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useFloating, autoUpdate, offset, autoPlacement, shift, arrow } from '@floating-ui/react-dom';
 import { useOnClickOutside } from 'usehooks-ts';
@@ -3399,18 +3400,18 @@ function getReturnKeyTypeForNumericInput(returnKeyType) {
   return returnKeyType;
 }
 
-function prefixWithZero(value) {
+function prefixWithZero$1(value) {
   var maxLength = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
   return "".concat(value).padStart(maxLength, '0');
 }
 function dayFormatter(day) {
-  return prefixWithZero(day);
+  return prefixWithZero$1(day);
 }
 function monthFormatter(month) {
-  return prefixWithZero(month);
+  return prefixWithZero$1(month);
 }
 function yearFormatter(year) {
-  return prefixWithZero(year, 4);
+  return prefixWithZero$1(year, 4);
 }
 
 function getDayInInterval(value) {
@@ -4014,20 +4015,63 @@ var InputPassword = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }));
 });
 
-var _excluded$f = ["returnKeyType", "autoComplete"];
+var _excluded$f = ["returnKeyType", "autoComplete", "phoneNumberLength", "value", "onChange"];
+function isPhoneNumberValid(number) {
+  return isValidNumber(number);
+}
+function prefixWithZero(value, phoneNumberLength) {
+  return value.padStart(phoneNumberLength, '0');
+}
 var InputPhone = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var returnKeyType = _ref.returnKeyType,
     _ref$autoComplete = _ref.autoComplete,
     autoComplete = _ref$autoComplete === void 0 ? 'tel' : _ref$autoComplete,
+    _ref$phoneNumberLengt = _ref.phoneNumberLength,
+    phoneNumberLength = _ref$phoneNumberLengt === void 0 ? 10 : _ref$phoneNumberLengt,
+    value = _ref.value,
+    onChange = _ref.onChange,
     props = _objectWithoutProperties(_ref, _excluded$f);
+  var _useState = useState(value),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentValue = _useState2[0],
+    setCurrentValue = _useState2[1];
   var currentReturnKeyType = returnKeyType ? getReturnKeyTypeForNumericInput(returnKeyType) : undefined;
   return /*#__PURE__*/jsx(InputText, _objectSpread(_objectSpread({
     ref: ref
   }, props), {}, {
+    value: currentValue,
     keyboardType: "phone-pad",
     returnKeyType: currentReturnKeyType,
     autoComplete: autoComplete,
-    textContentType: "telephoneNumber"
+    textContentType: "telephoneNumber",
+    onChange: function handleChange(event) {
+      var number = parseNumber(event.nativeEvent.text);
+
+      // When intl phone number is valid :
+      // 1 - We extract intl data
+      // 2 - We recreate the local value to display
+      if (isPhoneNumberValid(number)) {
+        var phone = number.phone;
+        var finalPhoneNumber = prefixWithZero("".concat(phone || ''), phoneNumberLength);
+        var eventWithoutCountryCode = _objectSpread(_objectSpread({}, event), {}, {
+          nativeEvent: _objectSpread(_objectSpread({}, event.nativeEvent), {}, {
+            text: finalPhoneNumber
+          })
+        });
+        setCurrentValue(finalPhoneNumber);
+        if (onChange) {
+          onChange(eventWithoutCountryCode, _objectSpread(_objectSpread({}, number), {}, {
+            countryCode: getCountryCallingCode(number.country),
+            originalNativeEventText: event.nativeEvent.text
+          }));
+        }
+        return;
+      }
+
+      // Value is correctly parsed but might not pass validation
+      setCurrentValue(event.nativeEvent.text);
+      if (onChange) onChange(event);
+    }
   }));
 });