@openg2p/registry-widgets 1.1.0-dev.8 → 1.1.0-dev.9

package/dist/index.js

@@ -246,24 +246,27 @@ const getValidationPattern = (validationType) => {
 };
 
 /**
- * Validate value against validation rules
+ * Validate value against validation rules.
+ *
+ * @param skipRequired - When true, required-field checks are skipped (used by
+ *   per-section Save/Next buttons so the user can move between sections without
+ *   filling every mandatory field; only format/range checks still run).
  */
-const validateWidget = (value, validation, required = false) => {
+const validateWidget = (value, validation, required = false, skipRequired = false) => {
     const errors = [];
     if (!validation && !required) {
         return errors;
     }
-    // Check required
-    const isRequired = validation?.required ?? required;
+    // Check required (skipped when navigating between sections)
+    const isRequired = !skipRequired && (validation?.required ?? required);
     // For boolean, false is a valid value, so only check for null/undefined/empty string
     const isEmpty = value === null || value === undefined || value === '';
     if (isRequired && isEmpty) {
         errors.push('This field is required');
         return errors; // Return early if required field is empty
     }
-    // Skip other validations if value is empty and not required
-    // Note: For boolean, false is a valid value, so we only skip if truly empty
-    if (isEmpty && !isRequired) {
+    // Skip format/range validations if value is empty
+    if (isEmpty) {
         return errors;
     }
     if (!validation) {
@@ -3807,7 +3810,15 @@ const collectWidgets = (panels) => {
     });
     return widgets;
 };
-const sectionValidate = (section, currentSchemaData, dispatch) => {
+/**
+ * Validate all widgets in a section and dispatch errors to the store.
+ *
+ * @param skipRequired - When true, required-field checks (widget-required,
+ *   validation.required, document-required) are skipped. Use this for
+ *   per-section Save/Next navigation so the user can advance without filling
+ *   every mandatory field; only format/range errors are reported.
+ */
+const sectionValidate = (section, currentSchemaData, dispatch, skipRequired = false) => {
     const allWidgets = collectWidgets(section.panels);
     let isValid = true;
     for (const widget of allWidgets) {
@@ -3816,7 +3827,7 @@ const sectionValidate = (section, currentSchemaData, dispatch) => {
             continue;
         const widgetId = widget['widget-id'];
         const value = getWidgetValue(currentSchemaData, widget['widget-data-path'], widgetId);
-        const errors = validateWidget(value, widget['widget-data-validation'], widget['widget-required']);
+        const errors = validateWidget(value, widget['widget-data-validation'], widget['widget-required'], skipRequired);
         if (errors.length > 0) {
             isValid = false;
             dispatch(setTouched({ widgetId, touched: true }));
@@ -3827,10 +3838,10 @@ const sectionValidate = (section, currentSchemaData, dispatch) => {
             dispatch(setError({ widgetId, errors: [] }));
         }
     }
-    // Supporting Documents
+    // Supporting Documents — only check required when not skipping required validation
     section['section-supporting-documents']?.forEach((doc, index) => {
         const widgetId = `supporting-doc-${section['section-id']}-${index}`;
-        if (doc['document-required']) {
+        if (!skipRequired && doc['document-required']) {
             const file = getValueByPath(currentSchemaData, doc['document-data-path']);
             if (!file) {
                 isValid = false;
@@ -4465,7 +4476,7 @@ const SectionRenderer = ({ section, dataSourceRequestHandler: propDataSourceRequ
         const sectionWidgets = collectWidgets(originalSection.panels);
         const currentState = store.getState().widget;
         const currentSchemaData = currentState.values || {};
-        const isSectionValid = sectionValidate(originalSection, currentSchemaData, dispatch);
+        const isSectionValid = sectionValidate(originalSection, currentSchemaData, dispatch, true);
         if (!isSectionValid) {
             return;
         }
@@ -4531,7 +4542,7 @@ const SectionRenderer = ({ section, dataSourceRequestHandler: propDataSourceRequ
             const sectionWidgets = collectWidgets(originalSection.panels);
             const currentState = store.getState().widget;
             const currentSchemaData = currentState.values || {};
-            const isSectionValid = sectionValidate(originalSection, currentSchemaData, dispatch);
+            const isSectionValid = sectionValidate(originalSection, currentSchemaData, dispatch, true);
             if (!isSectionValid)
                 return;
             const oldSchemaData = schemaData || contextSchemaData;
@@ -5165,6 +5176,10 @@ const SectionsContainer = ({ sections, dataSourceRequestHandler: propDataSourceR
     // Stable ref for namespace so formHandle useMemo doesn't depend on the (possibly inline) function identity
     const namespaceRef = React.useRef(namespace);
     namespaceRef.current = namespace;
+    // Stable refs so formHandle closure can access current mode and accordion setter without stale captures
+    const modeRef = React.useRef(mode);
+    modeRef.current = mode;
+    const setExpandedSectionIndexRef = React.useRef(setExpandedSectionIndex);
     // Track dirty (unsaved changes) per section for form handle validation
     const sectionDirtyMapRef = React.useRef({});
     const handleSectionDirtyChange = React.useCallback((sectionId, isDirty) => {
@@ -5226,33 +5241,52 @@ const SectionsContainer = ({ sections, dataSourceRequestHandler: propDataSourceR
         };
         return {
             validate: async () => {
-                checkNoUnsavedChanges();
+                if (modeRef.current !== 'IntakeForm')
+                    checkNoUnsavedChanges();
                 const values = getValues();
                 let allValid = true;
+                let firstInvalidIndex = null;
                 for (let i = 0; i < safeSections.length; i++) {
                     const section = safeSections[i];
                     const ns = getNamespace(section, i);
                     const sectionToValidate = ns ? namespaceSectionConfig(section, ns) : section;
                     const valid = sectionValidate(sectionToValidate, values, dispatch);
-                    if (!valid)
+                    if (!valid) {
+                        if (firstInvalidIndex === null)
+                            firstInvalidIndex = i;
                         allValid = false;
+                    }
+                }
+                if (!allValid && modeRef.current === 'IntakeForm' && firstInvalidIndex !== null) {
+                    setExpandedSectionIndexRef.current(firstInvalidIndex);
                 }
                 return allValid;
             },
             getFormData: () => getValues(),
             validateAndGetData: async () => {
-                checkNoUnsavedChanges();
+                if (modeRef.current !== 'IntakeForm')
+                    checkNoUnsavedChanges();
                 const values = getValues();
                 const results = [];
+                let firstInvalidIndex = null;
                 for (let i = 0; i < safeSections.length; i++) {
                     const section = safeSections[i];
                     const ns = getNamespace(section, i);
                     const sectionToValidate = ns ? namespaceSectionConfig(section, ns) : section;
                     const valid = sectionValidate(sectionToValidate, values, dispatch);
                     if (!valid) {
-                        throw new Error('Validation failed');
+                        if (firstInvalidIndex === null)
+                            firstInvalidIndex = i;
                     }
-                    results.push(buildSectionChanges(section, values, ns));
+                    else {
+                        results.push(buildSectionChanges(section, values, ns));
+                    }
+                }
+                if (firstInvalidIndex !== null) {
+                    if (modeRef.current === 'IntakeForm') {
+                        setExpandedSectionIndexRef.current(firstInvalidIndex);
+                    }
+                    throw new Error('Validation failed. Please fix the errors and try again.');
                 }
                 return results;
             },