@abgov/jsonforms-components 2.71.0 → 2.71.2

package/index.esm.js

@@ -7767,10 +7767,14 @@ const stepperReducer = (state, action) => {
         // (page/next, page/prev, or setVisited previously marked it visited).
         // Preserve any previously-tracked isVisited=true so navigation history
         // isn't lost whenever unrelated form data changes trigger this recompute.
+        // isNavigatedAway is tracked here and never recomputed, so the merge is the only thing
+        // carrying it across a recompute. Seeding it from the recomputed state instead would let
+        // data presence mark a step navigated, which is the whole thing it exists to avoid.
         const mergedCategories = newState.categories.map(newCategory => {
           const previousCategory = categories.find(c => c.id === newCategory.id);
           return Object.assign({}, newCategory, {
-            isVisited: (previousCategory == null ? void 0 : previousCategory.isVisited) || newCategory.isVisited
+            isVisited: (previousCategory == null ? void 0 : previousCategory.isVisited) || newCategory.isVisited,
+            isNavigatedAway: (previousCategory == null ? void 0 : previousCategory.isNavigatedAway) === true
           });
         });
         return Object.assign({}, newState, {
@@ -7781,7 +7785,8 @@ const stepperReducer = (state, action) => {
       {
         const newActive = activeId + 1;
         const newCategories = categories.map((c, idx) => idx === activeId ? Object.assign({}, c, {
-          isVisited: true
+          isVisited: true,
+          isNavigatedAway: true
         }) : c);
         const isOnReview = newActive === lastId + 1;
         return Object.assign({}, state, {
@@ -7797,7 +7802,8 @@ const stepperReducer = (state, action) => {
       {
         const newActive = Math.max(0, activeId - 1);
         const newCategories = categories.map((c, idx) => idx === activeId ? Object.assign({}, c, {
-          isVisited: true
+          isVisited: true,
+          isNavigatedAway: true
         }) : c);
         return Object.assign({}, state, {
           activeId: newActive,
@@ -7868,7 +7874,8 @@ const stepperReducer = (state, action) => {
           id
         } = action.payload;
         const newCategories = state.categories.map(cat => cat.id === id ? Object.assign({}, cat, {
-          isVisited: true
+          isVisited: true,
+          isNavigatedAway: true
         }) : cat);
         return Object.assign({}, state, {
           categories: newCategories
@@ -8546,6 +8553,10 @@ const createStepperContextInitData = (props, options) => {
       isCompleted: status === StepStatus.COMPLETED || visited && !hasRequiredFields,
       isValid: status === StepStatus.COMPLETED || visited && !hasRequiredFields,
       isVisited: [StepStatus.COMPLETED, StepStatus.IN_PROGRESS].includes(status),
+      // Navigation is tracked by the reducer, which merges this value forward on every recompute.
+      // It starts false so a freshly opened form shows no validation messages until the user has
+      // actually worked through a step; deriving it here from data would defeat the point.
+      isNavigatedAway: false,
       status,
       uischema: c,
       isEnabled: isEnabled(c, data, '', ajv, undefined),
@@ -8895,7 +8906,7 @@ const GoAInputBaseControl = props => {
         id: isStepperReview === true ? `review-base-${path}-element-wrapper` : `${path}-element-wrapper`,
         children: jsx(GoabFormItem, {
           requirement: (_uischema$options$com = uischema == null || (_uischema$options = uischema.options) == null || (_uischema$options = _uischema$options.componentProps) == null ? void 0 : _uischema$options.requirement) != null ? _uischema$options$com : requiredNow ? 'required' : undefined,
-          error: (currentCategory == null ? void 0 : currentCategory.isVisited) === true || isVisited || hasValue ? modifiedErrors : undefined,
+          error: (currentCategory == null ? void 0 : currentCategory.isNavigatedAway) === true || isVisited || hasValue ? modifiedErrors : undefined,
           testId: isStepperReview === true ? `review-base-${path}` : path,
           label: getFormItemLabel(labelToUpdate, props == null ? void 0 : props.noLabel),
           helpText: typeof (uischema == null || (_uischema$options2 = uischema.options) == null ? void 0 : _uischema$options2.help) === 'string' && !isStepperReview ? uischema == null || (_uischema$options3 = uischema.options) == null ? void 0 : _uischema$options3.help : '',
@@ -10017,7 +10028,9 @@ const EnumSelect = props => {
     options,
     uischema,
     schema,
-    errors
+    errors,
+    isVisited,
+    setIsVisited
   } = props;
   const registerCtx = useContext(JsonFormsRegisterContext);
   const registerConfig = fetchRegisterConfigFromOptions((_props$uischema = props.uischema) == null || (_props$uischema = _props$uischema.options) == null ? void 0 : _props$uischema.register);
@@ -10075,6 +10088,12 @@ const EnumSelect = props => {
       id: `jsonforms-${path}-dropdown`,
       filterable: autoCompletion,
       onChange: detail => {
+        // goa-dropdown exposes no blur event, so a selection is the only interaction available
+        // to mark visited on. This is what surfaces the error when the user picks the empty
+        // placeholder on a required control, which leaves no value to fall back on.
+        if (isVisited === false && setIsVisited) {
+          setIsVisited();
+        }
         if (expectsObjectValue(schema)) {
           handleChange(path, registerData.find(o => {
             return ___default.get(o, valuePath) === detail.value;
@@ -10121,6 +10140,7 @@ const RadioGroup = props => {
     config,
     label,
     isVisited,
+    setIsVisited,
     errors
   } = props;
   const oneOF = (schema == null ? void 0 : schema.oneOf) || [];
@@ -10146,7 +10166,15 @@ const RadioGroup = props => {
     value: data,
     disabled: !enabled
   }, appliedUiSchemaOptions, {
-    onChange: detail => handleChange(path, detail.value)
+    onChange: detail => {
+      // goa-radio-group exposes no blur event, so selecting an option is the only interaction we
+      // can mark visited on. Without this the group never reports its own error state, and on a
+      // non stepper form a required control the user cleared would stay silent.
+      if (isVisited === false && setIsVisited) {
+        setIsVisited();
+      }
+      handleChange(path, detail.value);
+    }
   }, uischema == null || (_uischema$options = uischema.options) == null ? void 0 : _uischema$options.componentProps, {
     children: items.map((item, index) => jsx(GoabRadioItem$1, {
       name: item.value,
@@ -13974,7 +14002,7 @@ const ObjectArrayControl = props => {
     children: [jsxs(ToolBarHeader, {
       children: [listTitle && jsxs(ObjectArrayTitle, {
         children: [listTitle, jsx("span", {
-          children: additionalProps.required && '(required)'
+          children: additionalProps.required && ' (required)'
         }), maxItemsError && jsx("span", {
           style: {
             color: 'red',
@@ -15471,8 +15499,6 @@ const FormStepper = props => {
   /**
    * StepperCtx can only be provided once to prevent issues from categorization in categorization
    *  */
-  // eslint-disable-next-line
-  useEffect(() => {}, [formStepperCtx == null ? void 0 : formStepperCtx.isProvided]);
   if ((formStepperCtx == null ? void 0 : formStepperCtx.isProvided) === true) {
     return jsx(FormStepperView, Object.assign({}, props));
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "2.71.0",
+  "version": "2.71.2",
   "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/renderer-catalog.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-08-04T16:45:42.802Z",
-  "sourceCommit": "a30b2d185c20480fc9d22daa6bcd39656cb4085e",
+  "generatedAt": "2026-08-07T20:45:56.062Z",
+  "sourceCommit": "16828a89e8e29ca9a52c4eaa9a2389f7b6e7246e",
   "sourcePath": "libs/jsonforms-components/src/index.ts",
   "rendererCount": 33,
   "renderers": [

package/src/lib/Controls/FormStepper/context/types.d.ts

@@ -3,6 +3,7 @@ import { StepStatusType } from '../../../common/Constants';
 export interface CategoryInternalState {
     isCompleted?: boolean;
     isVisited?: boolean;
+    isNavigatedAway?: boolean;
     isValid?: boolean;
     showReviewPageLink?: boolean;
     id: number;