@abgov/jsonforms-components 2.67.8 → 2.67.10

package/index.esm.js

@@ -4312,7 +4312,7 @@ styled.div(_t$c || (_t$c = _$b`
 const Visible = styled.div(_t2$6 || (_t2$6 = _$b`
   display: ${0};
   width: 100%;
-`), p => p.visible ? 'block' : 'none');
+`), p => p.$visible !== false ? 'block' : 'none');
 
 var uncurryThis$i = functionUncurryThis;
 
@@ -7129,14 +7129,14 @@ const GoAInputBaseControl = props => {
   return jsx(JsonFormRegisterProvider, {
     defaultRegisters: undefined,
     children: jsx(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: jsx(FormFieldWrapper$1, {
         ref: controlRef,
         className: "jsonforms-elements-wrapper",
         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 || hasValue ? modifiedErrors : undefined,
+          error: (currentCategory == null ? void 0 : currentCategory.isVisited) === true || isVisited || hasValue ? modifiedErrors : undefined,
           testId: isStepperReview === true ? `review-base-${path}` : path,
           label: (props == null ? void 0 : props.noLabel) === true ? '' : labelToUpdate,
           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 : '',
@@ -7584,6 +7584,13 @@ const MultiLineText = props => {
         setIsVisited();
       }
     },
+    onBlur: detail => {
+      const newValue = autoCapitalize ? detail.value.toUpperCase() : detail.value;
+      setTextAreaValue(newValue);
+      if (isVisited === false && setIsVisited) {
+        setIsVisited();
+      }
+    },
     onChange: detail => {}
   }, uischema == null || (_uischema$options5 = uischema.options) == null ? void 0 : _uischema$options5.componentProps));
   return txtAreaComponent;
@@ -8179,7 +8186,7 @@ const GoACalloutController = props => {
   }
   const calloutProps = (uischema == null || (_uischema$options = uischema.options) == null ? void 0 : _uischema$options.componentProps) || {};
   return jsx(Visible, {
-    visible: showCallout,
+    "$visible": showCallout,
     children: callout(calloutProps)
   });
 };
@@ -10216,7 +10223,7 @@ class ListWithDetailControl extends React.Component {
     this.state.currentListPage === 0 && data === 0;
     const editMode = this.state.currentListPage !== 0 && !withLeftTab;
     return jsxs(Visible, {
-      visible: visible,
+      "$visible": visible,
       "data-testid": "jsonforms-object-list-wrapper",
       children: [jsxs(ToolBarHeader, {
         children: [listTitle && jsx(MarginTop, {
@@ -10713,7 +10720,7 @@ const GoAEmailInput = props => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [schema.default, data]);
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(JsonFormRegisterProvider, {
       defaultRegisters: undefined,
       children: jsx(FormFieldWrapper$1, {
@@ -10794,7 +10801,7 @@ const LayoutRenderer = ({
   } else {
     if (direction === 'row') {
       return jsx(Visible, {
-        visible: visible,
+        "$visible": visible,
         children: jsx(GoabGrid, {
           minChildWidth: width || '10ch',
           children: renderLayoutElements(elements, schema, path, enabled, renderers, cells)
@@ -10802,7 +10809,7 @@ const LayoutRenderer = ({
       });
     } else {
       return jsx(Visible, {
-        visible: visible,
+        "$visible": visible,
         children: renderLayoutElements(elements, schema, path, enabled, renderers, cells)
       });
     }
@@ -10824,14 +10831,14 @@ const ReviewLayoutRenderer = ({
   } else {
     if (direction === 'row') {
       return jsx(Visible, {
-        visible: visible,
+        "$visible": visible,
         children: jsx(ReviewGrid, {
           children: renderLayoutElements(elements, schema, path, enabled, renderers, cells)
         })
       });
     } else {
       return jsx(Visible, {
-        visible: visible,
+        "$visible": visible,
         children: renderLayoutElements(elements, schema, path, enabled, renderers, cells)
       });
     }
@@ -11220,7 +11227,7 @@ const RenderStepElements = props => {
   var _props$category;
   const memoizedSchema = useMemo(() => Object.assign({}, props.schema), [props.schema]);
   return jsx(Visible, {
-    visible: props.visible,
+    "$visible": props.visible,
     "data-testid": `${(props == null ? void 0 : props.path) || ((_props$category = props.category) == null ? void 0 : _props$category.label)}-categories-${props.categoryIndex}`,
     children: props.category.elements.map((uiSchema, index) => {
       var _props$category2;
@@ -11423,7 +11430,7 @@ const PhoneNumberWithTypeControl = props => {
     handleChange(path, updated);
   };
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsxs(PhoneGrid, {
       children: [jsx(GoabFormItem, {
         label: "Phone type",
@@ -11481,7 +11488,7 @@ const PhoneNumberControl = props => {
     handleChange(path, value);
   };
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(GoabFormItem, {
       label: (schema == null ? void 0 : schema.title) || 'Phone number',
       requirement: required ? 'required' : undefined,
@@ -12749,7 +12756,7 @@ const ObjectArrayControl = props => {
     });
   }
   const content = jsxs(Visible, {
-    visible: visible,
+    "$visible": visible,
     "data-testid": "jsonforms-object-list-wrapper",
     children: [jsxs(ToolBarHeader, {
       children: [listTitle && jsxs(ObjectArrayTitle, {
@@ -12805,7 +12812,7 @@ const ArrayControl = props => {
     handleChange
   } = props;
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(ObjectArrayControl, Object.assign({}, props, {
       handleChange: handleChange
     }))
@@ -12818,7 +12825,7 @@ const ArrayControlBase = props => {
     visible
   } = props;
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(ArrayControl, Object.assign({
       arraySchema: {}
     }, props, {
@@ -12908,7 +12915,7 @@ const PrimitiveArrayControl = props => {
   if (options.format === 'checkboxes') {
     const checkboxOptions = getPrimitiveArrayOptions(schema);
     return jsxs(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: [jsx("h4", {
         children: prettyLabel
       }), jsx("div", {
@@ -12942,7 +12949,7 @@ const PrimitiveArrayControl = props => {
     });
   }
   return jsxs(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: [jsx("div", {
       style: {
         marginBottom: '8px'
@@ -13085,7 +13092,7 @@ const ListWithDetailsControl = props => {
     // eslint-disable-next-line
   }, [core == null ? void 0 : core.data, deleteTrigger, fileList, handleChange, path, props.data, props.schema, removeItems, rowData]);
   return jsxs(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: [jsx(ListWithDetailControl, Object.assign({}, props, {
       openDeleteDialog: openDeleteDialog,
       enabled: props.enabled,
@@ -13509,7 +13516,7 @@ const GoAGroupControlComponent = props => {
   const componentProps = (_group$options = group.options) == null ? void 0 : _group$options.componentProps;
   const accent = componentProps == null ? void 0 : componentProps.accent;
   return jsxs(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: [accent === 'thick' && jsx(GoabContainer, Object.assign({
       heading: group.label
     }, componentProps, {
@@ -13846,7 +13853,7 @@ const HelpContentComponent = _ref2 => {
   if (markdown && ((_uischema$options7 = uischema.options) == null ? void 0 : _uischema$options7.variant) === 'details') {
     var _uischema$options8, _uischema$options9, _uischema$elements;
     return jsx(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: jsx(HelpContentDiv, {
         "aria-label": (_uischema$options8 = uischema.options) == null ? void 0 : _uischema$options8.ariaLabel,
         children: jsx("div", {
@@ -13871,7 +13878,7 @@ const HelpContentComponent = _ref2 => {
   if (markdown) {
     var _uischema$options0;
     return jsx(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: jsx("div", {
         className: "help-content-markdown",
         children: MarkdownComponent({
@@ -13881,7 +13888,7 @@ const HelpContentComponent = _ref2 => {
     });
   }
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(HelpContentDiv, {
       "aria-label": (_uischema$options1 = uischema.options) == null ? void 0 : _uischema$options1.ariaLabel,
       children: jsxs("div", {
@@ -14305,7 +14312,7 @@ const FormStepperView = props => {
   return jsxs("div", {
     "data-testid": "form-stepper-test-wrapper",
     children: [jsx(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: jsxs("div", {
         id: `${path || `goa`}-form-stepper`,
         className: "formStepper",
@@ -14871,7 +14878,7 @@ const RenderPages = props => {
     "data-testid": "form-stepper-test-wrapper",
     ref: topElementRef,
     children: [jsx(Visible, {
-      visible: visible,
+      "$visible": visible,
       children: jsx("div", {
         id: `${path || `goa`}-form-pages`,
         children: jsxs(PageBorder, {
@@ -14884,7 +14891,7 @@ const RenderPages = props => {
             },
             testId: "back-to-tasks"
           }), !isOnReview && jsx(Visible, {
-            visible: true,
+            "$visible": true,
             children: jsxs("div", {
               "data-testid": `step_${activeId}-content-pages`,
               style: {
@@ -15298,7 +15305,7 @@ const FileUploader = _ref => {
     });
   };
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsxs(FileUploaderStyle, {
       className: "FileUploader",
       children: [jsx(GoabFormItem, {
@@ -17802,7 +17809,7 @@ const AddressLookUpControl = props => {
   }, [formStepperCtx, uischema == null ? void 0 : uischema.scope]);
   const readOnly = (_uischema$options$com = uischema == null || (_uischema$options2 = uischema.options) == null || (_uischema$options2 = _uischema$options2.componentProps) == null ? void 0 : _uischema$options2.readOnly) != null ? _uischema$options$com : false;
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsxs("div", {
       ref: addressContainerRef,
       children: [renderHelp(), jsx("h3", {
@@ -18123,7 +18130,7 @@ const FullNameControl = props => {
     }
   }, [stepperState == null ? void 0 : stepperState.targetScope, uischema.scope]);
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx("div", {
       ref: controlRef,
       children: jsx(NameInputs, {
@@ -18272,7 +18279,7 @@ const FullNameDobControl = props => {
     }
   }, [stepperState == null ? void 0 : stepperState.targetScope, uischema.scope]);
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsxs("div", {
       ref: controlRef,
       children: [jsx(NameInputs, {
@@ -18555,7 +18562,7 @@ const GoACalculation = props => {
   const isConfigError = !!error && (error.toLowerCase().includes('invalid scope') || error.toLowerCase().includes('expression syntax'));
   const showError = !!error && (isConfigError || hasInteracted);
   return jsx(Visible, {
-    visible: visible,
+    "$visible": visible,
     children: jsx(GoabFormItem, {
       label: label,
       error: showError ? error : '',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "2.67.8",
+  "version": "2.67.10",
   "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-06-25T21:22:05.583Z",
-  "sourceCommit": "a25b638498bc63728b41889ca6e86a9972cfde8a",
+  "generatedAt": "2026-06-29T21:40:54.421Z",
+  "sourceCommit": "ba77cdf919ad3793b0dc0195919846e304dd5da0",
   "sourcePath": "libs/jsonforms-components/src/index.ts",
   "rendererCount": 33,
   "renderers": [

package/src/lib/util/style-component.d.ts

@@ -1,6 +1,6 @@
 export declare const VerticalLayout: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
-export declare const Visible: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "visible"> & {
-    visible: boolean | undefined;
-}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "visible"> & {
-    visible: boolean | undefined;
+export declare const Visible: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$visible"> & {
+    $visible?: boolean;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$visible"> & {
+    $visible?: boolean;
 }, never>>> & string;