@abgov/jsonforms-components 1.38.0 → 1.38.1

package/index.esm.js

@@ -8141,6 +8141,18 @@ const NameInputs = ({
 }) => {
   var _a, _b;
   const [errors, setErrors] = useState({});
+  /* istanbul ignore next */
+  // eslint-disable-next-line
+  const handleRequiredFieldBlur = (name, updatedData) => {
+    const err = Object.assign({}, errors);
+    if ((!(data === null || data === void 0 ? void 0 : data[name]) || (data === null || data === void 0 ? void 0 : data[name]) === '') && requiredFields.includes(name) && (!updatedData || (updatedData === null || updatedData === void 0 ? void 0 : updatedData[name]) === '')) {
+      const modifiedName = name === 'firstName' ? 'First name' : name === 'lastName' ? 'Last name' : '';
+      err[name] = `${modifiedName} is required`;
+    } else {
+      err[name] = '';
+    }
+    setErrors(err);
+  };
   return jsxs(GoAGrid, {
     minChildWidth: "0ch",
     gap: "s",
@@ -8157,6 +8169,10 @@ const NameInputs = ({
         ariaLabel: 'name-form-first-name',
         value: firstName || '',
         onChange: (name, value) => handleInputChange(name, value),
+        onBlur: name => {
+          /* istanbul ignore next */
+          handleRequiredFieldBlur(name);
+        },
         width: "100%"
       })
     }), jsx(GoAFormItem, {
@@ -8184,6 +8200,10 @@ const NameInputs = ({
         ariaLabel: 'name-form-last-name',
         value: lastName || '',
         onChange: (name, value) => handleInputChange(name, value),
+        onBlur: name => {
+          /* istanbul ignore next */
+          handleRequiredFieldBlur(name);
+        },
         width: "100%"
       })
     })]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.38.0",
+  "version": "1.38.1",
   "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",

package/src/lib/Controls/FullName/FullNameInputs.d.ts

@@ -1,15 +1,10 @@
 import React from 'react';
-interface Data {
-    firstName: string;
-    middleName: string;
-    lastName: string;
-}
 interface NameInputsProps {
     firstName: string;
     middleName?: string;
     lastName: string;
     isStepperReview?: boolean;
-    data: Data;
+    data: any;
     requiredFields: string[];
     handleInputChange: (field: string, value: string) => void;
 }