@abgov/jsonforms-components 1.42.7 → 1.42.9

package/index.esm.js

@@ -5597,6 +5597,7 @@ const FormStepper = props => {
   const componentProps = (_b = (_a = uischema.options) === null || _a === void 0 ? void 0 : _a.componentProps) !== null && _b !== void 0 ? _b : {};
   const optionProps = uischema.options || {};
   const [step, setStep] = React.useState(0);
+  const [staleCategories, setStaleCategories] = React.useState(categorization.elements);
   const [isFormValid, setIsFormValid] = React.useState(false);
   const [showNextBtn, setShowNextBtn] = React.useState(true);
   const [isOpen, setIsOpen] = React.useState(false);
@@ -5639,6 +5640,9 @@ const FormStepper = props => {
     setStep((componentProps === null || componentProps === void 0 ? void 0 : componentProps.controlledNav) ? 1 : 0);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  useEffect(() => {
+    setStaleCategories(categories);
+  }, [categories]);
   /* istanbul ignore next */
   if ((categories === null || categories === void 0 ? void 0 : categories.length) < 1) {
     // eslint-disable-next-line
@@ -5700,7 +5704,7 @@ const FormStepper = props => {
       children: jsxs("div", {
         id: `${path || `goa`}-form-stepper`,
         className: "formStepper",
-        children: [jsxs(GoAFormStepper, {
+        children: [categories.length === staleCategories.length && jsxs(GoAFormStepper, {
           testId: ((_e = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _e === void 0 ? void 0 : _e.testId) || 'form-stepper-test',
           step: step,
           onChange: step => {
@@ -7600,12 +7604,12 @@ const AddressInputs = ({
           readonly: readOnly,
           value: (address === null || address === void 0 ? void 0 : address.municipality) || '',
           onChange: (name, value) => handleInputChange(name, value),
-          onBlur: (name, value) => handleOnBlur(name),
+          onBlur: name => handleOnBlur(name),
           width: "100%"
         })
       }), jsx(GoAFormItem, {
-        label: "Postal Code",
-        error: (_b = errors === null || errors === void 0 ? void 0 : errors['postalCode']) !== null && _b !== void 0 ? _b : '',
+        label: "Postal code",
+        error: (_b = errors === null || errors === void 0 ? void 0 : errors.postalCode) !== null && _b !== void 0 ? _b : '',
         requirement: (requiredFields === null || requiredFields === void 0 ? void 0 : requiredFields.includes('postalCode')) ? 'required' : 'optional',
         children: jsx(GoAInput, {
           name: "postalCode",
@@ -7616,7 +7620,7 @@ const AddressInputs = ({
           placeholder: "A0A 0A0",
           value: (address === null || address === void 0 ? void 0 : address.postalCode) || '',
           onChange: (name, value) => handleInputChange(name, value),
-          onBlur: (name, value) => handleOnBlur(name),
+          onBlur: name => handleOnBlur(name),
           width: "100%",
           maxLength: 7
         })
@@ -7745,6 +7749,8 @@ const handlePostalCodeValidation = (validatePc, message, value, errors) => {
   const newErrors = Object.assign({}, errors);
   if (!validatePc && value.length >= 4) {
     newErrors['postalCode'] = message;
+  } else if (value.length === 0) {
+    newErrors['postalCode'] = 'Postal Code is required.';
   } else {
     delete newErrors['postalCode'];
   }
@@ -8006,7 +8012,7 @@ const AddressLookUpControl = props => {
   };
   useEffect(() => {
     const fetchSuggestions = () => __awaiter(void 0, void 0, void 0, function* () {
-      if (searchTerm.length > 2 && searchTerm.charAt(searchTerm.length - 1) !== ' ') {
+      if (searchTerm.length > 2) {
         setLoading(true);
         setOpen(true);
         yield fetchAddressSuggestions(formUrl, searchTerm, isAlbertaAddress).then(response => {
@@ -8024,7 +8030,7 @@ const AddressLookUpControl = props => {
       }
     });
     fetchSuggestions();
-  }, [searchTerm, formUrl, isAlbertaAddress]);
+  }, [searchTerm]);
   const handleDropdownChange = value => {
     setSearchTerm(value);
     handleInputChange('addressLine1', value);
@@ -8039,47 +8045,26 @@ const AddressLookUpControl = props => {
   /* istanbul ignore next */
   const handleRequiredFieldBlur = name => {
     const err = Object.assign({}, errors);
-    if ((data === null || data === void 0 ? void 0 : data['city']) === undefined || (data === null || data === void 0 ? void 0 : data['city']) === '') {
-      err[name] = name === 'municipality' ? 'city is required' : '';
-      setErrors(err);
-    }
     if (!(data === null || data === void 0 ? void 0 : data[name]) || data[name] === '' || (data === null || data === void 0 ? void 0 : data[name]) === undefined) {
       err[name] = name === 'municipality' ? 'city is required' : `${name} is required`;
       setErrors(err);
-    }
-    if (!(data === null || data === void 0 ? void 0 : data[name])) {
-      err[name] = name === 'addressLine1' ? `${name} is required` : ``;
-      setErrors(err);
     } else {
       delete errors[name];
     }
-    setTimeout(() => {
-      setSuggestions([]);
-      setOpen(false);
-    }, 100);
+    setSuggestions([]);
+    setOpen(false);
   };
-  useEffect(() => {
-    if (dropdownRef.current) {
-      const selectedItem = dropdownRef.current.children[selectedIndex];
-      if (selectedItem) {
-        selectedItem.scrollIntoView({
-          block: 'nearest',
-          behavior: 'smooth'
-        });
-      }
-    }
-  }, [selectedIndex, open]);
   /* istanbul ignore next */
   const handleKeyDown = (e, value, key) => {
     var _a;
     if (key === 'ArrowDown') {
       setSelectedIndex(prevIndex => prevIndex < suggestions.length - 1 ? prevIndex + 1 : 0);
-      handleDropdownChange(value);
+      handleInputChange('addressLine1', value);
     } else if (key === 'ArrowUp') {
       setSelectedIndex(prevIndex => prevIndex > 0 ? prevIndex - 1 : suggestions.length - 1);
-      handleDropdownChange(value);
-    } else if (key === 'Enter' || key === ' ' && value.length > 2) {
-      handleDropdownChange(value);
+      handleInputChange('addressLine1', value);
+    } else if (key === 'Enter') {
+      handleInputChange('addressLine1', value);
       setLoading(false);
       if (selectedIndex >= 0) {
         (_a = document.getElementById('goaInput')) === null || _a === void 0 ? void 0 : _a.blur();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.42.7",
+  "version": "1.42.9",
   "license": "Apache-2.0",
   "description": "Government of Alberta - React renderers for JSON Forms based on the design system.",
   "repository": "https://github.com/GovAlta/adsp-monorepo",