@aehrc/smart-forms-renderer 0.27.3 → 0.28.0

package/src/hooks/useNextAndPreviousVisibleTabs.ts

@@ -0,0 +1,86 @@
+/*
+ * 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 { useQuestionnaireStore } from '../stores';
+import type { Tabs } from '../interfaces/tab.interface';
+import { constructTabsWithVisibility } from '../utils/tabs';
+
+function useNextAndPreviousVisibleTabs(
+  currentTabIndex?: number,
+  tabs?: Tabs
+): { previousTabIndex: number | null; nextTabIndex: number | null; numOfVisibleTabs: number } {
+  const enableWhenIsActivated = useQuestionnaireStore.use.enableWhenIsActivated();
+  const enableWhenItems = useQuestionnaireStore.use.enableWhenItems();
+  const enableWhenExpressions = useQuestionnaireStore.use.enableWhenExpressions();
+
+  const tabsNotDefined = currentTabIndex === undefined || tabs === undefined;
+
+  if (tabsNotDefined) {
+    return { previousTabIndex: null, nextTabIndex: null, numOfVisibleTabs: 0 };
+  }
+
+  const tabsWithVisibility = constructTabsWithVisibility({
+    tabs,
+    enableWhenIsActivated,
+    enableWhenItems,
+    enableWhenExpressions
+  });
+
+  return {
+    previousTabIndex: getPreviousTabIndex(currentTabIndex, tabsWithVisibility),
+    nextTabIndex: getNextTabIndex(currentTabIndex, tabsWithVisibility),
+    numOfVisibleTabs: tabsWithVisibility.filter((tab) => tab.isVisible).length
+  };
+}
+
+function getPreviousTabIndex(
+  currentTabIndex: number,
+  tabsWithVisibility: { linkId: string; isVisible: boolean }[]
+): number | null {
+  const previousTabs = tabsWithVisibility.slice(0, currentTabIndex);
+  const foundIndex = previousTabs.reverse().findIndex((tab) => tab.isVisible);
+
+  // Previous visible tab not found
+  if (foundIndex === -1) {
+    return null;
+  }
+
+  // Previous visible tab less than 0
+  const previousTabIndex = currentTabIndex - foundIndex - 1;
+  if (previousTabIndex < 0) {
+    return null;
+  }
+
+  return previousTabIndex;
+}
+
+function getNextTabIndex(
+  currentTabIndex: number,
+  tabsWithVisibility: { linkId: string; isVisible: boolean }[]
+): number | null {
+  const subsequentTabs = tabsWithVisibility.slice(currentTabIndex + 1);
+  const foundIndex = subsequentTabs.findIndex((tab) => tab.isVisible);
+
+  // Next visible tab not found, something is wrong
+  if (foundIndex === -1) {
+    return null;
+  }
+
+  return currentTabIndex + foundIndex + 1;
+}
+
+export default useNextAndPreviousVisibleTabs;

package/src/hooks/useOpenLabel.ts

@@ -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 { getOldOpenLabelAnswer } from '../utils/openChoice';
+import { useState } from 'react';
+import type { QuestionnaireItemAnswerOption, QuestionnaireResponseItemAnswer } from 'fhir/r4';
+
+function useOpenLabel(
+  options: QuestionnaireItemAnswerOption[],
+  answers: QuestionnaireResponseItemAnswer[]
+) {
+  let initialOpenLabelValue = '';
+  let initialOpenLabelChecked = false;
+
+  if (options.length > 0) {
+    const oldLabelAnswer = getOldOpenLabelAnswer(answers, options);
+    if (oldLabelAnswer && oldLabelAnswer.valueString) {
+      initialOpenLabelValue = oldLabelAnswer.valueString;
+      initialOpenLabelChecked = true;
+    }
+  }
+
+  const [openLabelValue, setOpenLabelValue] = useState(initialOpenLabelValue);
+  const [openLabelChecked, setOpenLabelChecked] = useState(initialOpenLabelChecked);
+
+  return { openLabelValue, setOpenLabelValue, openLabelChecked, setOpenLabelChecked };
+}
+
+export default useOpenLabel;

package/src/hooks/useValidationFeedback.ts

@@ -70,7 +70,7 @@ function useValidationFeedback(qItem: QuestionnaireItem, input: string): string
     return `Input is lower than the expected minimum value of ${minValue}.`;
   }
 
-  // Test min value
+  // Test max value
   if (
     invalidType === ValidationResult.maxValue &&
     (typeof maxValue === 'string' || typeof maxValue === 'number')

package/src/index.ts

@@ -1,6 +1,5 @@
 import { questionnaireResponseStore, questionnaireStore } from './stores';
 import type { Questionnaire, QuestionnaireResponse } from 'fhir/r4';
-import { initialiseQuestionnaireResponse } from './utils/initialise';
 import { removeEmptyAnswers } from './utils/removeEmptyAnswers';
 import type { ItemToRepopulate } from './utils/repopulateItems';
 import { getItemsToRepopulate } from './utils/repopulateItems';
@@ -13,26 +12,6 @@ export * from './utils';
 export * from './interfaces';
 export type { ItemToRepopulate };
 
-/**
- * Build the form with an initial Questionnaire and an optional filled QuestionnaireResponse.
- * If a QuestionnaireResponse is not provided, an empty QuestionnaireResponse is set as the initial QuestionnaireResponse.
- *
- * @author Sean Fong
- */
-export async function buildForm(
-  questionnaire: Questionnaire,
-  questionnaireResponse?: QuestionnaireResponse
-): Promise<void> {
-  await questionnaireStore.getState().buildSourceQuestionnaire(questionnaire);
-
-  const initialisedQuestionnaireResponse = initialiseQuestionnaireResponse(
-    questionnaire,
-    questionnaireResponse
-  );
-  questionnaireResponseStore.getState().buildSourceResponse(initialisedQuestionnaireResponse);
-  questionnaireStore.getState().updatePopulatedProperties(initialisedQuestionnaireResponse);
-}
-
 /**
  * Destroy the form to clean up the questionnaire and questionnaireResponse stores.
  *

package/src/stories/BuildFormWrapper.tsx

@@ -0,0 +1,57 @@
+/*
+ * 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, { useLayoutEffect, useState } from 'react';
+import type { Questionnaire, QuestionnaireResponse } from 'fhir/r4';
+import { BaseRenderer } from '../components';
+import { QueryClientProvider } from '@tanstack/react-query';
+import ThemeProvider from '../theme/Theme';
+import useQueryClient from '../hooks/useQueryClient';
+import { buildForm } from '../utils';
+
+interface BuildFormWrapperProps {
+  questionnaire: Questionnaire;
+  questionnaireResponse?: QuestionnaireResponse;
+}
+
+function BuildFormWrapper(props: BuildFormWrapperProps) {
+  const { questionnaire, questionnaireResponse } = props;
+
+  const [isLoading, setIsLoading] = useState(true);
+
+  useLayoutEffect(() => {
+    buildForm(questionnaire, questionnaireResponse).then(() => {
+      setIsLoading(false);
+    });
+  }, [questionnaire, questionnaireResponse]);
+
+  const queryClient = useQueryClient();
+
+  if (isLoading) {
+    return <div>Loading...</div>;
+  }
+
+  return (
+    <ThemeProvider>
+      <QueryClientProvider client={queryClient}>
+        <BaseRenderer />
+      </QueryClientProvider>
+    </ThemeProvider>
+  );
+}
+
+export default BuildFormWrapper;

package/src/stories/assets/questionnaires/QAdvancedAdditionalDisplayContent.ts

@@ -0,0 +1,113 @@
+import type { Questionnaire } from 'fhir/r4';
+
+export const qEntryFormat: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'EntryFormat',
+  name: 'EntryFormat',
+  title: 'Entry Format',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-01',
+  url: 'https://smartforms.csiro.au/docs/advanced/additional-display/entry-format',
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/entryFormat',
+          valueString: '####'
+        }
+      ],
+      linkId: 'postcode',
+      definition: 'http://hl7.org.au/fhir/StructureDefinition/au-address#Address.postalCode',
+      text: 'Postcode',
+      type: 'string',
+      repeats: false
+    }
+  ]
+};
+
+export const qShortText: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'ShortText',
+  name: 'ShortText',
+  title: 'Short Text',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-01',
+  url: 'https://smartforms.csiro.au/docs/advanced/additional-display/short-text',
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+          valueCodeableConcept: {
+            coding: [
+              {
+                system: 'http://hl7.org/fhir/questionnaire-item-control',
+                version: '1.0.0',
+                code: 'tab-container'
+              }
+            ]
+          }
+        }
+      ],
+      linkId: 'tab-container',
+      type: 'group',
+      repeats: false,
+      item: [
+        {
+          extension: [
+            {
+              url: 'http://hl7.org/fhir/uv/sdc/StructureDefinition/sdc-questionnaire-shortText',
+              valueString: 'Regular medications'
+            }
+          ],
+          linkId: 'tab-regular-medications',
+          text: 'Regular medications: check if still required, appropriate dose, understanding of medication and adherence',
+          type: 'group',
+          repeats: false,
+          item: [
+            {
+              linkId: 'highlight-short-text',
+              text: 'Notice the short text is used in the tab. The group title still displays the full text.',
+              type: 'display',
+              repeats: false
+            }
+          ]
+        }
+      ]
+    }
+  ]
+};
+
+export const qQuestionnaireUnit: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'QuestionnaireUnit',
+  name: 'QuestionnaireUnit',
+  title: 'Questionnaire Unit',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-01',
+  url: 'https://smartforms.csiro.au/docs/advanced/additional-display/questionnaire-unit',
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-unit',
+          valueCoding: {
+            system: 'http://unitsofmeasure.org',
+            code: 'cm',
+            display: 'cm'
+          }
+        }
+      ],
+      linkId: 'height',
+      text: 'Height',
+      type: 'decimal',
+      repeats: false
+    }
+  ]
+};

package/src/stories/assets/questionnaires/QAdvancedControlAppearance.ts

@@ -0,0 +1,294 @@
+/*
+ * 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 type { Questionnaire } from 'fhir/r4';
+
+export const qItemControl: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'ItemControl',
+  name: 'ItemControl',
+  title: 'Item Control',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-01',
+  url: 'https://smartforms.csiro.au/docs/advanced/text/item-control',
+  item: [
+    {
+      linkId: 'item-control-instructions',
+      _text: {
+        extension: [
+          {
+            url: 'http://hl7.org/fhir/StructureDefinition/rendering-xhtml',
+            valueString:
+              '<div xmlns="http://www.w3.org/1999/xhtml">\r\n    <p style="font-size:0.875em"> Please refer to the respective itemControl sections for group, display and question items.</p></div>'
+          }
+        ]
+      },
+      text: 'Please refer to the respective itemControl sections for group, display and question items.',
+      type: 'display',
+      repeats: false
+    }
+  ]
+};
+
+export const qChoiceOrientation: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'ChoiceOrientation',
+  name: 'ChoiceOrientation',
+  title: 'Choice Orientation',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-08',
+  url: 'https://smartforms.csiro.au/docs/advanced/text/choice-orientation',
+  contained: [
+    {
+      resourceType: 'ValueSet',
+      id: 'administrative-gender',
+      meta: {
+        profile: ['http://hl7.org/fhir/StructureDefinition/shareablevalueset']
+      },
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/structuredefinition-wg',
+          valueCode: 'pa'
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/structuredefinition-standards-status',
+          valueCode: 'normative'
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/structuredefinition-fmm',
+          valueInteger: 5
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/structuredefinition-normative-version',
+          valueCode: '4.0.0'
+        }
+      ],
+      url: 'http://hl7.org/fhir/ValueSet/administrative-gender',
+      identifier: [
+        {
+          system: 'urn:ietf:rfc:3986',
+          value: 'urn:oid:2.16.840.1.113883.4.642.3.1'
+        }
+      ],
+      version: '4.0.1',
+      name: 'AdministrativeGender',
+      title: 'AdministrativeGender',
+      status: 'active',
+      experimental: false,
+      date: '2019-11-01T09:29:23+11:00',
+      publisher: 'HL7 (FHIR Project)',
+      contact: [
+        {
+          telecom: [
+            {
+              system: 'url',
+              value: 'http://hl7.org/fhir'
+            },
+            {
+              system: 'email',
+              value: 'fhir@lists.hl7.org'
+            }
+          ]
+        }
+      ],
+      description: 'The gender of a person used for administrative purposes.',
+      immutable: true,
+      copyright: 'Copyright © 2011+ HL7. Licensed under Creative Commons "No Rights Reserved".',
+      compose: {
+        include: [
+          {
+            system: 'http://hl7.org/fhir/administrative-gender'
+          }
+        ]
+      },
+      expansion: {
+        identifier: 'urn:uuid:50f050c9-3975-48d6-bdb7-baae4ebc70cd',
+        timestamp: '2024-04-05T12:31:27+10:00',
+        total: 4,
+        parameter: [
+          {
+            name: 'version',
+            valueUri: 'http://hl7.org/fhir/administrative-gender|4.0.1'
+          },
+          {
+            name: 'used-codesystem',
+            valueUri: 'http://hl7.org/fhir/administrative-gender|4.0.1'
+          }
+        ],
+        contains: [
+          {
+            system: 'http://hl7.org/fhir/administrative-gender',
+            code: 'female',
+            display: 'Female'
+          },
+          {
+            system: 'http://hl7.org/fhir/administrative-gender',
+            code: 'male',
+            display: 'Male'
+          },
+          {
+            system: 'http://hl7.org/fhir/administrative-gender',
+            code: 'other',
+            display: 'Other'
+          },
+          {
+            system: 'http://hl7.org/fhir/administrative-gender',
+            code: 'unknown',
+            display: 'Unknown'
+          }
+        ]
+      }
+    }
+  ],
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-choiceOrientation',
+          valueCode: 'vertical'
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+          valueCodeableConcept: {
+            coding: [
+              {
+                system: 'http://hl7.org/fhir/questionnaire-item-control',
+                code: 'radio-button'
+              }
+            ]
+          }
+        }
+      ],
+      linkId: 'administrative-gender-vertical',
+      text: 'Administrative gender (vertical)',
+      type: 'choice',
+      repeats: false,
+      answerValueSet: '#administrative-gender'
+    },
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-choiceOrientation',
+          valueCode: 'horizontal'
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+          valueCodeableConcept: {
+            coding: [
+              {
+                system: 'http://hl7.org/fhir/questionnaire-item-control',
+                code: 'radio-button'
+              }
+            ]
+          }
+        }
+      ],
+      linkId: 'administrative-gender-horizontal',
+      text: 'Administrative gender (horizontal)',
+      type: 'choice',
+      repeats: false,
+      answerValueSet: '#administrative-gender'
+    }
+  ]
+};
+
+export const qSliderStepValue: Questionnaire = {
+  resourceType: 'Questionnaire',
+  id: 'SliderStepValue',
+  name: 'SliderStepValue',
+  title: 'Slider Step Value',
+  version: '0.1.0',
+  status: 'draft',
+  publisher: 'AEHRC CSIRO',
+  date: '2024-05-08',
+  url: 'https://smartforms.csiro.au/docs/advanced/text/slider-step-value',
+  item: [
+    {
+      extension: [
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+          valueCodeableConcept: {
+            coding: [
+              {
+                system: 'http://hl7.org/fhir/questionnaire-item-control',
+                code: 'slider'
+              }
+            ]
+          }
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-sliderStepValue',
+          valueInteger: 1
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/minValue',
+          valueInteger: 0
+        },
+        {
+          url: 'http://hl7.org/fhir/StructureDefinition/maxValue',
+          valueInteger: 10
+        }
+      ],
+      linkId: 'pain-measure',
+      text: 'Pain measure',
+      type: 'integer',
+      repeats: false,
+      item: [
+        {
+          extension: [
+            {
+              url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+              valueCodeableConcept: {
+                coding: [
+                  {
+                    system: 'http://hl7.org/fhir/questionnaire-item-control',
+                    code: 'lower'
+                  }
+                ]
+              }
+            }
+          ],
+          linkId: 'pain-measure-lower',
+          text: 'No pain',
+          type: 'display'
+        },
+        {
+          extension: [
+            {
+              url: 'http://hl7.org/fhir/StructureDefinition/questionnaire-itemControl',
+              valueCodeableConcept: {
+                coding: [
+                  {
+                    system: 'http://hl7.org/fhir/questionnaire-item-control',
+                    code: 'upper'
+                  }
+                ]
+              }
+            }
+          ],
+          linkId: 'pain-measure-upper',
+          text: 'Unbearable pain',
+          type: 'display'
+        }
+      ]
+    }
+  ]
+};