@abgov/jsonforms-components 1.4.0 → 1.5.1

package/index.esm.js

@@ -1,6 +1,6 @@
 import { withAjvProps, materialSliderControlTester, MaterialSliderControl, materialObjectControlTester, MaterialObjectRenderer, materialAllOfControlTester, MaterialAllOfRenderer, materialAnyOfControlTester, MaterialAnyOfRenderer, materialOneOfControlTester, MaterialOneOfRenderer, materialOneOfRadioGroupControlTester, MaterialOneOfRadioGroupControl, materialOneOfEnumControlTester, MaterialOneOfEnumControl, materialHorizontalLayoutTester, materialVerticalLayoutTester, materialArrayLayoutTester, MaterialArrayLayout, materialAnyOfStringOrEnumControlTester, MaterialAnyOfStringOrEnumControl, materialEnumArrayRendererTester, MaterialEnumArrayRenderer, materialBooleanCellTester, MaterialBooleanCell, materialBooleanToggleCellTester, MaterialBooleanToggleCell, materialEnumCellTester, MaterialEnumCell, materialOneOfEnumCellTester, MaterialOneOfEnumCell } from '@jsonforms/material-renderers';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { GoAFormItem, GoACallout, GoAInputDate, GoAInput, GoATextArea, GoAInputDateTime, GoAInputTime, GoADropdown, GoADropdownItem, GoARadioGroup, GoARadioItem, GoACheckbox, GoAFormStepper, GoAFormStep, GoAPages, GoAButton, GoAIconButton, GoAFileUploadInput, GoAModal, GoACircularProgress, GoAGrid, GoAContainer, GoAButtonGroup, GoADetails } from '@abgov/react-components';
+import { GoAFormItem, GoACallout, GoAInputDate, GoAInput, GoATextArea, GoAInputDateTime, GoAInputTime, GoADropdown, GoADropdownItem, GoARadioGroup, GoARadioItem, GoACheckbox, GoAFormStepper, GoAFormStep, GoAPages, GoAButton, GoAModal, GoAButtonGroup, GoAIconButton, GoAFileUploadInput, GoACircularProgress, GoAGrid, GoAContainer, GoADetails } from '@abgov/react-components';
 import { Hidden, Typography, FormHelperText } from '@mui/material';
 import styled from 'styled-components';
 import { rankWith, uiTypeIs, isDateControl, isStringControl, and, optionIs, isNumberControl, isIntegerControl, isDateTimeControl, isTimeControl, isEnumControl, isBooleanControl, isDescriptionHidden, isVisible, isEnabled, deriveLabelForUISchemaElement, schemaTypeIs, formatIs, createDefaultValue, Paths, or, isObjectArrayControl, isPrimitiveArrayControl, withIncreasedRank, hasType, isControl, isCategorization, isLayout } from '@jsonforms/core';
@@ -3866,6 +3866,7 @@ const FormStepper = ({
   const [step, setStep] = useState(1);
   const [isFormValid, setIsFormValid] = useState(false);
   const [showNextBtn, setShowNextBtn] = useState(true);
+  const [isOpen, setIsOpen] = useState(false);
   const [categories, setCategories] = useState(categorization.elements);
   useEffect(() => {
     const cates = categorization.elements.filter(category => isVisible(category, data, '', ajv));
@@ -3873,6 +3874,11 @@ const FormStepper = ({
   }, [categorization, data, ajv]);
   const disabledCategoryMap = categories.map(c => !isEnabled(c, data, '', ajv));
   const handleSubmit = () => {
+    setIsOpen(true);
+    console.log('submitted', data);
+  };
+  const onSubmit = () => {
+    setIsOpen(false);
     console.log('submitted', data);
   };
   const CategoryLabels = useMemo(() => {
@@ -3908,15 +3914,17 @@ const FormStepper = ({
   }
   function setTab(page) {
     const rawCategoryLabels = rawCategories.elements.map(category => category.label);
-    if (page > 1 && page <= rawCategoryLabels.length && rawCategoryLabels.length !== CategoryLabels.length) {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const selectedTabLabel = rawCategoryLabels[page - 1];
-      const selectedTab = CategoryLabels.indexOf(selectedTabLabel);
-      const newStep = selectedTab !== -1 ? selectedTab : page;
-      page = newStep;
-    }
-    if (page > rawCategoryLabels.length && rawCategoryLabels.length !== CategoryLabels.length) {
-      page = page - 1;
+    if (rawCategoryLabels.length !== CategoryLabels.length) {
+      if (page > 1 && page <= rawCategoryLabels.length) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const selectedTabLabel = rawCategoryLabels[page - 1];
+        const selectedTab = CategoryLabels.indexOf(selectedTabLabel);
+        const newStep = selectedTab !== -1 ? selectedTab + 1 : page;
+        page = newStep;
+      }
+      if (page > rawCategoryLabels.length) {
+        page = page - 1;
+      }
     }
     setStep(page);
     if (page < 1 || page > categories.length + 1) return;
@@ -4040,6 +4048,23 @@ const FormStepper = ({
             children: "Submit"
           })
         })]
+      }), jsxs(GoAModal, {
+        testId: "submit-confirmation",
+        open: isOpen,
+        heading: 'Form Submitted',
+        width: "640px",
+        actions: jsx(GoAButtonGroup, {
+          alignment: "end",
+          children: jsx(GoAButton, {
+            type: "secondary",
+            testId: "submit-form",
+            onClick: onSubmit,
+            children: "Ok"
+          })
+        }),
+        children: [jsx("b", {
+          children: "Submit is a test for preview purposes"
+        }), "(i.e. no actual form is being submitted)"]
       })]
     })
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "1.4.0",
+  "version": "1.5.1",
   "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",