@openmrs/esm-form-engine-lib 3.1.3-pre.1754 → 3.1.3-pre.1762

package/__mocks__/forms/rfe-forms/default-values-form.json

@@ -0,0 +1,91 @@
+{
+    "encounterType": "",
+    "name": "Sample Default Values Form",
+    "processor": "EncounterFormProcessor",
+    "referencedForms": [],
+    "uuid": "3620c971-58e5-4e70-83ce-98d0dcf4bb7b",
+    "version": "1.0",
+    "pages": [
+      {
+        "label": "First Page",
+        "sections": [
+          {
+            "label": "A Section",
+            "isExpanded": "true",
+            "questions": [
+              {
+                "id": "sampleQuestion",
+                "label": "Text field with Default Value",
+                "type": "obs",
+                "questionOptions": {
+                  "rendering": "text",
+                  "defaultValue": "Value text",
+                  "concept": "f82ba2b7-3849-4ad0-b867-36881e59f5c8"
+                }
+              }
+            ]
+          },
+          {
+            "label": "Another Section",
+            "isExpanded": "true",
+            "questions": [
+              {
+                "id": "codedQuestion",
+                "label": "Dropdown with Default Value",
+                "type": "obs",
+                "questionOptions": {
+                  "rendering": "select",
+                  "concept": "8cdea80a-d167-431c-8278-246c7a1f913b",
+                  "defaultValue": "6b4e859c-86ca-41e5-b1c4-017889653b59",
+                  "answers": [
+                    {
+                      "concept": "2b4e859c-86ca-41e5-b1c4-017889653b50",
+                      "label": "Choice 1",
+                      "conceptMappings": []
+                    },
+                    {
+                      "concept": "6b4e859c-86ca-41e5-b1c4-017889653b59",
+                      "label": "Choice 2",
+                      "conceptMappings": []
+                    },
+                    {
+                      "concept": "5b4e859c-c6ca-41e5-b1c4-017889653b5k",
+                      "label": "Choice 3",
+                      "conceptMappings": []
+                    }
+                  ]
+                }
+              },
+              {
+                "id": "codedQuestionWithInvalidDefaultValue",
+                "label": "Dropdown with an invalid Default Value",
+                "type": "obs",
+                "questionOptions": {
+                  "rendering": "select",
+                  "concept": "8cdea80a-d167-431c-8278-246c7a1f913b",
+                  "defaultValue": "invalid-value",
+                  "answers": [
+                    {
+                      "concept": "2b4e859c-86ca-41e5-b1c4-017889653b50",
+                      "label": "Choice 1",
+                      "conceptMappings": []
+                    },
+                    {
+                      "concept": "6b4e859c-86ca-41e5-b1c4-017889653b59",
+                      "label": "Choice 2",
+                      "conceptMappings": []
+                    },
+                    {
+                      "concept": "5b4e859c-c6ca-41e5-b1c4-017889653b5k",
+                      "label": "Choice 3",
+                      "conceptMappings": []
+                    }
+                  ]
+                }
+              }
+            ]
+          }
+        ]
+      }
+    ]
+  }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-form-engine-lib",
-  "version": "3.1.3-pre.1754",
+  "version": "3.1.3-pre.1762",
   "description": "React Form Engine for O3",
   "browser": "dist/openmrs-esm-form-engine-lib.js",
   "main": "src/index.ts",

package/src/components/inputs/number/number.component.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo, useState } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { Layer, NumberInput } from '@carbon/react';
 import classNames from 'classnames';
 import { isTrue } from '../../../utils/boolean-utils';
@@ -13,7 +13,6 @@ import { isEmpty } from '../../../validators/form-validator';
 
 const NumberField: React.FC<FormFieldInputProps> = ({ field, value, errors, warnings, setFieldValue }) => {
   const { t } = useTranslation();
-  const [lastBlurredValue, setLastBlurredValue] = useState(value);
   const { layoutType, sessionMode, workspaceLayout } = useFormProviderContext();
 
   const numberValue = useMemo(() => {
@@ -23,16 +22,9 @@ const NumberField: React.FC<FormFieldInputProps> = ({ field, value, errors, warn
     return value ?? '';
   }, [value]);
 
-  const onBlur = (event) => {
-    event.preventDefault();
-    if (lastBlurredValue != value) {
-      setLastBlurredValue(value);
-    }
-  };
-
   const handleChange = useCallback(
-    (event) => {
-      const parsedValue = isEmpty(event.target.value) ? undefined : Number(event.target.value);
+    (event, { value }) => {
+      const parsedValue = isEmpty(value) ? undefined : Number(value);
       setFieldValue(isNaN(parsedValue) ? undefined : parsedValue);
     },
     [setFieldValue],
@@ -67,11 +59,9 @@ const NumberField: React.FC<FormFieldInputProps> = ({ field, value, errors, warn
           name={field.id}
           value={numberValue}
           onChange={handleChange}
-          onBlur={onBlur}
           allowEmpty={true}
           size="lg"
           hideSteppers={field.hideSteppers ?? false}
-          onWheel={(e) => e.target.blur()}
           disabled={field.isDisabled}
           readOnly={isTrue(field.readonly)}
           className={classNames(styles.controlWidthConstrained, styles.boldedLabel)}

package/src/form-engine.test.tsx

@@ -46,6 +46,7 @@ import readOnlyValidationForm from '__mocks__/forms/rfe-forms/read-only-validati
 import jsExpressionValidationForm from '__mocks__/forms/rfe-forms/js-expression-validation-form.json';
 import hidePagesAndSectionsForm from '__mocks__/forms/rfe-forms/hide-pages-and-sections-form.json';
 import diagnosisForm from '__mocks__/forms/rfe-forms/diagnosis-test-form.json';
+import defaultValuesForm from '__mocks__/forms/rfe-forms/default-values-form.json';
 
 import FormEngine from './form-engine.component';
 import { type FormSchema, type OpenmrsEncounter, type SessionMode } from './types';
@@ -358,7 +359,7 @@ describe('Form engine component', () => {
       await act(async () => {
         renderForm(null, requiredTestForm);
       });
-      
+
       await user.click(screen.getByRole('button', { name: /save/i }));
 
       const labels = screen.getAllByText(/Text question/i);
@@ -457,7 +458,9 @@ describe('Form engine component', () => {
       expect(selectErrorMessage).toBeInTheDocument();
 
       // Validate multi-select field
-      const multiSelectInputField = screen.getByText('If Unscheduled, actual scheduled reason multi-select', { exact: true });
+      const multiSelectInputField = screen.getByText('If Unscheduled, actual scheduled reason multi-select', {
+        exact: true,
+      });
       expect(multiSelectInputField).toBeInTheDocument();
       const multiSelectErrorMessage = screen.getByText(
         'Patient visit marked as unscheduled. Please provide the scheduled multi-select reason.',
@@ -699,6 +702,44 @@ describe('Form engine component', () => {
     });
   });
 
+  describe('Default values', () => {
+    it('should initialize fields with default values', async () => {
+      const saveEncounterMock = jest.spyOn(api, 'saveEncounter');
+
+      await act(async () => renderForm(null, defaultValuesForm));
+
+      // text field
+      const textField = await findTextOrDateInput(screen, 'Text field with Default Value');
+      expect(textField).toHaveValue('Value text');
+
+      // dropdown field
+      const dropdownField = await findSelectInput(screen, 'Dropdown with Default Value');
+      expect(dropdownField.title).toBe('Choice 2');
+
+      // dropdown with an invalid default value
+      const invalidDropdownField = await findSelectInput(screen, 'Dropdown with an invalid Default Value');
+      expect(invalidDropdownField.title).toBe('Choose an option');
+
+      await user.click(screen.getByRole('button', { name: /save/i }));
+
+      const encounter = saveEncounterMock.mock.calls[0][1];
+      expect(encounter.obs).toEqual([
+        {
+          value: 'Value text',
+          concept: 'f82ba2b7-3849-4ad0-b867-36881e59f5c8',
+          formFieldNamespace: 'rfe-forms',
+          formFieldPath: 'rfe-forms-sampleQuestion',
+        },
+        {
+          value: '6b4e859c-86ca-41e5-b1c4-017889653b59',
+          concept: '8cdea80a-d167-431c-8278-246c7a1f913b',
+          formFieldNamespace: 'rfe-forms',
+          formFieldPath: 'rfe-forms-codedQuestion',
+        },
+      ]);
+    });
+  });
+
   describe('Calculated values', () => {
     it('should evaluate BMI', async () => {
       const saveEncounterMock = jest.spyOn(api, 'saveEncounter');

package/src/processors/encounter/encounter-form-processor.ts

@@ -285,6 +285,9 @@ export class EncounterFormProcessor extends FormProcessor {
               console.error(error);
             }
           }
+          if (field.questionOptions.defaultValue) {
+            initialValues[field.id] = inferInitialValueFromDefaultFieldValue(field);
+          }
           if (field.questionOptions.calculate?.calculateExpression) {
             fieldsWithCalculateExpressions.push(field);
           }

package/src/processors/encounter/encounter-processor-helper.ts

@@ -280,10 +280,17 @@ export function inferInitialValueFromDefaultFieldValue(field: FormField) {
   if (field.questionOptions.rendering == 'toggle' && typeof field.questionOptions.defaultValue != 'boolean') {
     return field.questionOptions.defaultValue == ConceptTrue;
   }
+
   // validate default value
-  if (!DefaultValueValidator.validate(field, field.questionOptions.defaultValue).length) {
-    return field.questionOptions.defaultValue;
+  const errors = DefaultValueValidator.validate(field, field.questionOptions.defaultValue);
+  if (errors.length) {
+    console.error(
+      `Default value validation errors for field "${field.id}" with value "${field.questionOptions.defaultValue}":`,
+      errors,
+    );
+    return null;
   }
+  return field.questionOptions.defaultValue;
 }
 
 export async function hydrateRepeatField(