@abgov/jsonforms-components 1.23.0 → 1.23.2

package/index.esm.js

@@ -4881,6 +4881,7 @@ const FormStepper = props => {
   const categorization = uischema;
   const allCategories = JSON.parse(JSON.stringify(categorization));
   const componentProps = (_b = (_a = uischema.options) === null || _a === void 0 ? void 0 : _a.componentProps) !== null && _b !== void 0 ? _b : {};
+  const optionProps = uischema.options || {};
   const [step, setStep] = React.useState(0);
   const [isFormValid, setIsFormValid] = React.useState(false);
   const [showNextBtn, setShowNextBtn] = React.useState(true);
@@ -5051,7 +5052,7 @@ const FormStepper = props => {
           minChildWidth: "100px",
           children: [jsx("div", {
             children: step !== 1 ? jsx(GoAButton, {
-              type: (componentProps === null || componentProps === void 0 ? void 0 : componentProps.previousButtonType) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps.previousButtonType : 'secondary',
+              type: (optionProps === null || optionProps === void 0 ? void 0 : optionProps.previousButtonType) ? optionProps === null || optionProps === void 0 ? void 0 : optionProps.previousButtonType : 'secondary',
               disabled: disabledCategoryMap[step - 1],
               onClick: () => {
                 const element = document.getElementById(`${path || `goa`}-form-stepper`);
@@ -5061,11 +5062,11 @@ const FormStepper = props => {
                 prevPage(step, disabledCategoryMap);
               },
               testId: "prev-button",
-              children: (componentProps === null || componentProps === void 0 ? void 0 : componentProps.previousButtonLabel) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps.previousButtonLabel : 'Previous'
+              children: (optionProps === null || optionProps === void 0 ? void 0 : optionProps.previousButtonLabel) ? optionProps === null || optionProps === void 0 ? void 0 : optionProps.previousButtonLabel : 'Previous'
             }) : jsx("div", {})
           }), jsxs(RightAlignmentDiv, {
             children: [step !== null && showNextBtn && jsx(GoAButton, {
-              type: (componentProps === null || componentProps === void 0 ? void 0 : componentProps.nextButtonType) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps.nextButtonType : 'primary',
+              type: (optionProps === null || optionProps === void 0 ? void 0 : optionProps.nextButtonType) ? optionProps === null || optionProps === void 0 ? void 0 : optionProps.nextButtonType : 'primary',
               disabled: disabledCategoryMap[step - 1],
               onClick: () => {
                 const element = document.getElementById(`${path || `goa`}-form-stepper`);
@@ -5075,7 +5076,7 @@ const FormStepper = props => {
                 nextPage(step, disabledCategoryMap);
               },
               testId: "next-button",
-              children: (componentProps === null || componentProps === void 0 ? void 0 : componentProps.nextButtonLabel) ? componentProps === null || componentProps === void 0 ? void 0 : componentProps.nextButtonLabel : 'Next'
+              children: (optionProps === null || optionProps === void 0 ? void 0 : optionProps.nextButtonLabel) ? optionProps === null || optionProps === void 0 ? void 0 : optionProps.nextButtonLabel : 'Next'
             }), !showNextBtn && !isFormSubmitted && jsx("div", {
               children: jsx(GoAButton, {
                 type: 'primary',
@@ -5382,8 +5383,9 @@ const ObjectArrayToolBar = /*#__PURE__*/React.memo(function TableToolbar({
   rootSchema,
   uischema
 }) {
-  var _a, _b;
+  var _a, _b, _c, _d;
   const buttonPosition = ((_a = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _a === void 0 ? void 0 : _a.addButtonPosition) || 'left';
+  const arrayLabel = getLabelText(uischema.scope, label);
   return jsx(Fragment, {
     children: jsx("div", {
       style: {
@@ -5394,7 +5396,8 @@ const ObjectArrayToolBar = /*#__PURE__*/React.memo(function TableToolbar({
         testId: `object-array-toolbar-${label}`,
         "aria-label": translations.addAriaLabel,
         onClick: addItem(path, createDefaultValue(schema, rootSchema)),
-        children: ((_b = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _b === void 0 ? void 0 : _b.addButtonText) || 'Add'
+        type: (_c = (_b = uischema.options) === null || _b === void 0 ? void 0 : _b.addButtonType) !== null && _c !== void 0 ? _c : 'primary',
+        children: ((_d = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _d === void 0 ? void 0 : _d.addButtonText) || capitalizeFirstLetter(`Add ${arrayLabel}`)
       })
     })
   });
@@ -5981,7 +5984,7 @@ const RenderLink = props => {
 };
 
 const HelpContentComponent = _a => {
-  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
   var {
       isParent = true
     } = _a,
@@ -6019,24 +6022,25 @@ const HelpContentComponent = _a => {
       alt: alt
     });
   };
+  const textVariant = !((_c = uischema.options) === null || _c === void 0 ? void 0 : _c.variant) || ((_d = uischema.options) === null || _d === void 0 ? void 0 : _d.variant) !== 'details' && ((_e = uischema.options) === null || _e === void 0 ? void 0 : _e.variant) !== 'link';
   return jsx(Visible, {
     visible: visible,
     children: jsx(HelpContentDiv, {
-      "aria-label": (_c = uischema.options) === null || _c === void 0 ? void 0 : _c.ariaLabel,
+      "aria-label": (_f = uischema.options) === null || _f === void 0 ? void 0 : _f.ariaLabel,
       children: jsxs("div", {
         className: marginClass,
-        children: [label && !((_d = uischema.options) === null || _d === void 0 ? void 0 : _d.variant) && ((_e = uischema.options) === null || _e === void 0 ? void 0 : _e.variant) !== 'details' && jsxs("div", {
+        children: [label && (!((_g = uischema.options) === null || _g === void 0 ? void 0 : _g.variant) || ((_h = uischema.options) === null || _h === void 0 ? void 0 : _h.variant) === 'link') && jsxs("div", {
           className: labelClass,
           "data-testid": label,
           children: [label, jsx("br", {})]
-        }), ((_f = uischema.options) === null || _f === void 0 ? void 0 : _f.variant) && ((_g = uischema.options) === null || _g === void 0 ? void 0 : _g.variant) === 'img' && renderImage(uischema.options), ((_h = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _h === void 0 ? void 0 : _h.link) && link !== '' && RenderLink(uischema === null || uischema === void 0 ? void 0 : uischema.options), (!((_j = uischema.options) === null || _j === void 0 ? void 0 : _j.variant) || ((_k = uischema.options) === null || _k === void 0 ? void 0 : _k.variant) !== 'details') && !link && renderHelp(), ((_l = uischema.options) === null || _l === void 0 ? void 0 : _l.variant) && ((_m = uischema.options) === null || _m === void 0 ? void 0 : _m.variant) === 'details' && jsxs(GoADetails, {
+        }), ((_j = uischema.options) === null || _j === void 0 ? void 0 : _j.variant) && ((_k = uischema.options) === null || _k === void 0 ? void 0 : _k.variant) === 'img' && renderImage(uischema.options), ((_l = uischema === null || uischema === void 0 ? void 0 : uischema.options) === null || _l === void 0 ? void 0 : _l.variant) && ((_m = uischema.options) === null || _m === void 0 ? void 0 : _m.variant) === 'link' && link && RenderLink(uischema === null || uischema === void 0 ? void 0 : uischema.options), textVariant && renderHelp(), ((_o = uischema.options) === null || _o === void 0 ? void 0 : _o.variant) && ((_p = uischema.options) === null || _p === void 0 ? void 0 : _p.variant) === 'details' && jsxs(GoADetails, {
           heading: label ? label : '',
           mt: "3xs",
           mb: "none",
-          children: [renderHelp(), (uischema === null || uischema === void 0 ? void 0 : uischema.elements) && ((_o = uischema === null || uischema === void 0 ? void 0 : uischema.elements) === null || _o === void 0 ? void 0 : _o.length) > 0 && jsx(HelpContents, {
+          children: [renderHelp(), (uischema === null || uischema === void 0 ? void 0 : uischema.elements) && ((_q = uischema === null || uischema === void 0 ? void 0 : uischema.elements) === null || _q === void 0 ? void 0 : _q.length) > 0 && jsx(HelpContents, {
             elements: uischema === null || uischema === void 0 ? void 0 : uischema.elements
           })]
-        }), (uischema === null || uischema === void 0 ? void 0 : uischema.elements) && (uischema === null || uischema === void 0 ? void 0 : uischema.elements.length) > 0 && ((_p = uischema.options) === null || _p === void 0 ? void 0 : _p.variant) !== 'details' && jsx(HelpContents, {
+        }), (uischema === null || uischema === void 0 ? void 0 : uischema.elements) && (uischema === null || uischema === void 0 ? void 0 : uischema.elements.length) > 0 && ((_r = uischema.options) === null || _r === void 0 ? void 0 : _r.variant) !== 'details' && jsx(HelpContents, {
           elements: uischema.elements,
           isParent: false
         })]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.23.0",
+  "version": "1.23.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/src/lib/Controls/FormStepper/FormStepperControl.d.ts

@@ -5,12 +5,14 @@ import { AjvProps } from '../../util/layout';
 export interface CategorizationStepperLayoutRendererProps extends StatePropsOfLayout, AjvProps, TranslateProps {
 }
 export interface FormStepperComponentProps {
+    controlledNav?: number;
+    readOnly?: boolean;
+}
+export interface FormStepperOptionProps {
     nextButtonLabel?: string;
     nextButtonType?: GoAButtonType;
     previousButtonLabel?: string;
     previousButtonType?: GoAButtonType;
-    controlledNav?: number;
-    readOnly?: boolean;
 }
 export declare const FormStepper: (props: CategorizationStepperLayoutRendererProps) => JSX.Element;
 export declare const FormStepperControl: (props: CategorizationStepperLayoutRendererProps & import("@jsonforms/core").OwnPropsOfLayout) => import("react/jsx-runtime").JSX.Element;