@awell-health/ui-library 0.1.112 → 0.1.113

package/dist/index.css

@@ -6696,6 +6696,7 @@ html {
   width: 100%;
   z-index: 1001;
   transition: opacity 0.3s ease-in-out;
+  background-color: white;
 }
 @media (min-width: 640px) {
   .awell__hostedPageFooter_footer .awell__hostedPageFooter_scrollHint {

package/dist/index.js

@@ -34850,8 +34850,22 @@ Check the top-level render call using <` + t + ">.");
       React.useEffect(function () {
         if (isOpen) {
           var container = document.getElementById('ahp_main_content_with_scroll_hint');
-          if (container) {
-            container.scrollTo({ top: container.scrollHeight, behavior: 'smooth' });
+          if (container && selectWrapperRef.current) {
+            var dropdownElement = selectWrapperRef.current.querySelector(".".concat(classes$h.dropdown_open));
+            if (dropdownElement) {
+              var containerRect = container.getBoundingClientRect();
+              var dropdownRect = dropdownElement.getBoundingClientRect();
+              var selectRect = selectWrapperRef.current.getBoundingClientRect();
+              var dropdownBottom = selectRect.bottom + dropdownRect.height;
+              var containerBottom = containerRect.bottom;
+              if (dropdownBottom > containerBottom) {
+                var scrollAmount = dropdownBottom - containerBottom + 20;
+                container.scrollTo({
+                  top: container.scrollTop + scrollAmount,
+                  behavior: 'smooth' });
+
+              }
+            }
           }
         }
       }, [isOpen]);
@@ -37337,18 +37351,27 @@ Check the top-level render call using <` + t + ">.");
 
     var PhoneInputField = function (_a) {
       var onChange = _a.onChange,id = _a.id,label = _a.label,mandatory = _a.mandatory,value = _a.value,placeholder = _a.placeholder,_b = _a.initialCountry,initialCountry = _b === void 0 ? 'us' : _b,availableCountries = _a.availableCountries,_c = _a.forceDialCode,forceDialCode = _c === void 0 ? false : _c,props = __rest(_a, ["onChange", "id", "label", "mandatory", "value", "placeholder", "initialCountry", "availableCountries", "forceDialCode"]);
+      var _d = React.useState(false),touched = _d[0],setTouched = _d[1];
       var countries = getDefaultCountries(availableCountries, initialCountry);
-      var _d = build.exports.usePhoneInput({
+      var _e = build.exports.usePhoneInput({
         initialCountry: initialCountry,
         value: value,
         hideSpaceAfterDialCode: true,
         countries: countries,
         forceDialCode: forceDialCode,
         onPhoneUpdate: function (phone) {
-          onChange({ target: { value: phone } });
+          if (touched && phone.length > 3) {
+            onChange({ target: { value: phone } });
+          } else
+          {
+            onChange({ target: { value: undefined } });
+          }
         } }),
-      phone = _d.phone,handlePhoneValueChange = _d.handlePhoneValueChange,inputRef = _d.inputRef,country = _d.country,setCountry = _d.setCountry;
+      phone = _e.phone,handlePhoneValueChange = _e.handlePhoneValueChange,inputRef = _e.inputRef,country = _e.country,setCountry = _e.setCountry;
       var handleInputChange = function (e) {
+        if (!touched) {
+          setTouched(true);
+        }
         handlePhoneValueChange(e);
       };
       var handleCountrySelect = function (_a) {
@@ -48352,14 +48375,14 @@ var     Kr=[{
           var availableCountries_1 = ((_h = (_g = config === null || config === void 0 ? void 0 : config.phone) === null || _g === void 0 ? void 0 : _g.available_countries) !== null && _h !== void 0 ? _h : []).
           map(function (c) {return c === null || c === void 0 ? void 0 : c.toLocaleLowerCase();}).
           filter(function (x) {return !lodash.exports.isNil(x);});
-          var initialCountry_1 = (_l = (_k = (_j = config === null || config === void 0 ? void 0 : config.phone) === null || _j === void 0 ? void 0 : _j.default_country) === null || _k === void 0 ? void 0 : _k.toLocaleLowerCase()) !== null && _l !== void 0 ? _l : 'gb';
+          var initialCountry_1 = (_l = (_k = (_j = config === null || config === void 0 ? void 0 : config.phone) === null || _j === void 0 ? void 0 : _j.default_country) === null || _k === void 0 ? void 0 : _k.toLocaleLowerCase()) !== null && _l !== void 0 ? _l : 'us';
           return jsxRuntime.exports.jsx(Controller, { name: question.id, control: control, defaultValue: "", render: function (_a) {
               var _b;
               var _c = _a.field,onChange = _c.onChange,value = _c.value;
               return jsxRuntime.exports.jsx(PhoneInputField, { autoFocus: inputAutoFocus, onChange: function (e) {
                   onChange(e.target.value);
                   onAnswerChange();
-                }, label: question.title, id: question.id, value: value, mandatory: (_b = question.questionConfig) === null || _b === void 0 ? void 0 : _b.mandatory, availableCountries: availableCountries_1, initialCountry: initialCountry_1, forceDialCode: true });
+                }, label: question.title, id: question.id, value: value !== null && value !== void 0 ? value : '', mandatory: (_b = question.questionConfig) === null || _b === void 0 ? void 0 : _b.mandatory, availableCountries: availableCountries_1, initialCountry: initialCountry_1, forceDialCode: true });
             } });
         case exports.UserQuestionType.Slider:
           return jsxRuntime.exports.jsx(Controller, { name: question.id, control: control, rules: {

package/dist/types/atoms/phoneInputField/PhoneInputField.d.ts

@@ -4,9 +4,9 @@ import { CountryIso2 } from 'react-international-phone';
 export interface PhoneInputFieldProps extends InputHTMLAttributes<HTMLInputElement> {
     label: string;
     id: string;
-    onChange: ({ target: { value } }: {
+    onChange: ({ target: { value }, }: {
         target: {
-            value: string;
+            value: string | undefined;
         };
     }) => void;
     onClick?: MouseEventHandler<HTMLInputElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@awell-health/ui-library",
-  "version": "0.1.112",
+  "version": "0.1.113",
   "description": "UI components to integrate with Awell Health",
   "repository": {
     "type": "git",