@aehrc/smart-forms-renderer 0.16.2 → 0.17.0

package/src/components/FormComponents/TextItem/TextItem.tsx

@@ -33,6 +33,7 @@ import useStringCalculatedExpression from '../../../hooks/useStringCalculatedExp
 import ItemFieldGrid from '../ItemParts/ItemFieldGrid';
 import useStringInput from '../../../hooks/useStringInput';
 import useReadOnly from '../../../hooks/useReadOnly';
+import { useQuestionnaireStore } from '../../../stores';
 
 interface TextItemProps
   extends PropsWithQrItemChangeHandler,
@@ -45,6 +46,8 @@ interface TextItemProps
 function TextItem(props: TextItemProps) {
   const { qItem, qrItem, isRepeated, parentIsReadOnly, onQrItemChange } = props;
 
+  const onFocusLinkId = useQuestionnaireStore.use.onFocusLinkId();
+
   const readOnly = useReadOnly(qItem, parentIsReadOnly);
   const { displayUnit, displayPrompt, entryFormat, regexValidation, minLength, maxLength } =
     useRenderingExtensions(qItem);
@@ -104,7 +107,10 @@ function TextItem(props: TextItemProps) {
     );
   }
   return (
-    <FullWidthFormComponentBox data-test="q-item-text-box" data-linkid={qItem.linkId}>
+    <FullWidthFormComponentBox
+      data-test="q-item-text-box"
+      data-linkid={qItem.linkId}
+      onClick={() => onFocusLinkId(qItem.linkId)}>
       <ItemFieldGrid qItem={qItem} readOnly={readOnly}>
         <TextField
           linkId={qItem.linkId}

package/src/components/FormComponents/TimeItem/TimeItem.tsx

@@ -31,6 +31,7 @@ import type { Dayjs } from 'dayjs';
 import dayjs from 'dayjs';
 import ItemFieldGrid from '../ItemParts/ItemFieldGrid';
 import useReadOnly from '../../../hooks/useReadOnly';
+import { useQuestionnaireStore } from '../../../stores';
 
 interface TimeItemProps
   extends PropsWithQrItemChangeHandler,
@@ -44,6 +45,8 @@ interface TimeItemProps
 function TimeItem(props: TimeItemProps) {
   const { qItem, qrItem, isRepeated, isTabled, parentIsReadOnly, onQrItemChange } = props;
 
+  const onFocusLinkId = useQuestionnaireStore.use.onFocusLinkId();
+
   const readOnly = useReadOnly(qItem, parentIsReadOnly);
   const { displayPrompt, entryFormat } = useRenderingExtensions(qItem);
 
@@ -78,7 +81,10 @@ function TimeItem(props: TimeItemProps) {
   }
 
   return (
-    <FullWidthFormComponentBox data-test="q-item-time-box" data-linkid={qItem.linkId}>
+    <FullWidthFormComponentBox
+      data-test="q-item-time-box"
+      data-linkid={qItem.linkId}
+      onClick={() => onFocusLinkId(qItem.linkId)}>
       <ItemFieldGrid qItem={qItem} readOnly={readOnly}>
         <TimeField
           value={timeDayJs}

package/src/components/FormComponents/UrlItem/UrlItem.tsx

@@ -32,6 +32,7 @@ import { FullWidthFormComponentBox } from '../../Box.styles';
 import UrlField from './UrlField';
 import ItemFieldGrid from '../ItemParts/ItemFieldGrid';
 import useReadOnly from '../../../hooks/useReadOnly';
+import { useQuestionnaireStore } from '../../../stores';
 
 interface UrlItemProps
   extends PropsWithQrItemChangeHandler,
@@ -44,6 +45,8 @@ interface UrlItemProps
 function UrlItem(props: UrlItemProps) {
   const { qItem, qrItem, isRepeated, isTabled, parentIsReadOnly, onQrItemChange } = props;
 
+  const onFocusLinkId = useQuestionnaireStore.use.onFocusLinkId();
+
   const readOnly = useReadOnly(qItem, parentIsReadOnly);
   const { displayUnit, displayPrompt, entryFormat, regexValidation, minLength, maxLength } =
     useRenderingExtensions(qItem);
@@ -93,7 +96,10 @@ function UrlItem(props: UrlItemProps) {
     );
   }
   return (
-    <FullWidthFormComponentBox data-test="q-item-string-box" data-linkid={qItem.linkId}>
+    <FullWidthFormComponentBox
+      data-test="q-item-string-box"
+      data-linkid={qItem.linkId}
+      onClick={() => onFocusLinkId(qItem.linkId)}>
       <ItemFieldGrid qItem={qItem} readOnly={readOnly}>
         <UrlField
           linkId={qItem.linkId}

package/src/stores/questionnaireStore.ts

@@ -58,6 +58,7 @@ interface QuestionnaireStoreType {
   processedValueSetUrls: Record<string, string>;
   cachedValueSetCodings: Record<string, Coding[]>;
   fhirPathContext: Record<string, any>;
+  focusedLinkId: string;
   readOnly: boolean;
   buildSourceQuestionnaire: (
     questionnaire: Questionnaire,
@@ -77,6 +78,7 @@ interface QuestionnaireStoreType {
     populatedResponse: QuestionnaireResponse,
     persistTabIndex?: boolean
   ) => QuestionnaireResponse;
+  onFocusLinkId: (linkId: string) => void;
 }
 
 export const questionnaireStore = createStore<QuestionnaireStoreType>()((set, get) => ({
@@ -96,6 +98,7 @@ export const questionnaireStore = createStore<QuestionnaireStoreType>()((set, ge
   processedValueSetUrls: {},
   cachedValueSetCodings: {},
   fhirPathContext: {},
+  focusedLinkId: '',
   readOnly: false,
   buildSourceQuestionnaire: async (
     questionnaire,
@@ -269,7 +272,11 @@ export const questionnaireStore = createStore<QuestionnaireStoreType>()((set, ge
     }));
 
     return updatedResponse;
-  }
+  },
+  onFocusLinkId: (linkId: string) =>
+    set(() => ({
+      focusedLinkId: linkId
+    }))
 }));
 
 export const useQuestionnaireStore = createSelectors(questionnaireStore);

package/src/utils/fhirpath.ts

@@ -90,11 +90,14 @@ export function createFhirPathContext(
   variablesFhirPath: Record<string, Expression[]>,
   existingFhirPathContext: Record<string, any>
 ): Record<string, any> {
-  let fhirPathContext: Record<string, any> = { resource: questionnaireResponse };
+  let fhirPathContext = {};
   if (Object.keys(existingFhirPathContext).length > 0) {
     fhirPathContext = { ...fhirPathContext, ...existingFhirPathContext };
   }
 
+  // Add latest resource to fhirPathContext
+  fhirPathContext = { ...fhirPathContext, resource: questionnaireResponse };
+
   if (!questionnaireResponse.item || questionnaireResponse.item.length === 0) {
     return fhirPathContext;
   }