@aehrc/smart-forms-renderer 0.21.1 → 0.21.2

package/lib/components/FormComponents/GroupItem/GroupItem.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import type { QuestionnaireItem, QuestionnaireResponseItem } from 'fhir/r4';
-import type { PropsWithIsRepeatedAttribute, PropsWithParentIsReadOnlyAttribute, PropsWithQrItemChangeHandler } from '../../../interfaces/renderProps.interface';
-import type { PropsWithParentIsRepeatGroupAttribute } from '../../../interfaces/renderProps.interface';
+import type { PropsWithIsRepeatedAttribute, PropsWithParentIsReadOnlyAttribute, PropsWithParentIsRepeatGroupAttribute, PropsWithQrItemChangeHandler } from '../../../interfaces/renderProps.interface';
 import type { Tabs } from '../../../interfaces/tab.interface';
 interface GroupItemProps extends PropsWithQrItemChangeHandler, PropsWithIsRepeatedAttribute, PropsWithParentIsReadOnlyAttribute, PropsWithParentIsRepeatGroupAttribute {
     qItem: QuestionnaireItem;

package/lib/components/FormComponents/GroupItem/GroupItem.js

@@ -21,7 +21,7 @@ import { QGroupContainerBox } from '../../Box.styles';
 import useHidden from '../../../hooks/useHidden';
 import GroupHeading from './GroupHeading';
 import { GroupCard } from './GroupItem.styles';
-import NextTabButtonWrapper from './NextTabButtonWrapper';
+import TabButtonsWrapper from './TabButtonsWrapper';
 import GroupItemSwitcher from './GroupItemSwitcher';
 import useReadOnly from '../../../hooks/useReadOnly';
 function GroupItem(props) {
@@ -58,7 +58,7 @@ function GroupItem(props) {
                 const qrItemOrItems = qrItemsByIndex[i];
                 return (React.createElement(GroupItemSwitcher, { key: qItem.linkId, qItem: qItem, qrItemOrItems: qrItemOrItems, groupCardElevation: groupCardElevation, parentIsReadOnly: readOnly, parentIsRepeatGroup: parentIsRepeatGroup, parentRepeatGroupIndex: parentRepeatGroupIndex, onQrItemChange: handleQrItemChange, onQrRepeatGroupChange: handleQrRepeatGroupChange }));
             }),
-            React.createElement(NextTabButtonWrapper, { currentTabIndex: currentTabIndex, tabs: tabs }))));
+            React.createElement(TabButtonsWrapper, { currentTabIndex: currentTabIndex, tabs: tabs }))));
 }
 export default GroupItem;
 //# sourceMappingURL=GroupItem.js.map

package/lib/components/FormComponents/GroupItem/GroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupItem.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/GroupItem.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"GroupItem.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/GroupItem.tsx"],"names":[],"mappings":"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"}

package/lib/components/FormComponents/GroupItem/NextTabButtonWrapper.js

@@ -48,7 +48,9 @@ const NextTabButtonWrapper = memo(function NextTabWrapper(props) {
         return null;
     }
     const buttonIsDisabled = findNumOfVisibleTabs(tabs, enableWhenIsActivated, enableWhenItems, enableWhenExpressions) <= 1;
-    return (React.createElement(Box, { display: "flex", flexDirection: "row-reverse", mt: 3 },
+    return (React.createElement(Box, { display: "flex", mt: 3 },
+        React.createElement(NextTabButton, { isDisabled: buttonIsDisabled, onNextTabClick: handleNextTabClick }),
+        React.createElement(Box, { flexGrow: 1 }),
         React.createElement(NextTabButton, { isDisabled: buttonIsDisabled, onNextTabClick: handleNextTabClick })));
 });
 export default NextTabButtonWrapper;

package/lib/components/FormComponents/GroupItem/NextTabButtonWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"NextTabButtonWrapper.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/NextTabButtonWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,GAAG,MAAM,mBAAmB,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAEnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAO5C,MAAM,oBAAoB,GAAG,IAAI,CAAC,SAAS,cAAc,CAAC,KAAgC;IACxF,MAAM,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAExC,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,eAAe,GAAG,qBAAqB,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC;IACpE,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,SAAS,GAAG,qBAAqB,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;IAExD,MAAM,cAAc,GAAG,eAAe,KAAK,SAAS,IAAI,IAAI,KAAK,SAAS,CAAC;IAE3E,SAAS,kBAAkB;QACzB,IAAI,cAAc,EAAE;YAClB,OAAO;SACR;QAED,MAAM,mBAAmB,GAAG,sBAAsB,CAAC;YACjD,IAAI;YACJ,eAAe;YACf,qBAAqB;YACrB,eAAe;YACf,qBAAqB;SACtB,CAAC,CAAC;QACH,SAAS,CAAC,mBAAmB,CAAC,CAAC;QAE/B,wBAAwB;QACxB,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACxB,CAAC;IAED,IAAI,cAAc,EAAE;QAClB,OAAO,IAAI,CAAC;KACb;IAED,IAAI,eAAe,KAAK,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;QACpD,OAAO,IAAI,CAAC;KACb;IAED,MAAM,gBAAgB,GACpB,oBAAoB,CAAC,IAAI,EAAE,qBAAqB,EAAE,eAAe,EAAE,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAEjG,OAAO,CACL,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,aAAa,EAAC,aAAa,EAAC,EAAE,EAAE,CAAC;QACnD,oBAAC,aAAa,IAAC,UAAU,EAAE,gBAAgB,EAAE,cAAc,EAAE,kBAAkB,GAAI,CAC/E,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"NextTabButtonWrapper.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/NextTabButtonWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,GAAG,MAAM,mBAAmB,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAEnF,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAO5C,MAAM,oBAAoB,GAAG,IAAI,CAAC,SAAS,cAAc,CAAC,KAAgC;IACxF,MAAM,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAExC,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,eAAe,GAAG,qBAAqB,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC;IACpE,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,SAAS,GAAG,qBAAqB,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;IAExD,MAAM,cAAc,GAAG,eAAe,KAAK,SAAS,IAAI,IAAI,KAAK,SAAS,CAAC;IAE3E,SAAS,kBAAkB;QACzB,IAAI,cAAc,EAAE;YAClB,OAAO;SACR;QAED,MAAM,mBAAmB,GAAG,sBAAsB,CAAC;YACjD,IAAI;YACJ,eAAe;YACf,qBAAqB;YACrB,eAAe;YACf,qBAAqB;SACtB,CAAC,CAAC;QACH,SAAS,CAAC,mBAAmB,CAAC,CAAC;QAE/B,wBAAwB;QACxB,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACxB,CAAC;IAED,IAAI,cAAc,EAAE;QAClB,OAAO,IAAI,CAAC;KACb;IAED,IAAI,eAAe,KAAK,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;QACpD,OAAO,IAAI,CAAC;KACb;IAED,MAAM,gBAAgB,GACpB,oBAAoB,CAAC,IAAI,EAAE,qBAAqB,EAAE,eAAe,EAAE,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAEjG,OAAO,CACL,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,EAAE,EAAE,CAAC;QACvB,oBAAC,aAAa,IAAC,UAAU,EAAE,gBAAgB,EAAE,cAAc,EAAE,kBAAkB,GAAI;QACnF,oBAAC,GAAG,IAAC,QAAQ,EAAE,CAAC,GAAI;QACpB,oBAAC,aAAa,IAAC,UAAU,EAAE,gBAAgB,EAAE,cAAc,EAAE,kBAAkB,GAAI,CAC/E,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,oBAAoB,CAAC"}

package/lib/components/FormComponents/GroupItem/PreviousTabButton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface PreviousTabButtonProps {
+    isDisabled: boolean;
+    onPreviousTabClick: () => void;
+}
+declare function PreviousTabButton(props: PreviousTabButtonProps): React.JSX.Element;
+export default PreviousTabButton;

package/lib/components/FormComponents/GroupItem/PreviousTabButton.js

@@ -0,0 +1,25 @@
+/*
+ * Copyright 2024 Commonwealth Scientific and Industrial Research
+ * Organisation (CSIRO) ABN 41 687 119 230.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import Button from '@mui/material/Button';
+import Iconify from '../../Iconify/Iconify';
+function PreviousTabButton(props) {
+    const { isDisabled, onPreviousTabClick } = props;
+    return (React.createElement(Button, { variant: "contained", size: "small", endIcon: React.createElement(Iconify, { icon: "material-symbols:arrow-back" }), disabled: isDisabled, color: "secondary", onClick: onPreviousTabClick }, "Previous tab"));
+}
+export default PreviousTabButton;
+//# sourceMappingURL=PreviousTabButton.js.map

package/lib/components/FormComponents/GroupItem/PreviousTabButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreviousTabButton.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/PreviousTabButton.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,OAAO,MAAM,uBAAuB,CAAC;AAO5C,SAAS,iBAAiB,CAAC,KAA6B;IACtD,MAAM,EAAE,UAAU,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAC;IAEjD,OAAO,CACL,oBAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,oBAAC,OAAO,IAAC,IAAI,EAAC,6BAA6B,GAAG,EACvD,QAAQ,EAAE,UAAU,EACpB,KAAK,EAAC,WAAW,EACjB,OAAO,EAAE,kBAAkB,mBAEpB,CACV,CAAC;AACJ,CAAC;AAED,eAAe,iBAAiB,CAAC"}

package/lib/components/FormComponents/GroupItem/TabButtonsWrapper.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { Tabs } from '../../../interfaces/tab.interface';
+interface TabButtonsWrapperProps {
+    currentTabIndex?: number;
+    tabs?: Tabs;
+}
+declare const TabButtonsWrapper: React.NamedExoticComponent<TabButtonsWrapperProps>;
+export default TabButtonsWrapper;

package/lib/components/FormComponents/GroupItem/TabButtonsWrapper.js

@@ -0,0 +1,58 @@
+/*
+ * Copyright 2024 Commonwealth Scientific and Industrial Research
+ * Organisation (CSIRO) ABN 41 687 119 230.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React, { memo } from 'react';
+import Box from '@mui/material/Box';
+import { findNumOfVisibleTabs, getVisibleTabIndex } from '../../../utils/tabs';
+import { useQuestionnaireStore } from '../../../stores';
+import NextTabButton from './NextTabButton';
+import PreviousTabButton from './PreviousTabButton';
+const TabButtonsWrapper = memo(function TabButtonsWrapper(props) {
+    const { currentTabIndex, tabs } = props;
+    const enableWhenIsActivated = useQuestionnaireStore.use.enableWhenIsActivated();
+    const enableWhenItems = useQuestionnaireStore.use.enableWhenItems();
+    const enableWhenExpressions = useQuestionnaireStore.use.enableWhenExpressions();
+    const switchTab = useQuestionnaireStore.use.switchTab();
+    const tabsNotDefined = currentTabIndex === undefined || tabs === undefined;
+    function handleButtonClick(direction) {
+        if (tabsNotDefined) {
+            return;
+        }
+        const visibleTabIndex = getVisibleTabIndex({
+            direction,
+            tabs,
+            currentTabIndex,
+            enableWhenIsActivated,
+            enableWhenItems,
+            enableWhenExpressions
+        });
+        switchTab(visibleTabIndex);
+        // Scroll to top of page
+        window.scrollTo(0, 0);
+    }
+    if (tabsNotDefined) {
+        return null;
+    }
+    const previousTabButtonHidden = currentTabIndex === 0;
+    const nextTabButtonHidden = currentTabIndex === Object.keys(tabs).length - 1;
+    const buttonIsDisabled = findNumOfVisibleTabs(tabs, enableWhenIsActivated, enableWhenItems, enableWhenExpressions) <= 1;
+    return (React.createElement(Box, { display: "flex", mt: 3 },
+        previousTabButtonHidden ? null : (React.createElement(PreviousTabButton, { isDisabled: buttonIsDisabled, onPreviousTabClick: () => handleButtonClick('previous') })),
+        React.createElement(Box, { flexGrow: 1 }),
+        nextTabButtonHidden ? null : (React.createElement(NextTabButton, { isDisabled: buttonIsDisabled, onNextTabClick: () => handleButtonClick('next') }))));
+});
+export default TabButtonsWrapper;
+//# sourceMappingURL=TabButtonsWrapper.js.map

package/lib/components/FormComponents/GroupItem/TabButtonsWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabButtonsWrapper.js","sourceRoot":"","sources":["../../../../src/components/FormComponents/GroupItem/TabButtonsWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,GAAG,MAAM,mBAAmB,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAE/E,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAOpD,MAAM,iBAAiB,GAAG,IAAI,CAAC,SAAS,iBAAiB,CAAC,KAA6B;IACrF,MAAM,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAExC,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,eAAe,GAAG,qBAAqB,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC;IACpE,MAAM,qBAAqB,GAAG,qBAAqB,CAAC,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChF,MAAM,SAAS,GAAG,qBAAqB,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;IAExD,MAAM,cAAc,GAAG,eAAe,KAAK,SAAS,IAAI,IAAI,KAAK,SAAS,CAAC;IAE3E,SAAS,iBAAiB,CAAC,SAA8B;QACvD,IAAI,cAAc,EAAE;YAClB,OAAO;SACR;QAED,MAAM,eAAe,GAAG,kBAAkB,CAAC;YACzC,SAAS;YACT,IAAI;YACJ,eAAe;YACf,qBAAqB;YACrB,eAAe;YACf,qBAAqB;SACtB,CAAC,CAAC;QACH,SAAS,CAAC,eAAe,CAAC,CAAC;QAE3B,wBAAwB;QACxB,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACxB,CAAC;IAED,IAAI,cAAc,EAAE;QAClB,OAAO,IAAI,CAAC;KACb;IAED,MAAM,uBAAuB,GAAG,eAAe,KAAK,CAAC,CAAC;IACtD,MAAM,mBAAmB,GAAG,eAAe,KAAK,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAE7E,MAAM,gBAAgB,GACpB,oBAAoB,CAAC,IAAI,EAAE,qBAAqB,EAAE,eAAe,EAAE,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAEjG,OAAO,CACL,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,EAAE,EAAE,CAAC;QACtB,uBAAuB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAChC,oBAAC,iBAAiB,IAChB,UAAU,EAAE,gBAAgB,EAC5B,kBAAkB,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,UAAU,CAAC,GACvD,CACH;QACD,oBAAC,GAAG,IAAC,QAAQ,EAAE,CAAC,GAAI;QACnB,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC5B,oBAAC,aAAa,IACZ,UAAU,EAAE,gBAAgB,EAC5B,cAAc,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,MAAM,CAAC,GAC/C,CACH,CACG,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,iBAAiB,CAAC"}

package/lib/utils/tabs.d.ts

@@ -44,7 +44,8 @@ export declare function constructTabsWithVisibility(params: constructTabsWithVis
     linkId: string;
     isVisible: boolean;
 }[];
-interface getNextVisibleTabIndexParams {
+interface getVisibleTabIndexParams {
+    direction: 'next' | 'previous';
     tabs: Tabs;
     currentTabIndex: number;
     enableWhenIsActivated: boolean;
@@ -56,7 +57,7 @@ interface getNextVisibleTabIndexParams {
  *
  * @author Sean Fong
  */
-export declare function getNextVisibleTabIndex(params: getNextVisibleTabIndexParams): number;
+export declare function getVisibleTabIndex(params: getVisibleTabIndexParams): number;
 /**
  *
  * Find number of visible tabs

package/lib/utils/tabs.js

@@ -122,23 +122,36 @@ export function constructTabsWithVisibility(params) {
  *
  * @author Sean Fong
  */
-export function getNextVisibleTabIndex(params) {
-    const { tabs, currentTabIndex, enableWhenIsActivated, enableWhenItems, enableWhenExpressions } = params;
+export function getVisibleTabIndex(params) {
+    const { direction, tabs, currentTabIndex, enableWhenIsActivated, enableWhenItems, enableWhenExpressions } = params;
     const tabsWithVisibility = constructTabsWithVisibility({
         tabs,
         enableWhenIsActivated,
         enableWhenItems,
         enableWhenExpressions
     });
-    let nextTabIndex = currentTabIndex + 1;
-    const nextTabIndexIsVisible = false;
-    while (!nextTabIndexIsVisible) {
-        if (tabsWithVisibility[nextTabIndex].isVisible) {
-            return nextTabIndex;
+    let visibleTabIndex;
+    if (direction === 'next') {
+        visibleTabIndex = currentTabIndex + 1;
+        const nextTabIndexIsVisible = false;
+        while (!nextTabIndexIsVisible) {
+            if (tabsWithVisibility[visibleTabIndex].isVisible) {
+                return visibleTabIndex;
+            }
+            visibleTabIndex++;
         }
-        nextTabIndex++;
     }
-    return nextTabIndex;
+    else {
+        visibleTabIndex = currentTabIndex - 1;
+        const previousTabIndexIsVisible = false;
+        while (!previousTabIndexIsVisible) {
+            if (tabsWithVisibility[visibleTabIndex].isVisible) {
+                return visibleTabIndex;
+            }
+            visibleTabIndex--;
+        }
+    }
+    return visibleTabIndex;
 }
 /**
  *

package/lib/utils/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/utils/tabs.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/utils/tabs.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aehrc/smart-forms-renderer",
-  "version": "0.21.1",
+  "version": "0.21.2",
   "description": "FHIR Structured Data Captured (SDC) rendering engine for Smart Forms",
   "main": "lib/index.js",
   "scripts": {

package/src/components/FormComponents/GroupItem/GroupItem.tsx

@@ -23,15 +23,15 @@ import { QGroupContainerBox } from '../../Box.styles';
 import type {
   PropsWithIsRepeatedAttribute,
   PropsWithParentIsReadOnlyAttribute,
+  PropsWithParentIsRepeatGroupAttribute,
   PropsWithQrItemChangeHandler
 } from '../../../interfaces/renderProps.interface';
-import type { PropsWithParentIsRepeatGroupAttribute } from '../../../interfaces/renderProps.interface';
 import type { QrRepeatGroup } from '../../../interfaces/repeatGroup.interface';
 import useHidden from '../../../hooks/useHidden';
 import type { Tabs } from '../../../interfaces/tab.interface';
 import GroupHeading from './GroupHeading';
 import { GroupCard } from './GroupItem.styles';
-import NextTabButtonWrapper from './NextTabButtonWrapper';
+import TabButtonsWrapper from './TabButtonsWrapper';
 import GroupItemSwitcher from './GroupItemSwitcher';
 import useReadOnly from '../../../hooks/useReadOnly';
 
@@ -126,7 +126,7 @@ function GroupItem(props: GroupItemProps) {
         })}
 
         {/* Next tab button at the end of each tab group */}
-        <NextTabButtonWrapper currentTabIndex={currentTabIndex} tabs={tabs} />
+        <TabButtonsWrapper currentTabIndex={currentTabIndex} tabs={tabs} />
       </GroupCard>
     </QGroupContainerBox>
   );

package/src/components/FormComponents/GroupItem/PreviousTabButton.tsx

@@ -0,0 +1,43 @@
+/*
+ * Copyright 2024 Commonwealth Scientific and Industrial Research
+ * Organisation (CSIRO) ABN 41 687 119 230.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+import Button from '@mui/material/Button';
+import Iconify from '../../Iconify/Iconify';
+
+interface PreviousTabButtonProps {
+  isDisabled: boolean;
+  onPreviousTabClick: () => void;
+}
+
+function PreviousTabButton(props: PreviousTabButtonProps) {
+  const { isDisabled, onPreviousTabClick } = props;
+
+  return (
+    <Button
+      variant="contained"
+      size="small"
+      endIcon={<Iconify icon="material-symbols:arrow-back" />}
+      disabled={isDisabled}
+      color="secondary"
+      onClick={onPreviousTabClick}>
+      Previous tab
+    </Button>
+  );
+}
+
+export default PreviousTabButton;

package/src/components/FormComponents/GroupItem/{NextTabButtonWrapper.tsx → TabButtonsWrapper.tsx}

@@ -17,17 +17,18 @@
 
 import React, { memo } from 'react';
 import Box from '@mui/material/Box';
-import { findNumOfVisibleTabs, getNextVisibleTabIndex } from '../../../utils/tabs';
+import { findNumOfVisibleTabs, getVisibleTabIndex } from '../../../utils/tabs';
 import type { Tabs } from '../../../interfaces/tab.interface';
 import { useQuestionnaireStore } from '../../../stores';
 import NextTabButton from './NextTabButton';
+import PreviousTabButton from './PreviousTabButton';
 
-interface NextTabButtonWrapperProps {
+interface TabButtonsWrapperProps {
   currentTabIndex?: number;
   tabs?: Tabs;
 }
 
-const NextTabButtonWrapper = memo(function NextTabWrapper(props: NextTabButtonWrapperProps) {
+const TabButtonsWrapper = memo(function TabButtonsWrapper(props: TabButtonsWrapperProps) {
   const { currentTabIndex, tabs } = props;
 
   const enableWhenIsActivated = useQuestionnaireStore.use.enableWhenIsActivated();
@@ -37,19 +38,20 @@ const NextTabButtonWrapper = memo(function NextTabWrapper(props: NextTabButtonWr
 
   const tabsNotDefined = currentTabIndex === undefined || tabs === undefined;
 
-  function handleNextTabClick() {
+  function handleButtonClick(direction: 'next' | 'previous') {
     if (tabsNotDefined) {
       return;
     }
 
-    const nextVisibleTabIndex = getNextVisibleTabIndex({
+    const visibleTabIndex = getVisibleTabIndex({
+      direction,
       tabs,
       currentTabIndex,
       enableWhenIsActivated,
       enableWhenItems,
       enableWhenExpressions
     });
-    switchTab(nextVisibleTabIndex);
+    switchTab(visibleTabIndex);
 
     // Scroll to top of page
     window.scrollTo(0, 0);
@@ -59,18 +61,29 @@ const NextTabButtonWrapper = memo(function NextTabWrapper(props: NextTabButtonWr
     return null;
   }
 
-  if (currentTabIndex === Object.keys(tabs).length - 1) {
-    return null;
-  }
+  const previousTabButtonHidden = currentTabIndex === 0;
+  const nextTabButtonHidden = currentTabIndex === Object.keys(tabs).length - 1;
 
   const buttonIsDisabled =
     findNumOfVisibleTabs(tabs, enableWhenIsActivated, enableWhenItems, enableWhenExpressions) <= 1;
 
   return (
-    <Box display="flex" flexDirection="row-reverse" mt={3}>
-      <NextTabButton isDisabled={buttonIsDisabled} onNextTabClick={handleNextTabClick} />
+    <Box display="flex" mt={3}>
+      {previousTabButtonHidden ? null : (
+        <PreviousTabButton
+          isDisabled={buttonIsDisabled}
+          onPreviousTabClick={() => handleButtonClick('previous')}
+        />
+      )}
+      <Box flexGrow={1} />
+      {nextTabButtonHidden ? null : (
+        <NextTabButton
+          isDisabled={buttonIsDisabled}
+          onNextTabClick={() => handleButtonClick('next')}
+        />
+      )}
     </Box>
   );
 });
 
-export default NextTabButtonWrapper;
+export default TabButtonsWrapper;

package/src/utils/tabs.ts

@@ -156,7 +156,8 @@ export function constructTabsWithVisibility(
   });
 }
 
-interface getNextVisibleTabIndexParams {
+interface getVisibleTabIndexParams {
+  direction: 'next' | 'previous';
   tabs: Tabs;
   currentTabIndex: number;
   enableWhenIsActivated: boolean;
@@ -168,9 +169,15 @@ interface getNextVisibleTabIndexParams {
  *
  * @author Sean Fong
  */
-export function getNextVisibleTabIndex(params: getNextVisibleTabIndexParams): number {
-  const { tabs, currentTabIndex, enableWhenIsActivated, enableWhenItems, enableWhenExpressions } =
-    params;
+export function getVisibleTabIndex(params: getVisibleTabIndexParams): number {
+  const {
+    direction,
+    tabs,
+    currentTabIndex,
+    enableWhenIsActivated,
+    enableWhenItems,
+    enableWhenExpressions
+  } = params;
 
   const tabsWithVisibility = constructTabsWithVisibility({
     tabs,
@@ -179,16 +186,28 @@ export function getNextVisibleTabIndex(params: getNextVisibleTabIndexParams): nu
     enableWhenExpressions
   });
 
-  let nextTabIndex = currentTabIndex + 1;
-  const nextTabIndexIsVisible = false;
-  while (!nextTabIndexIsVisible) {
-    if (tabsWithVisibility[nextTabIndex].isVisible) {
-      return nextTabIndex;
+  let visibleTabIndex;
+  if (direction === 'next') {
+    visibleTabIndex = currentTabIndex + 1;
+    const nextTabIndexIsVisible = false;
+    while (!nextTabIndexIsVisible) {
+      if (tabsWithVisibility[visibleTabIndex].isVisible) {
+        return visibleTabIndex;
+      }
+      visibleTabIndex++;
+    }
+  } else {
+    visibleTabIndex = currentTabIndex - 1;
+    const previousTabIndexIsVisible = false;
+    while (!previousTabIndexIsVisible) {
+      if (tabsWithVisibility[visibleTabIndex].isVisible) {
+        return visibleTabIndex;
+      }
+      visibleTabIndex--;
     }
-    nextTabIndex++;
   }
 
-  return nextTabIndex;
+  return visibleTabIndex;
 }
 
 /**