@oneblink/apps-react 8.6.0-beta.1 → 8.6.0-beta.10

package/dist/components/renderer/PageFormElements.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageFormElements.js","sourceRoot":"","sources":["../../../src/components/renderer/PageFormElements.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport OneBlinkFormElements from './OneBlinkFormElements'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport {\n  FormElementLookupHandler,\n  FormElementsConditionallyShown,\n  FormElementsValidation,\n  NestedFormElementValueChangeHandler,\n  SetFormSubmission,\n  UpdateFormElementsHandler,\n} from '../../types/form'\nimport { IsPageVisibleProvider } from '../../hooks/useIsPageVisible'\n\nexport type Props = {\n  formId: number\n  isActive: boolean\n  pageElement: FormTypes.PageElement\n  displayValidationMessages: boolean\n  model: SubmissionTypes.S3SubmissionData['submission']\n  formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n  formElementsValidation: FormElementsValidation | undefined\n  collapsedSectionIds: string[]\n  onChange: NestedFormElementValueChangeHandler\n  setFormSubmission: SetFormSubmission\n}\n\nfunction PageFormElements({\n  formId,\n  isActive,\n  pageElement,\n  model,\n  displayValidationMessages,\n  formElementsConditionallyShown,\n  formElementsValidation,\n  collapsedSectionIds,\n  onChange,\n  setFormSubmission,\n}: Props) {\n  const handleLookup = React.useCallback<FormElementLookupHandler>(\n    (mergeLookupResults) => {\n      setFormSubmission((currentFormSubmission) => {\n        if (pageElement.id === formId.toString()) {\n          const { submission, elements, executedLookups } = mergeLookupResults({\n            elements: currentFormSubmission.definition.elements,\n            submission: currentFormSubmission.submission,\n            lastElementUpdated: currentFormSubmission.lastElementUpdated,\n            executedLookups: currentFormSubmission.executedLookups,\n            collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n          })\n\n          return {\n            submission,\n            definition: {\n              ...currentFormSubmission.definition,\n              elements: elements,\n            },\n            lastElementUpdated: currentFormSubmission.lastElementUpdated,\n            executedLookups,\n            collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n          }\n        }\n\n        return currentFormSubmission.definition.elements.reduce<\n          typeof currentFormSubmission\n        >(\n          (memo: typeof currentFormSubmission, formElement) => {\n            if (\n              formElement.id === pageElement.id &&\n              formElement.type === 'page'\n            ) {\n              const { submission, executedLookups, elements } =\n                mergeLookupResults({\n                  elements: formElement.elements,\n                  submission: currentFormSubmission.submission,\n                  lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                  executedLookups: currentFormSubmission.executedLookups,\n                  collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n                })\n              memo.submission = submission\n              memo.executedLookups = executedLookups\n              memo.definition.elements.push({\n                ...formElement,\n                elements,\n              })\n            } else {\n              memo.definition.elements.push(formElement)\n            }\n\n            return memo\n          },\n          {\n            ...currentFormSubmission,\n            definition: {\n              ...currentFormSubmission.definition,\n              elements: [],\n            },\n          },\n        )\n      })\n    },\n    [formId, pageElement.id, setFormSubmission],\n  )\n\n  const form = useFormDefinition()\n\n  const handleUpdateFormElements = React.useCallback<UpdateFormElementsHandler>(\n    (updateFormElements) => {\n      setFormSubmission((currentFormSubmission) => {\n        const definition = {\n          ...currentFormSubmission.definition,\n        }\n\n        if (pageElement.id === formId.toString()) {\n          definition.elements = updateFormElements(\n            currentFormSubmission.definition.elements,\n          )\n        } else {\n          definition.elements = currentFormSubmission.definition.elements.map(\n            (formElement) => {\n              if (\n                formElement.id === pageElement.id &&\n                formElement.type === 'page'\n              ) {\n                return {\n                  ...formElement,\n                  elements: updateFormElements(formElement.elements),\n                }\n              } else {\n                return formElement\n              }\n            },\n          )\n        }\n\n        return {\n          ...currentFormSubmission,\n          definition,\n        }\n      })\n    },\n    [formId, pageElement.id, setFormSubmission],\n  )\n\n  return (\n    <IsPageVisibleProvider isPageVisible={isActive}>\n      <div>\n        <div\n          id={pageElement.id}\n          key={pageElement.id}\n          className={clsx('ob-page step-content is-active cypress-page', {\n            'is-invisible': !isActive,\n          })}\n          aria-labelledby={`steps-navigation-step-label-${pageElement.id}`}\n          role=\"region\"\n        >\n          <OneBlinkFormElements\n            formId={formId}\n            model={model}\n            parentElement={form}\n            formElementsConditionallyShown={formElementsConditionallyShown}\n            formElementsValidation={formElementsValidation}\n            displayValidationMessages={displayValidationMessages}\n            elements={pageElement.elements}\n            onChange={onChange}\n            onLookup={handleLookup}\n            onUpdateFormElements={handleUpdateFormElements}\n            idPrefix=\"\"\n            collapsedSectionIds={collapsedSectionIds}\n          />\n        </div>\n      </div>\n    </IsPageVisibleProvider>\n  )\n}\n\nexport default React.memo(PageFormElements)\n"]}
+{"version":3,"file":"PageFormElements.js","sourceRoot":"","sources":["../../../src/components/renderer/PageFormElements.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport OneBlinkFormElements from './OneBlinkFormElements'\nimport useFormDefinition from '../../hooks/useFormDefinition'\nimport {\n  FormElementLookupHandler,\n  FormElementsConditionallyShown,\n  FormElementsValidation,\n  NestedFormElementValueChangeHandler,\n  SetFormSubmission,\n  UpdateFormElementsHandler,\n  SectionState,\n} from '../../types/form'\nimport { IsPageVisibleProvider } from '../../hooks/useIsPageVisible'\n\nexport type Props = {\n  formId: number\n  isActive: boolean\n  pageElement: FormTypes.PageElement\n  displayValidationMessages: boolean\n  model: SubmissionTypes.S3SubmissionData['submission']\n  formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n  formElementsValidation: FormElementsValidation | undefined\n  sectionState?: SectionState\n  onChange: NestedFormElementValueChangeHandler\n  setFormSubmission: SetFormSubmission\n}\n\nfunction PageFormElements({\n  formId,\n  isActive,\n  pageElement,\n  model,\n  displayValidationMessages,\n  formElementsConditionallyShown,\n  formElementsValidation,\n  sectionState,\n  onChange,\n  setFormSubmission,\n}: Props) {\n  const handleLookup = React.useCallback<FormElementLookupHandler>(\n    (mergeLookupResults) => {\n      setFormSubmission((currentFormSubmission) => {\n        if (pageElement.id === formId.toString()) {\n          const { submission, elements, executedLookups } = mergeLookupResults({\n            elements: currentFormSubmission.definition.elements,\n            submission: currentFormSubmission.submission,\n            lastElementUpdated: currentFormSubmission.lastElementUpdated,\n            executedLookups: currentFormSubmission.executedLookups,\n            sectionState: currentFormSubmission.sectionState,\n          })\n\n          return {\n            submission,\n            definition: {\n              ...currentFormSubmission.definition,\n              elements: elements,\n            },\n            lastElementUpdated: currentFormSubmission.lastElementUpdated,\n            executedLookups,\n            sectionState: currentFormSubmission.sectionState,\n          }\n        }\n\n        return currentFormSubmission.definition.elements.reduce<\n          typeof currentFormSubmission\n        >(\n          (memo: typeof currentFormSubmission, formElement) => {\n            if (\n              formElement.id === pageElement.id &&\n              formElement.type === 'page'\n            ) {\n              const { submission, executedLookups, elements } =\n                mergeLookupResults({\n                  elements: formElement.elements,\n                  submission: currentFormSubmission.submission,\n                  lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                  executedLookups: currentFormSubmission.executedLookups,\n                  sectionState: currentFormSubmission.sectionState,\n                })\n              memo.submission = submission\n              memo.executedLookups = executedLookups\n              memo.definition.elements.push({\n                ...formElement,\n                elements,\n              })\n            } else {\n              memo.definition.elements.push(formElement)\n            }\n\n            return memo\n          },\n          {\n            ...currentFormSubmission,\n            definition: {\n              ...currentFormSubmission.definition,\n              elements: [],\n            },\n          },\n        )\n      })\n    },\n    [formId, pageElement.id, setFormSubmission],\n  )\n\n  const form = useFormDefinition()\n\n  const handleUpdateFormElements = React.useCallback<UpdateFormElementsHandler>(\n    (updateFormElements) => {\n      setFormSubmission((currentFormSubmission) => {\n        const definition = {\n          ...currentFormSubmission.definition,\n        }\n\n        if (pageElement.id === formId.toString()) {\n          definition.elements = updateFormElements(\n            currentFormSubmission.definition.elements,\n          )\n        } else {\n          definition.elements = currentFormSubmission.definition.elements.map(\n            (formElement) => {\n              if (\n                formElement.id === pageElement.id &&\n                formElement.type === 'page'\n              ) {\n                return {\n                  ...formElement,\n                  elements: updateFormElements(formElement.elements),\n                }\n              } else {\n                return formElement\n              }\n            },\n          )\n        }\n\n        return {\n          ...currentFormSubmission,\n          definition,\n        }\n      })\n    },\n    [formId, pageElement.id, setFormSubmission],\n  )\n\n  return (\n    <IsPageVisibleProvider isPageVisible={isActive}>\n      <div>\n        <div\n          id={pageElement.id}\n          key={pageElement.id}\n          className={clsx('ob-page step-content is-active cypress-page', {\n            'is-invisible': !isActive,\n          })}\n          aria-labelledby={`steps-navigation-step-label-${pageElement.id}`}\n          role=\"region\"\n        >\n          <OneBlinkFormElements\n            formId={formId}\n            model={model}\n            parentElement={form}\n            formElementsConditionallyShown={formElementsConditionallyShown}\n            formElementsValidation={formElementsValidation}\n            displayValidationMessages={displayValidationMessages}\n            elements={pageElement.elements}\n            onChange={onChange}\n            onLookup={handleLookup}\n            onUpdateFormElements={handleUpdateFormElements}\n            idPrefix=\"\"\n            sectionState={sectionState}\n          />\n        </div>\n      </div>\n    </IsPageVisibleProvider>\n  )\n}\n\nexport default React.memo(PageFormElements)\n"]}

package/dist/form-elements/FormElementForm.d.ts

@@ -1,6 +1,6 @@
 import { FormTypes, SubmissionTypes } from '@oneblink/types';
 import * as React from 'react';
-import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, UpdateFormElementsHandler } from '../types/form';
+import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, SectionState, UpdateFormElementsHandler } from '../types/form';
 export type Props = {
     formId: number;
     id: string;
@@ -12,7 +12,8 @@ export type Props = {
     displayValidationMessages: boolean;
     formElementConditionallyShown: FormElementConditionallyShown | undefined;
     onUpdateFormElements: UpdateFormElementsHandler;
+    sectionState: SectionState;
 };
-declare function FormElementForm({ formId, element, value, id, formElementValidation, displayValidationMessages, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, }: Props): React.JSX.Element;
+declare function FormElementForm({ formId, element, value, id, formElementValidation, displayValidationMessages, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, sectionState, }: Props): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof FormElementForm>;
 export default _default;

package/dist/form-elements/FormElementForm.js

@@ -1,8 +1,15 @@
 import * as React from 'react';
 import OneBlinkFormElements from '../components/renderer/OneBlinkFormElements';
 import ElementDOMId from '../utils/elementDOMIds';
-function FormElementForm({ formId, element, value, id, formElementValidation, displayValidationMessages, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, }) {
-    const handleNestedChange = React.useCallback((nestedElement, { value: nestedElementValue, executedLookups: nestedExecutedLookups, }) => {
+function FormElementForm({ formId, element, value, id, formElementValidation, displayValidationMessages, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, sectionState, }) {
+    const handleNestedChange = React.useCallback((nestedElement, { value: nestedElementValue, executedLookups: nestedExecutedLookups, sectionState, }, idPrefix) => {
+        if (nestedElement.type === 'section') {
+            // trigger onChange to update sectionState
+            onChange({
+                ...nestedElement,
+                id: idPrefix ? `${idPrefix}${nestedElement.id}` : nestedElement.id,
+            }, { executedLookups: undefined, sectionState });
+        }
         if (!('name' in nestedElement))
             return;
         onChange(element, {
@@ -24,6 +31,7 @@ function FormElementForm({ formId, element, value, id, formElementValidation, di
                         : nestedExecutedLookups,
                 };
             },
+            sectionState,
         });
     }, [element, onChange]);
     const handleLookup = React.useCallback((mergeLookupResults) => {
@@ -40,7 +48,7 @@ function FormElementForm({ formId, element, value, id, formElementValidation, di
                         submission: model,
                         lastElementUpdated: currentFormSubmission.lastElementUpdated,
                         executedLookups: newExecutedLookups,
-                        collapsedSectionIds: currentFormSubmission.collapsedSectionIds,
+                        sectionState: currentFormSubmission.sectionState,
                     });
                     model = submission;
                     newExecutedLookups = executedLookups;
@@ -63,7 +71,7 @@ function FormElementForm({ formId, element, value, id, formElementValidation, di
                     ...currentFormSubmission.executedLookups,
                     [element.name]: newExecutedLookups,
                 },
-                collapsedSectionIds: currentFormSubmission.collapsedSectionIds,
+                sectionState: currentFormSubmission.sectionState,
             };
         });
     }, [element.name, onLookup]);
@@ -101,7 +109,7 @@ function FormElementForm({ formId, element, value, id, formElementValidation, di
         });
     }, [element.id, onUpdateFormElements]);
     const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id]);
-    return (React.createElement(OneBlinkFormElements, { formId: formId, formElementsValidation: validation, displayValidationMessages: displayValidationMessages, elements: parentElement.elements, onChange: handleNestedChange, onLookup: handleLookup, formElementsConditionallyShown: formElementsConditionallyShown, model: value || {}, parentElement: parentElement, idPrefix: elementDOMId.subFormDOMIdPrefix, onUpdateFormElements: handleUpdateNestedFormElements }));
+    return (React.createElement(OneBlinkFormElements, { formId: formId, formElementsValidation: validation, displayValidationMessages: displayValidationMessages, elements: parentElement.elements, onChange: handleNestedChange, onLookup: handleLookup, formElementsConditionallyShown: formElementsConditionallyShown, model: value || {}, parentElement: parentElement, idPrefix: elementDOMId.subFormDOMIdPrefix, onUpdateFormElements: handleUpdateNestedFormElements, sectionState: sectionState }));
 }
 export default React.memo(FormElementForm);
 //# sourceMappingURL=FormElementForm.js.map

package/dist/form-elements/FormElementForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormElementForm.js","sourceRoot":"","sources":["../../src/form-elements/FormElementForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport {\n  ExecutedLookups,\n  FormElementConditionallyShown,\n  FormElementLookupHandler,\n  FormElementValidation,\n  NestedFormElementValueChangeHandler,\n  UpdateFormElementsHandler,\n} from '../types/form'\nimport ElementDOMId from '../utils/elementDOMIds'\n\nexport type Props = {\n  formId: number\n  id: string\n  element: FormTypes.FormFormElement\n  value: SubmissionTypes.S3SubmissionData['submission'] | undefined\n  onChange: NestedFormElementValueChangeHandler<\n    SubmissionTypes.S3SubmissionData['submission']\n  >\n  onLookup: FormElementLookupHandler\n  formElementValidation: FormElementValidation | undefined\n  displayValidationMessages: boolean\n  formElementConditionallyShown: FormElementConditionallyShown | undefined\n  onUpdateFormElements: UpdateFormElementsHandler\n}\n\nfunction FormElementForm({\n  formId,\n  element,\n  value,\n  id,\n  formElementValidation,\n  displayValidationMessages,\n  formElementConditionallyShown,\n  onChange,\n  onLookup,\n  onUpdateFormElements,\n}: Props) {\n  const handleNestedChange = React.useCallback(\n    (\n      nestedElement: FormTypes.FormElement,\n      {\n        value: nestedElementValue,\n        executedLookups: nestedExecutedLookups,\n      }: Parameters<NestedFormElementValueChangeHandler>[1],\n    ) => {\n      if (!('name' in nestedElement)) return\n      onChange(element, {\n        value: (existingValue) => ({\n          ...existingValue,\n          [nestedElement.name]:\n            typeof nestedElementValue === 'function'\n              ? nestedElementValue(\n                  existingValue ? existingValue[nestedElement.name] : undefined,\n                )\n              : nestedElementValue,\n        }),\n        executedLookups: (existingExecutedLookups) => {\n          if (\n            typeof existingExecutedLookups === 'boolean' ||\n            Array.isArray(existingExecutedLookups)\n          ) {\n            return {}\n          }\n          return {\n            ...existingExecutedLookups,\n            [nestedElement.name]:\n              typeof nestedExecutedLookups === 'function'\n                ? nestedExecutedLookups(\n                    existingExecutedLookups?.[\n                      nestedElement.name\n                    ] as ExecutedLookups,\n                  )\n                : nestedExecutedLookups,\n          }\n        },\n      })\n    },\n    [element, onChange],\n  )\n\n  const handleLookup = React.useCallback<FormElementLookupHandler>(\n    (mergeLookupResults) => {\n      onLookup((currentFormSubmission) => {\n        let model = currentFormSubmission.submission[\n          element.name\n        ] as SubmissionTypes.S3SubmissionData['submission']\n        let newExecutedLookups = currentFormSubmission.executedLookups?.[\n          element.name\n        ] as ExecutedLookups\n\n        const elements = currentFormSubmission.elements.map((formElement) => {\n          if (\n            formElement.type === 'form' &&\n            formElement.name === element.name &&\n            Array.isArray(formElement.elements)\n          ) {\n            const { elements, submission, executedLookups } =\n              mergeLookupResults({\n                elements: formElement.elements,\n                submission: model,\n                lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                executedLookups: newExecutedLookups,\n                collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n              })\n            model = submission\n            newExecutedLookups = executedLookups as ExecutedLookups\n            return {\n              ...formElement,\n              elements,\n            }\n          }\n          return formElement\n        })\n\n        const submission = {\n          ...currentFormSubmission.submission,\n          [element.name]: model,\n        }\n\n        return {\n          elements,\n          submission,\n          lastElementUpdated: currentFormSubmission.lastElementUpdated,\n          executedLookups: {\n            ...currentFormSubmission.executedLookups,\n            [element.name]: newExecutedLookups,\n          },\n          collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n        }\n      })\n    },\n    [element.name, onLookup],\n  )\n\n  const validation = React.useMemo(() => {\n    return !!formElementValidation &&\n      typeof formElementValidation !== 'string' &&\n      formElementValidation.type === 'formElements'\n      ? formElementValidation.formElements\n      : undefined\n  }, [formElementValidation])\n\n  const formElementsConditionallyShown = React.useMemo(() => {\n    return formElementConditionallyShown &&\n      formElementConditionallyShown.type === 'formElements'\n      ? formElementConditionallyShown.formElements\n      : undefined\n  }, [formElementConditionallyShown])\n\n  const parentElement = React.useMemo(() => {\n    return {\n      elements: Array.isArray(element.elements) ? element.elements : [],\n    }\n  }, [element.elements])\n\n  const handleUpdateNestedFormElements =\n    React.useCallback<UpdateFormElementsHandler>(\n      (setter) => {\n        onUpdateFormElements((formElements) => {\n          return formElements.map((formElement) => {\n            if (\n              formElement.id === element.id &&\n              formElement.type === 'form' &&\n              Array.isArray(formElement.elements)\n            ) {\n              return {\n                ...formElement,\n                elements: setter(formElement.elements),\n              }\n            }\n            return formElement\n          })\n        })\n      },\n      [element.id, onUpdateFormElements],\n    )\n\n  const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n  return (\n    <OneBlinkFormElements\n      formId={formId}\n      formElementsValidation={validation}\n      displayValidationMessages={displayValidationMessages}\n      elements={parentElement.elements}\n      onChange={handleNestedChange}\n      onLookup={handleLookup}\n      formElementsConditionallyShown={formElementsConditionallyShown}\n      model={value || {}}\n      parentElement={parentElement}\n      idPrefix={elementDOMId.subFormDOMIdPrefix}\n      onUpdateFormElements={handleUpdateNestedFormElements}\n    />\n  )\n}\n\nexport default React.memo(FormElementForm)\n"]}
+{"version":3,"file":"FormElementForm.js","sourceRoot":"","sources":["../../src/form-elements/FormElementForm.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,oBAAoB,MAAM,6CAA6C,CAAA;AAU9E,OAAO,YAAY,MAAM,wBAAwB,CAAA;AAkBjD,SAAS,eAAe,CAAC,EACvB,MAAM,EACN,OAAO,EACP,KAAK,EACL,EAAE,EACF,qBAAqB,EACrB,yBAAyB,EACzB,6BAA6B,EAC7B,QAAQ,EACR,QAAQ,EACR,oBAAoB,EACpB,YAAY,GACN;IACN,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAC1C,CACE,aAAoC,EACpC,EACE,KAAK,EAAE,kBAAkB,EACzB,eAAe,EAAE,qBAAqB,EACtC,YAAY,GACuC,EACrD,QAAiB,EACjB,EAAE;QACF,IAAI,aAAa,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YACrC,0CAA0C;YAC1C,QAAQ,CACN;gBACE,GAAG,aAAa;gBAChB,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,GAAG,aAAa,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE;aACnE,EACD,EAAE,eAAe,EAAE,SAAS,EAAE,YAAY,EAAE,CAC7C,CAAA;QACH,CAAC;QACD,IAAI,CAAC,CAAC,MAAM,IAAI,aAAa,CAAC;YAAE,OAAM;QACtC,QAAQ,CAAC,OAAO,EAAE;YAChB,KAAK,EAAE,CAAC,aAAa,EAAE,EAAE,CAAC,CAAC;gBACzB,GAAG,aAAa;gBAChB,CAAC,aAAa,CAAC,IAAI,CAAC,EAClB,OAAO,kBAAkB,KAAK,UAAU;oBACtC,CAAC,CAAC,kBAAkB,CAChB,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAC9D;oBACH,CAAC,CAAC,kBAAkB;aACzB,CAAC;YACF,eAAe,EAAE,CAAC,uBAAuB,EAAE,EAAE;gBAC3C,IACE,OAAO,uBAAuB,KAAK,SAAS;oBAC5C,KAAK,CAAC,OAAO,CAAC,uBAAuB,CAAC,EACtC,CAAC;oBACD,OAAO,EAAE,CAAA;gBACX,CAAC;gBACD,OAAO;oBACL,GAAG,uBAAuB;oBAC1B,CAAC,aAAa,CAAC,IAAI,CAAC,EAClB,OAAO,qBAAqB,KAAK,UAAU;wBACzC,CAAC,CAAC,qBAAqB,CACnB,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CACrB,aAAa,CAAC,IAAI,CACA,CACrB;wBACH,CAAC,CAAC,qBAAqB;iBAC5B,CAAA;YACH,CAAC;YACD,YAAY;SACb,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,EAAE,QAAQ,CAAC,CACpB,CAAA;IAED,MAAM,YAAY,GAAG,KAAK,CAAC,WAAW,CACpC,CAAC,kBAAkB,EAAE,EAAE;QACrB,QAAQ,CAAC,CAAC,qBAAqB,EAAE,EAAE;;YACjC,IAAI,KAAK,GAAG,qBAAqB,CAAC,UAAU,CAC1C,OAAO,CAAC,IAAI,CACqC,CAAA;YACnD,IAAI,kBAAkB,GAAG,MAAA,qBAAqB,CAAC,eAAe,0CAC5D,OAAO,CAAC,IAAI,CACM,CAAA;YAEpB,MAAM,QAAQ,GAAG,qBAAqB,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE;gBAClE,IACE,WAAW,CAAC,IAAI,KAAK,MAAM;oBAC3B,WAAW,CAAC,IAAI,KAAK,OAAO,CAAC,IAAI;oBACjC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,QAAQ,CAAC,EACnC,CAAC;oBACD,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,eAAe,EAAE,GAC7C,kBAAkB,CAAC;wBACjB,QAAQ,EAAE,WAAW,CAAC,QAAQ;wBAC9B,UAAU,EAAE,KAAK;wBACjB,kBAAkB,EAAE,qBAAqB,CAAC,kBAAkB;wBAC5D,eAAe,EAAE,kBAAkB;wBACnC,YAAY,EAAE,qBAAqB,CAAC,YAAY;qBACjD,CAAC,CAAA;oBACJ,KAAK,GAAG,UAAU,CAAA;oBAClB,kBAAkB,GAAG,eAAkC,CAAA;oBACvD,OAAO;wBACL,GAAG,WAAW;wBACd,QAAQ;qBACT,CAAA;gBACH,CAAC;gBACD,OAAO,WAAW,CAAA;YACpB,CAAC,CAAC,CAAA;YAEF,MAAM,UAAU,GAAG;gBACjB,GAAG,qBAAqB,CAAC,UAAU;gBACnC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,KAAK;aACtB,CAAA;YAED,OAAO;gBACL,QAAQ;gBACR,UAAU;gBACV,kBAAkB,EAAE,qBAAqB,CAAC,kBAAkB;gBAC5D,eAAe,EAAE;oBACf,GAAG,qBAAqB,CAAC,eAAe;oBACxC,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,kBAAkB;iBACnC;gBACD,YAAY,EAAE,qBAAqB,CAAC,YAAY;aACjD,CAAA;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CACzB,CAAA;IAED,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACpC,OAAO,CAAC,CAAC,qBAAqB;YAC5B,OAAO,qBAAqB,KAAK,QAAQ;YACzC,qBAAqB,CAAC,IAAI,KAAK,cAAc;YAC7C,CAAC,CAAC,qBAAqB,CAAC,YAAY;YACpC,CAAC,CAAC,SAAS,CAAA;IACf,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,MAAM,8BAA8B,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACxD,OAAO,6BAA6B;YAClC,6BAA6B,CAAC,IAAI,KAAK,cAAc;YACrD,CAAC,CAAC,6BAA6B,CAAC,YAAY;YAC5C,CAAC,CAAC,SAAS,CAAA;IACf,CAAC,EAAE,CAAC,6BAA6B,CAAC,CAAC,CAAA;IAEnC,MAAM,aAAa,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACvC,OAAO;YACL,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE;SAClE,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEtB,MAAM,8BAA8B,GAClC,KAAK,CAAC,WAAW,CACf,CAAC,MAAM,EAAE,EAAE;QACT,oBAAoB,CAAC,CAAC,YAAY,EAAE,EAAE;YACpC,OAAO,YAAY,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE;gBACtC,IACE,WAAW,CAAC,EAAE,KAAK,OAAO,CAAC,EAAE;oBAC7B,WAAW,CAAC,IAAI,KAAK,MAAM;oBAC3B,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,QAAQ,CAAC,EACnC,CAAC;oBACD,OAAO;wBACL,GAAG,WAAW;wBACd,QAAQ,EAAE,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC;qBACvC,CAAA;gBACH,CAAC;gBACD,OAAO,WAAW,CAAA;YACpB,CAAC,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,OAAO,CAAC,EAAE,EAAE,oBAAoB,CAAC,CACnC,CAAA;IAEH,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;IAEpE,OAAO,CACL,oBAAC,oBAAoB,IACnB,MAAM,EAAE,MAAM,EACd,sBAAsB,EAAE,UAAU,EAClC,yBAAyB,EAAE,yBAAyB,EACpD,QAAQ,EAAE,aAAa,CAAC,QAAQ,EAChC,QAAQ,EAAE,kBAAkB,EAC5B,QAAQ,EAAE,YAAY,EACtB,8BAA8B,EAAE,8BAA8B,EAC9D,KAAK,EAAE,KAAK,IAAI,EAAE,EAClB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,YAAY,CAAC,kBAAkB,EACzC,oBAAoB,EAAE,8BAA8B,EACpD,YAAY,EAAE,YAAY,GAC1B,CACH,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA","sourcesContent":["import { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport * as React from 'react'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport {\n  ExecutedLookups,\n  FormElementConditionallyShown,\n  FormElementLookupHandler,\n  FormElementValidation,\n  NestedFormElementValueChangeHandler,\n  SectionState,\n  UpdateFormElementsHandler,\n} from '../types/form'\nimport ElementDOMId from '../utils/elementDOMIds'\n\nexport type Props = {\n  formId: number\n  id: string\n  element: FormTypes.FormFormElement\n  value: SubmissionTypes.S3SubmissionData['submission'] | undefined\n  onChange: NestedFormElementValueChangeHandler<\n    SubmissionTypes.S3SubmissionData['submission']\n  >\n  onLookup: FormElementLookupHandler\n  formElementValidation: FormElementValidation | undefined\n  displayValidationMessages: boolean\n  formElementConditionallyShown: FormElementConditionallyShown | undefined\n  onUpdateFormElements: UpdateFormElementsHandler\n  sectionState: SectionState\n}\n\nfunction FormElementForm({\n  formId,\n  element,\n  value,\n  id,\n  formElementValidation,\n  displayValidationMessages,\n  formElementConditionallyShown,\n  onChange,\n  onLookup,\n  onUpdateFormElements,\n  sectionState,\n}: Props) {\n  const handleNestedChange = React.useCallback(\n    (\n      nestedElement: FormTypes.FormElement,\n      {\n        value: nestedElementValue,\n        executedLookups: nestedExecutedLookups,\n        sectionState,\n      }: Parameters<NestedFormElementValueChangeHandler>[1],\n      idPrefix?: string,\n    ) => {\n      if (nestedElement.type === 'section') {\n        // trigger onChange to update sectionState\n        onChange(\n          {\n            ...nestedElement,\n            id: idPrefix ? `${idPrefix}${nestedElement.id}` : nestedElement.id,\n          },\n          { executedLookups: undefined, sectionState },\n        )\n      }\n      if (!('name' in nestedElement)) return\n      onChange(element, {\n        value: (existingValue) => ({\n          ...existingValue,\n          [nestedElement.name]:\n            typeof nestedElementValue === 'function'\n              ? nestedElementValue(\n                  existingValue ? existingValue[nestedElement.name] : undefined,\n                )\n              : nestedElementValue,\n        }),\n        executedLookups: (existingExecutedLookups) => {\n          if (\n            typeof existingExecutedLookups === 'boolean' ||\n            Array.isArray(existingExecutedLookups)\n          ) {\n            return {}\n          }\n          return {\n            ...existingExecutedLookups,\n            [nestedElement.name]:\n              typeof nestedExecutedLookups === 'function'\n                ? nestedExecutedLookups(\n                    existingExecutedLookups?.[\n                      nestedElement.name\n                    ] as ExecutedLookups,\n                  )\n                : nestedExecutedLookups,\n          }\n        },\n        sectionState,\n      })\n    },\n    [element, onChange],\n  )\n\n  const handleLookup = React.useCallback<FormElementLookupHandler>(\n    (mergeLookupResults) => {\n      onLookup((currentFormSubmission) => {\n        let model = currentFormSubmission.submission[\n          element.name\n        ] as SubmissionTypes.S3SubmissionData['submission']\n        let newExecutedLookups = currentFormSubmission.executedLookups?.[\n          element.name\n        ] as ExecutedLookups\n\n        const elements = currentFormSubmission.elements.map((formElement) => {\n          if (\n            formElement.type === 'form' &&\n            formElement.name === element.name &&\n            Array.isArray(formElement.elements)\n          ) {\n            const { elements, submission, executedLookups } =\n              mergeLookupResults({\n                elements: formElement.elements,\n                submission: model,\n                lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                executedLookups: newExecutedLookups,\n                sectionState: currentFormSubmission.sectionState,\n              })\n            model = submission\n            newExecutedLookups = executedLookups as ExecutedLookups\n            return {\n              ...formElement,\n              elements,\n            }\n          }\n          return formElement\n        })\n\n        const submission = {\n          ...currentFormSubmission.submission,\n          [element.name]: model,\n        }\n\n        return {\n          elements,\n          submission,\n          lastElementUpdated: currentFormSubmission.lastElementUpdated,\n          executedLookups: {\n            ...currentFormSubmission.executedLookups,\n            [element.name]: newExecutedLookups,\n          },\n          sectionState: currentFormSubmission.sectionState,\n        }\n      })\n    },\n    [element.name, onLookup],\n  )\n\n  const validation = React.useMemo(() => {\n    return !!formElementValidation &&\n      typeof formElementValidation !== 'string' &&\n      formElementValidation.type === 'formElements'\n      ? formElementValidation.formElements\n      : undefined\n  }, [formElementValidation])\n\n  const formElementsConditionallyShown = React.useMemo(() => {\n    return formElementConditionallyShown &&\n      formElementConditionallyShown.type === 'formElements'\n      ? formElementConditionallyShown.formElements\n      : undefined\n  }, [formElementConditionallyShown])\n\n  const parentElement = React.useMemo(() => {\n    return {\n      elements: Array.isArray(element.elements) ? element.elements : [],\n    }\n  }, [element.elements])\n\n  const handleUpdateNestedFormElements =\n    React.useCallback<UpdateFormElementsHandler>(\n      (setter) => {\n        onUpdateFormElements((formElements) => {\n          return formElements.map((formElement) => {\n            if (\n              formElement.id === element.id &&\n              formElement.type === 'form' &&\n              Array.isArray(formElement.elements)\n            ) {\n              return {\n                ...formElement,\n                elements: setter(formElement.elements),\n              }\n            }\n            return formElement\n          })\n        })\n      },\n      [element.id, onUpdateFormElements],\n    )\n\n  const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n  return (\n    <OneBlinkFormElements\n      formId={formId}\n      formElementsValidation={validation}\n      displayValidationMessages={displayValidationMessages}\n      elements={parentElement.elements}\n      onChange={handleNestedChange}\n      onLookup={handleLookup}\n      formElementsConditionallyShown={formElementsConditionallyShown}\n      model={value || {}}\n      parentElement={parentElement}\n      idPrefix={elementDOMId.subFormDOMIdPrefix}\n      onUpdateFormElements={handleUpdateNestedFormElements}\n      sectionState={sectionState}\n    />\n  )\n}\n\nexport default React.memo(FormElementForm)\n"]}

package/dist/form-elements/FormElementRepeatableSet.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { FormTypes, SubmissionTypes } from '@oneblink/types';
-import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, IsDirtyProps, UpdateFormElementsHandler } from '../types/form';
+import { FormElementConditionallyShown, FormElementLookupHandler, FormElementValidation, NestedFormElementValueChangeHandler, IsDirtyProps, UpdateFormElementsHandler, SectionState } from '../types/form';
 type Props = {
     formId: number;
     id: string;
@@ -13,8 +13,9 @@ type Props = {
     formElementValidation: FormElementValidation | undefined;
     displayValidationMessage: boolean;
     onUpdateFormElements: UpdateFormElementsHandler;
+    sectionState: SectionState;
 } & IsDirtyProps;
 export declare function useRepeatableSetIndexText(text: string): string;
-declare function FormElementRepeatableSet({ formId, element, value, formElementValidation, id, isEven, displayValidationMessage, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, isDirty, setIsDirty, }: Props): React.JSX.Element;
+declare function FormElementRepeatableSet({ formId, element, value, formElementValidation, id, isEven, displayValidationMessage, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, isDirty, setIsDirty, sectionState, }: Props): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof FormElementRepeatableSet>;
 export default _default;

package/dist/form-elements/FormElementRepeatableSet.js

@@ -12,16 +12,16 @@ import MaterialIcon from '../components/MaterialIcon';
 import ElementDOMId from '../utils/elementDOMIds';
 import { Collapse } from '@mui/material';
 const RepeatableSetIndexContext = React.createContext(0);
-function RepeatableSetEntryProvider({ index, isAnimated, onRemove, children, }) {
+function RepeatableSetEntryProvider({ index, isAnimated, element, idPrefix, onRemove, children, }) {
     const [isExpanded, setIsExpanded] = React.useState(true);
     const handleRemove = React.useCallback(() => {
         if (isAnimated) {
             setIsExpanded(false);
         }
         else {
-            onRemove(index);
+            onRemove(index, element, idPrefix);
         }
-    }, [index, isAnimated, onRemove]);
+    }, [index, isAnimated, onRemove, element, idPrefix]);
     const node = (React.createElement(RepeatableSetIndexContext.Provider, { value: index }, children({
         onRemove: handleRemove,
     })));
@@ -29,7 +29,7 @@ function RepeatableSetEntryProvider({ index, isAnimated, onRemove, children, })
         return node;
     }
     return (React.createElement(Collapse, { in: isExpanded, appear: true, onExited: () => {
-            onRemove(index);
+            onRemove(index, element, idPrefix);
         }, classes: {
             root: 'ob-repeatable-set__collapsible',
             wrapper: 'ob-repeatable-set__collapsible-wrapper',
@@ -40,7 +40,7 @@ export function useRepeatableSetIndexText(text) {
     const index = React.useContext(RepeatableSetIndexContext);
     return React.useMemo(() => text.replace('{INDEX}', (index + 1).toString()), [index, text]);
 }
-function FormElementRepeatableSet({ formId, element, value, formElementValidation, id, isEven, displayValidationMessage, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, isDirty, setIsDirty, }) {
+function FormElementRepeatableSet({ formId, element, value, formElementValidation, id, isEven, displayValidationMessage, formElementConditionallyShown, onChange, onLookup, onUpdateFormElements, isDirty, setIsDirty, sectionState, }) {
     const entries = React.useMemo(() => (Array.isArray(value) ? value : []), [value]);
     const handleAddEntry = React.useCallback((index) => {
         onChange(element, {
@@ -62,10 +62,12 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
                 newExistingExecutedLookups.push({});
                 return newExistingExecutedLookups;
             },
+            sectionState: (currentSectionState) => currentSectionState,
         });
         setIsDirty();
     }, [element, onChange, setIsDirty, entries]);
-    const handleRemoveEntry = React.useCallback((index) => {
+    const handleRemoveEntry = React.useCallback((index, element, idPrefix) => {
+        const entryIdPrefix = idPrefix || '';
         onChange(element, {
             value: (existingEntries) => {
                 const newEntries = [...(existingEntries || [])];
@@ -80,10 +82,38 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
                 newExistingExecutedLookups.splice(index, 1);
                 return newExistingExecutedLookups;
             },
+            sectionState: (currentSectionState) => {
+                return ((currentSectionState === null || currentSectionState === void 0 ? void 0 : currentSectionState.reduce((state, section) => {
+                    if (!section.id.startsWith(entryIdPrefix)) {
+                        // Match pattern: {elementName}_entry-{index}_
+                        // also yields a prefix and suffix for any match found
+                        const idPrefixWithFullIdPattern = new RegExp(`(.+)${element.name}_entry-(\\d+)_(.+)`);
+                        const match = section.id.match(idPrefixWithFullIdPattern);
+                        if (match) {
+                            const oldEntryIndex = parseInt(match[2], 10);
+                            if (oldEntryIndex > index) {
+                                const prefix = match[1];
+                                const restOfId = match[3];
+                                const newEntryIndex = oldEntryIndex - 1;
+                                section.id = `${prefix ? prefix : ''}${element.name}_entry-${newEntryIndex}_${restOfId}`;
+                            }
+                        }
+                        state.push(section);
+                    }
+                    return state;
+                }, [])) || []);
+            },
         });
         setIsDirty();
-    }, [element, onChange, setIsDirty]);
-    const handleNestedChange = React.useCallback((index, nestedElement, { value, executedLookups, }) => {
+    }, [onChange, setIsDirty]);
+    const handleNestedChange = React.useCallback((index, nestedElement, { value, executedLookups, sectionState, }, idPrefix) => {
+        if (nestedElement.type === 'section') {
+            // trigger onChange to update sectionState
+            onChange({
+                ...nestedElement,
+                id: idPrefix ? `${idPrefix}${nestedElement.id}` : nestedElement.id,
+            }, { executedLookups: undefined, sectionState });
+        }
         if (!('name' in nestedElement)) {
             return;
         }
@@ -123,6 +153,7 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
                 });
                 return newExecutedLookups;
             },
+            sectionState,
         });
     }, [element, onChange]);
     const { minSetEntries, maxSetEntries } = useFormElementRepeatableSetEntries(element);
@@ -157,7 +188,7 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
             element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(0), element: element, id: id, classes: ['ob-button-repeatable-set-layout__multiple-add-buttons'] })),
             entries.map((entry, index) => {
                 return (React.createElement(RepeatableSetEntry, { key: entry[ENTRY_ID_PROPERTY_NAME], formId: formId, index: index, id: id, isEven: isEven, entry: entry, element: element, showAddButton: element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton, onChange: handleNestedChange, onLookup: onLookup, onAdd: handleAddEntry, onRemove: handleRemoveEntry, formElementsConditionallyShown: repeatableSetEntriesConditionallyShown[index.toString()], formElementsValidation: repeatableSetValidation &&
-                        repeatableSetValidation.entries[index.toString()], displayValidationMessages: displayValidationMessage, onUpdateFormElements: onUpdateFormElements }));
+                        repeatableSetValidation.entries[index.toString()], displayValidationMessages: displayValidationMessage, onUpdateFormElements: onUpdateFormElements, sectionState: sectionState }));
             }),
             (!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&
                 showAddButton && (React.createElement(AddButton, { onAdd: () => handleAddEntry(entries.length), element: element, id: id })),
@@ -167,13 +198,15 @@ function FormElementRepeatableSet({ formId, element, value, formElementValidatio
                 React.createElement("div", { className: "has-text-danger ob-error__text cypress-validation-message" }, repeatableSetValidation.set))))));
 }
 export default React.memo(FormElementRepeatableSet);
-const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id, index, isEven, entry, element, formElementsConditionallyShown, displayValidationMessages, formElementsValidation, onChange, onLookup, onAdd, onRemove, onUpdateFormElements, showAddButton, }) {
+const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id, index, isEven, entry, element, formElementsConditionallyShown, displayValidationMessages, formElementsValidation, onChange, onLookup, onAdd, onRemove, onUpdateFormElements, showAddButton, sectionState, }) {
     const [isConfirmingRemove, confirmRemove, cancelRemove] = useBooleanState(false);
-    const handleChange = React.useCallback((nestedElement, { value, executedLookups }) => {
+    const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id]);
+    const handleChange = React.useCallback((nestedElement, { value, executedLookups, sectionState }, idPrefix) => {
         onChange(index, nestedElement, {
             value,
             executedLookups,
-        });
+            sectionState,
+        }, idPrefix);
     }, [index, onChange]);
     const handleLookup = React.useCallback((mergeLookupResults) => {
         onLookup((currentFormSubmission) => {
@@ -198,7 +231,7 @@ const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id,
                         submission: entries[index],
                         lastElementUpdated: currentFormSubmission.lastElementUpdated,
                         executedLookups: (_a = repeatableSetExecutedLookups[index]) !== null && _a !== void 0 ? _a : {},
-                        collapsedSectionIds: currentFormSubmission.collapsedSectionIds,
+                        sectionState: currentFormSubmission.sectionState,
                     });
                     newEntry = submission;
                     newExecutedLookups = executedLookups;
@@ -257,8 +290,8 @@ const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id,
             });
         });
     }, [element.id, onUpdateFormElements]);
-    const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id]);
-    return (React.createElement(RepeatableSetEntryProvider, { index: index, onRemove: onRemove, isAnimated: element.layout === 'MULTIPLE_ADD_BUTTONS' }, ({ onRemove }) => (React.createElement(React.Fragment, null,
+    const idPrefix = elementDOMId.repeatableSetEntryDOMIdPrefix(index.toString());
+    return (React.createElement(RepeatableSetEntryProvider, { index: index, element: element, idPrefix: idPrefix, onRemove: onRemove, isAnimated: element.layout === 'MULTIPLE_ADD_BUTTONS' }, ({ onRemove }) => (React.createElement(React.Fragment, null,
         React.createElement(Modal, { isOpen: isConfirmingRemove, className: "cypress-repeatable-set-prompt", titleClassName: "cypress-repeatable-set-remove-entry-header", title: element.removeSetEntryLabel || 'Remove Entry', actions: React.createElement(React.Fragment, null,
                 React.createElement("button", { type: "button", className: "button ob-button is-light cypress-cancel-repeatable-set", onClick: cancelRemove }, "Cancel"),
                 React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-confirm-repeatable-set", onClick: () => {
@@ -267,7 +300,7 @@ const RepeatableSetEntry = React.memo(function RepeatableSetEntry({ formId, id,
                     }, autoFocus: true }, "Yes")) }, "Are you sure you want to remove this entry?"),
         React.createElement("div", { className: clsx('ob-repeatable-set__container cypress-repeatable-set-container', validationClassName) },
             (!element.layout || element.layout === 'SINGLE_ADD_BUTTON') && (React.createElement(RemoveButton, { onConfirmRemove: confirmRemove, element: element, className: "ob-repeatable-set__button-remove-top", index: index })),
-            React.createElement(OneBlinkFormElements, { formId: formId, idPrefix: elementDOMId.repeatableSetEntryDOMIdPrefix(index.toString()), isEven: isEven, formElementsValidation: formElementsValidation, displayValidationMessages: displayValidationMessages, elements: element.elements, onChange: handleChange, onLookup: handleLookup, model: entry, parentElement: element, formElementsConditionallyShown: formElementsConditionallyShown, onUpdateFormElements: handleUpdateNestedFormElements }),
+            React.createElement(OneBlinkFormElements, { formId: formId, idPrefix: idPrefix, isEven: isEven, formElementsValidation: formElementsValidation, displayValidationMessages: displayValidationMessages, elements: element.elements, onChange: handleChange, onLookup: handleLookup, model: entry, parentElement: element, formElementsConditionallyShown: formElementsConditionallyShown, onUpdateFormElements: handleUpdateNestedFormElements, sectionState: sectionState }),
             element.layout === 'MULTIPLE_ADD_BUTTONS' && (React.createElement(RemoveButton, { onConfirmRemove: confirmRemove, element: element, index: index, className: "ob-repeatable-set__button-remove-bottom" }))),
         showAddButton && (React.createElement(AddButton, { onAdd: () => onAdd(index + 1), element: element, classes: [
                 'ob-button-repeatable-set-layout__multiple-add-buttons',

package/dist/form-elements/FormElementRepeatableSet.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormElementRepeatableSet.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRepeatableSet.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport useBooleanState from '../hooks/useBooleanState'\nimport generateDefaultData, {\n  ENTRY_ID_PROPERTY_NAME,\n  generateNewRepeatableSetEntry,\n} from '../services/generate-default-data'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport Modal from '../components/renderer/Modal'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useValidationClass from '../hooks/useValidationClass'\nimport {\n  ExecutedLookups,\n  FormElementConditionallyShown,\n  FormElementLookupHandler,\n  FormElementsConditionallyShown,\n  FormElementsValidation,\n  FormElementValidation,\n  NestedFormElementValueChangeHandler,\n  IsDirtyProps,\n  UpdateFormElementsHandler,\n} from '../types/form'\nimport useFormElementRepeatableSetEntries from '../hooks/useFormElementRepeatableSetEntries'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport { Collapse } from '@mui/material'\n\ntype Props = {\n  formId: number\n  id: string\n  isEven: boolean\n  element: FormTypes.RepeatableSetElement\n  value: Array<SubmissionTypes.S3SubmissionData['submission']> | undefined\n  onChange: NestedFormElementValueChangeHandler<\n    SubmissionTypes.S3SubmissionData['submission'][]\n  >\n  onLookup: FormElementLookupHandler\n  formElementConditionallyShown: FormElementConditionallyShown | undefined\n  formElementValidation: FormElementValidation | undefined\n  displayValidationMessage: boolean\n  onUpdateFormElements: UpdateFormElementsHandler\n} & IsDirtyProps\n\nconst RepeatableSetIndexContext = React.createContext<number>(0)\n\nfunction RepeatableSetEntryProvider({\n  index,\n  isAnimated,\n  onRemove,\n  children,\n}: {\n  isAnimated: boolean\n  index: number\n  onRemove: (index: number) => void\n  children: (renderProps: { onRemove: () => void }) => React.ReactNode\n}) {\n  const [isExpanded, setIsExpanded] = React.useState(true)\n\n  const handleRemove = React.useCallback(() => {\n    if (isAnimated) {\n      setIsExpanded(false)\n    } else {\n      onRemove(index)\n    }\n  }, [index, isAnimated, onRemove])\n\n  const node = (\n    <RepeatableSetIndexContext.Provider value={index}>\n      {children({\n        onRemove: handleRemove,\n      })}\n    </RepeatableSetIndexContext.Provider>\n  )\n\n  if (!isAnimated) {\n    return node\n  }\n\n  return (\n    <Collapse\n      in={isExpanded}\n      appear\n      onExited={() => {\n        onRemove(index)\n      }}\n      classes={{\n        root: 'ob-repeatable-set__collapsible',\n        wrapper: 'ob-repeatable-set__collapsible-wrapper',\n        wrapperInner: 'ob-repeatable-set__collapsible-wrapper-inner',\n      }}\n    >\n      {node}\n    </Collapse>\n  )\n}\n\nexport function useRepeatableSetIndexText(text: string) {\n  const index = React.useContext(RepeatableSetIndexContext)\n  return React.useMemo(\n    () => text.replace('{INDEX}', (index + 1).toString()),\n    [index, text],\n  )\n}\n\nfunction FormElementRepeatableSet({\n  formId,\n  element,\n  value,\n  formElementValidation,\n  id,\n  isEven,\n  displayValidationMessage,\n  formElementConditionallyShown,\n  onChange,\n  onLookup,\n  onUpdateFormElements,\n  isDirty,\n  setIsDirty,\n}: Props) {\n  const entries = React.useMemo(\n    () => (Array.isArray(value) ? value : []),\n    [value],\n  )\n\n  const handleAddEntry = React.useCallback(\n    (index: number) => {\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = [...(existingEntries || [])]\n          const entry = generateDefaultData(\n            element.elements,\n            generateNewRepeatableSetEntry(),\n          )\n\n          newEntries.splice(index, 0, entry)\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          if (\n            existingExecutedLookups !== undefined &&\n            !Array.isArray(existingExecutedLookups)\n          ) {\n            return []\n          }\n\n          const newExistingExecutedLookups = [\n            ...((existingExecutedLookups as ExecutedLookups[]) ??\n              Array.from(Array(entries.length))),\n          ]\n          newExistingExecutedLookups.push({})\n          return newExistingExecutedLookups\n        },\n      })\n      setIsDirty()\n    },\n    [element, onChange, setIsDirty, entries],\n  )\n\n  const handleRemoveEntry = React.useCallback(\n    (index: number) => {\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = [...(existingEntries || [])]\n          newEntries.splice(index, 1)\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          if (!Array.isArray(existingExecutedLookups)) {\n            return []\n          }\n          const newExistingExecutedLookups = [...existingExecutedLookups]\n\n          newExistingExecutedLookups.splice(index, 1)\n          return newExistingExecutedLookups\n        },\n      })\n      setIsDirty()\n    },\n    [element, onChange, setIsDirty],\n  )\n\n  const handleNestedChange = React.useCallback(\n    (\n      index: number,\n      nestedElement: FormTypes.FormElement,\n      {\n        value,\n        executedLookups,\n      }: Parameters<NestedFormElementValueChangeHandler>[1],\n    ) => {\n      if (!('name' in nestedElement)) {\n        return\n      }\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = (existingEntries || []).map((entry, i) => {\n            if (i === index) {\n              return {\n                ...entry,\n                [nestedElement.name]:\n                  typeof value === 'function'\n                    ? value(entry[nestedElement.name])\n                    : value,\n              }\n            } else {\n              return entry\n            }\n          })\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          const elementExecutedLookups = existingExecutedLookups ?? []\n          if (!Array.isArray(elementExecutedLookups)) {\n            return elementExecutedLookups\n          }\n          const newExecutedLookups = elementExecutedLookups.map(\n            (executedLookup, i) => {\n              if (i === index) {\n                const updatedExecutedLookups =\n                  typeof executedLookups === 'function'\n                    ? executedLookups(executedLookup?.[nestedElement.name])\n                    : executedLookups\n                return {\n                  ...executedLookup,\n                  [nestedElement.name]: updatedExecutedLookups,\n                }\n              }\n              return executedLookup\n            },\n          )\n          return newExecutedLookups\n        },\n      })\n    },\n    [element, onChange],\n  )\n\n  const { minSetEntries, maxSetEntries } =\n    useFormElementRepeatableSetEntries(element)\n\n  const repeatableSetValidation = React.useMemo(\n    () =>\n      !formElementValidation ||\n      typeof formElementValidation === 'string' ||\n      formElementValidation.type !== 'repeatableSet'\n        ? undefined\n        : formElementValidation,\n    [formElementValidation],\n  )\n\n  const repeatableSetEntriesConditionallyShown =\n    formElementConditionallyShown &&\n    formElementConditionallyShown.type === 'repeatableSet'\n      ? formElementConditionallyShown.entries\n      : {}\n\n  const { validationClassName } = useValidationClass({\n    formElementsValid: !repeatableSetValidation,\n    displayInvalidClassName: isDirty || displayValidationMessage,\n    validClassName: 'ob-repeatable-set-element__valid',\n    invalidClassName: 'ob-repeatable-set-element__invalid',\n  })\n\n  const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n  const showAddButton = React.useMemo(\n    () => !maxSetEntries || entries.length < maxSetEntries,\n    [maxSetEntries, entries.length],\n  )\n\n  const repeatableSetContainerClass = React.useMemo(() => {\n    const prefix = 'ob-repeatable-set-container-layout__'\n    switch (element.layout) {\n      case 'MULTIPLE_ADD_BUTTONS':\n        return prefix + 'multiple-add-buttons'\n      default:\n        return 'single-add-button'\n    }\n  }, [element.layout])\n\n  return (\n    <div\n      className={clsx('cypress-repeatable-set-element', validationClassName)}\n      aria-labelledby={`${id}-label`}\n      aria-describedby={ariaDescribedby}\n      role=\"region\"\n    >\n      {/*  */}\n      <FormElementLabelContainer\n        className={clsx(\n          'ob-repeatable-set',\n          isEven ? 'even' : 'odd',\n          repeatableSetContainerClass,\n        )}\n        element={element}\n        id={id}\n        required={!!minSetEntries && minSetEntries > 0}\n      >\n        {element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (\n          <AddButton\n            onAdd={() => handleAddEntry(0)}\n            element={element}\n            id={id}\n            classes={['ob-button-repeatable-set-layout__multiple-add-buttons']}\n          />\n        )}\n        {entries.map((entry, index) => {\n          return (\n            <RepeatableSetEntry\n              key={entry[ENTRY_ID_PROPERTY_NAME] as string}\n              formId={formId}\n              index={index}\n              id={id}\n              isEven={isEven}\n              entry={entry}\n              element={element}\n              showAddButton={\n                element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton\n              }\n              onChange={handleNestedChange}\n              onLookup={onLookup}\n              onAdd={handleAddEntry}\n              onRemove={handleRemoveEntry}\n              formElementsConditionallyShown={\n                repeatableSetEntriesConditionallyShown[index.toString()]\n              }\n              formElementsValidation={\n                repeatableSetValidation &&\n                repeatableSetValidation.entries[index.toString()]\n              }\n              displayValidationMessages={displayValidationMessage}\n              onUpdateFormElements={onUpdateFormElements}\n            />\n          )\n        })}\n        {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&\n          showAddButton && (\n            <AddButton\n              onAdd={() => handleAddEntry(entries.length)}\n              element={element}\n              id={id}\n            />\n          )}\n        {(isDirty || displayValidationMessage) &&\n          !!repeatableSetValidation &&\n          !!repeatableSetValidation.set && (\n            <div role=\"alert\" className=\"has-margin-top-8\">\n              <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n                {repeatableSetValidation.set}\n              </div>\n            </div>\n          )}\n      </FormElementLabelContainer>\n    </div>\n  )\n}\n\nexport default React.memo(FormElementRepeatableSet)\n\ntype RepeatableSetEntryProps = {\n  formId: number\n  id: string\n  index: number\n  isEven: boolean\n  entry: SubmissionTypes.S3SubmissionData['submission']\n  element: FormTypes.RepeatableSetElement\n  formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n  formElementsValidation: FormElementsValidation | undefined\n  displayValidationMessages: boolean\n  showAddButton: boolean\n  onChange: (\n    index: number,\n    formElement: FormTypes.FormElement,\n    {\n      value,\n      executedLookups,\n    }: Parameters<NestedFormElementValueChangeHandler>[1],\n  ) => void\n  onLookup: FormElementLookupHandler\n  onAdd: (index: number) => unknown\n  onRemove: (index: number) => unknown\n  onUpdateFormElements: UpdateFormElementsHandler\n}\n\nconst RepeatableSetEntry = React.memo<RepeatableSetEntryProps>(\n  function RepeatableSetEntry({\n    formId,\n    id,\n    index,\n    isEven,\n    entry,\n    element,\n    formElementsConditionallyShown,\n    displayValidationMessages,\n    formElementsValidation,\n    onChange,\n    onLookup,\n    onAdd,\n    onRemove,\n    onUpdateFormElements,\n    showAddButton,\n  }: RepeatableSetEntryProps) {\n    const [isConfirmingRemove, confirmRemove, cancelRemove] =\n      useBooleanState(false)\n\n    const handleChange: NestedFormElementValueChangeHandler = React.useCallback(\n      (nestedElement, { value, executedLookups }) => {\n        onChange(index, nestedElement, {\n          value,\n          executedLookups,\n        })\n      },\n      [index, onChange],\n    )\n\n    const handleLookup = React.useCallback<FormElementLookupHandler>(\n      (mergeLookupResults) => {\n        onLookup((currentFormSubmission) => {\n          let newEntry = {}\n          const entries = currentFormSubmission.submission[\n            element.name\n          ] as Array<SubmissionTypes.S3SubmissionData['submission']>\n          const repeatableSetExecutedLookups =\n            (currentFormSubmission.executedLookups?.[\n              element.name\n            ] as ExecutedLookups[]) ?? Array.from(Array(entries.length))\n          // if the repeatable set is prefilled or has minimum entries then executed lookups exists,\n          // but is an empty array\n          for (let i = 0; i < entries.length; i++) {\n            if (!repeatableSetExecutedLookups[index]) {\n              repeatableSetExecutedLookups[index] = {}\n            }\n          }\n          let newExecutedLookups: ExecutedLookups = {}\n          const elements = currentFormSubmission.elements.map((formElement) => {\n            if (\n              formElement.type === 'repeatableSet' &&\n              formElement.name === element.name\n            ) {\n              const { elements, submission, executedLookups } =\n                mergeLookupResults({\n                  elements: formElement.elements,\n                  submission: entries[index],\n                  lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                  executedLookups: repeatableSetExecutedLookups[index] ?? {},\n                  collapsedSectionIds: currentFormSubmission.collapsedSectionIds,\n                })\n              newEntry = submission\n              newExecutedLookups = executedLookups as ExecutedLookups\n              return {\n                ...formElement,\n                elements,\n              }\n            }\n            return formElement\n          })\n\n          const submission = {\n            ...currentFormSubmission.submission,\n            [element.name]: entries.map((entry, i) => {\n              if (i === index) {\n                return newEntry\n              }\n              return entry\n            }),\n          }\n\n          let updatedExecutedLookups = currentFormSubmission.executedLookups\n          if (Array.isArray(repeatableSetExecutedLookups)) {\n            updatedExecutedLookups = {\n              ...currentFormSubmission.executedLookups,\n              [element.name]: repeatableSetExecutedLookups.map((entry, i) => {\n                if (i == index) {\n                  return newExecutedLookups\n                }\n                return entry\n              }),\n            }\n          }\n\n          return {\n            elements,\n            submission,\n            executedLookups: updatedExecutedLookups,\n          }\n        })\n      },\n      [element.name, index, onLookup],\n    )\n\n    const { validationClassName } = useValidationClass({\n      formElementsValid: !formElementsValidation,\n      displayInvalidClassName: displayValidationMessages,\n      validClassName: 'ob-repeatable-set__valid',\n      invalidClassName: 'ob-repeatable-set__invalid',\n    })\n\n    const handleUpdateNestedFormElements =\n      React.useCallback<UpdateFormElementsHandler>(\n        (setter) => {\n          onUpdateFormElements((formElements) => {\n            return formElements.map((formElement) => {\n              if (\n                formElement.id === element.id &&\n                formElement.type === 'repeatableSet'\n              ) {\n                return {\n                  ...formElement,\n                  elements: setter(formElement.elements),\n                }\n              }\n              return formElement\n            })\n          })\n        },\n        [element.id, onUpdateFormElements],\n      )\n\n    const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n    return (\n      <RepeatableSetEntryProvider\n        index={index}\n        onRemove={onRemove}\n        isAnimated={element.layout === 'MULTIPLE_ADD_BUTTONS'}\n      >\n        {({ onRemove }) => (\n          <>\n            <Modal\n              isOpen={isConfirmingRemove}\n              className=\"cypress-repeatable-set-prompt\"\n              titleClassName=\"cypress-repeatable-set-remove-entry-header\"\n              title={element.removeSetEntryLabel || 'Remove Entry'}\n              actions={\n                <>\n                  <button\n                    type=\"button\"\n                    className=\"button ob-button is-light cypress-cancel-repeatable-set\"\n                    onClick={cancelRemove}\n                  >\n                    Cancel\n                  </button>\n                  <button\n                    type=\"button\"\n                    className=\"button ob-button is-primary cypress-confirm-repeatable-set\"\n                    onClick={() => {\n                      cancelRemove()\n                      onRemove()\n                    }}\n                    autoFocus\n                  >\n                    Yes\n                  </button>\n                </>\n              }\n            >\n              Are you sure you want to remove this entry?\n            </Modal>\n\n            <div\n              className={clsx(\n                'ob-repeatable-set__container cypress-repeatable-set-container',\n                validationClassName,\n              )}\n            >\n              {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') && (\n                <RemoveButton\n                  onConfirmRemove={confirmRemove}\n                  element={element}\n                  className=\"ob-repeatable-set__button-remove-top\"\n                  index={index}\n                />\n              )}\n\n              <OneBlinkFormElements\n                formId={formId}\n                idPrefix={elementDOMId.repeatableSetEntryDOMIdPrefix(\n                  index.toString(),\n                )}\n                isEven={isEven}\n                formElementsValidation={formElementsValidation}\n                displayValidationMessages={displayValidationMessages}\n                elements={element.elements}\n                onChange={handleChange}\n                onLookup={handleLookup}\n                model={entry}\n                parentElement={element}\n                formElementsConditionallyShown={formElementsConditionallyShown}\n                onUpdateFormElements={handleUpdateNestedFormElements}\n              />\n              {element.layout === 'MULTIPLE_ADD_BUTTONS' && (\n                <RemoveButton\n                  onConfirmRemove={confirmRemove}\n                  element={element}\n                  index={index}\n                  className=\"ob-repeatable-set__button-remove-bottom\"\n                />\n              )}\n            </div>\n            {showAddButton && (\n              <AddButton\n                onAdd={() => onAdd(index + 1)}\n                element={element}\n                classes={[\n                  'ob-button-repeatable-set-layout__multiple-add-buttons',\n                ]}\n              />\n            )}\n          </>\n        )}\n      </RepeatableSetEntryProvider>\n    )\n  },\n)\n\nfunction AddButton({\n  id,\n  onAdd,\n  element,\n  classes,\n}: {\n  id?: string\n  onAdd: () => void\n  element: FormTypes.RepeatableSetElement\n  isPrimary?: boolean\n  classes?: string[]\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button ob-button ob-button__add cypress-add-repeatable-set is-primary',\n        classes,\n      )}\n      onClick={onAdd}\n      disabled={element.readOnly}\n      aria-label={element.addSetEntryLabel ? undefined : 'Add Entry'}\n      id={id}\n    >\n      <span className=\"icon\">\n        <MaterialIcon>add</MaterialIcon>\n      </span>\n      {!!element.addSetEntryLabel && <span>{element.addSetEntryLabel}</span>}\n    </button>\n  )\n}\n\nfunction RemoveButton({\n  onConfirmRemove,\n  element,\n  className,\n  index,\n}: {\n  onConfirmRemove: () => void\n  element: FormTypes.RepeatableSetElement\n  className?: string\n  index: number\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry',\n        className,\n      )}\n      onClick={onConfirmRemove}\n      disabled={element.readOnly}\n      aria-label={`${element.removeSetEntryLabel ?? 'Remove Entry'} ${index + 1}`}\n    >\n      <span className=\"icon\">\n        <MaterialIcon>delete_outline</MaterialIcon>\n      </span>\n      {!!element.removeSetEntryLabel && (\n        <span>{element.removeSetEntryLabel}</span>\n      )}\n    </button>\n  )\n}\n"]}
+{"version":3,"file":"FormElementRepeatableSet.js","sourceRoot":"","sources":["../../src/form-elements/FormElementRepeatableSet.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { FormTypes, SubmissionTypes } from '@oneblink/types'\nimport useBooleanState from '../hooks/useBooleanState'\nimport generateDefaultData, {\n  ENTRY_ID_PROPERTY_NAME,\n  generateNewRepeatableSetEntry,\n} from '../services/generate-default-data'\nimport OneBlinkFormElements from '../components/renderer/OneBlinkFormElements'\nimport Modal from '../components/renderer/Modal'\nimport FormElementLabelContainer from '../components/renderer/FormElementLabelContainer'\nimport useValidationClass from '../hooks/useValidationClass'\nimport {\n  ExecutedLookups,\n  FormElementConditionallyShown,\n  FormElementLookupHandler,\n  FormElementsConditionallyShown,\n  FormElementsValidation,\n  FormElementValidation,\n  NestedFormElementValueChangeHandler,\n  IsDirtyProps,\n  UpdateFormElementsHandler,\n  SectionState,\n} from '../types/form'\nimport useFormElementRepeatableSetEntries from '../hooks/useFormElementRepeatableSetEntries'\nimport useElementAriaDescribedby from '../hooks/useElementAriaDescribedby'\nimport MaterialIcon from '../components/MaterialIcon'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport { Collapse } from '@mui/material'\n\ntype Props = {\n  formId: number\n  id: string\n  isEven: boolean\n  element: FormTypes.RepeatableSetElement\n  value: Array<SubmissionTypes.S3SubmissionData['submission']> | undefined\n  onChange: NestedFormElementValueChangeHandler<\n    SubmissionTypes.S3SubmissionData['submission'][]\n  >\n  onLookup: FormElementLookupHandler\n  formElementConditionallyShown: FormElementConditionallyShown | undefined\n  formElementValidation: FormElementValidation | undefined\n  displayValidationMessage: boolean\n  onUpdateFormElements: UpdateFormElementsHandler\n  sectionState: SectionState\n} & IsDirtyProps\n\nconst RepeatableSetIndexContext = React.createContext<number>(0)\n\nfunction RepeatableSetEntryProvider({\n  index,\n  isAnimated,\n  element,\n  idPrefix,\n  onRemove,\n  children,\n}: {\n  isAnimated: boolean\n  index: number\n  element: FormTypes.RepeatableSetElement\n  idPrefix?: string\n  onRemove: (\n    index: number,\n    element: FormTypes.RepeatableSetElement,\n    idPrefix?: string,\n  ) => void\n  children: (renderProps: { onRemove: () => void }) => React.ReactNode\n}) {\n  const [isExpanded, setIsExpanded] = React.useState(true)\n\n  const handleRemove = React.useCallback(() => {\n    if (isAnimated) {\n      setIsExpanded(false)\n    } else {\n      onRemove(index, element, idPrefix)\n    }\n  }, [index, isAnimated, onRemove, element, idPrefix])\n\n  const node = (\n    <RepeatableSetIndexContext.Provider value={index}>\n      {children({\n        onRemove: handleRemove,\n      })}\n    </RepeatableSetIndexContext.Provider>\n  )\n\n  if (!isAnimated) {\n    return node\n  }\n\n  return (\n    <Collapse\n      in={isExpanded}\n      appear\n      onExited={() => {\n        onRemove(index, element, idPrefix)\n      }}\n      classes={{\n        root: 'ob-repeatable-set__collapsible',\n        wrapper: 'ob-repeatable-set__collapsible-wrapper',\n        wrapperInner: 'ob-repeatable-set__collapsible-wrapper-inner',\n      }}\n    >\n      {node}\n    </Collapse>\n  )\n}\n\nexport function useRepeatableSetIndexText(text: string) {\n  const index = React.useContext(RepeatableSetIndexContext)\n  return React.useMemo(\n    () => text.replace('{INDEX}', (index + 1).toString()),\n    [index, text],\n  )\n}\n\nfunction FormElementRepeatableSet({\n  formId,\n  element,\n  value,\n  formElementValidation,\n  id,\n  isEven,\n  displayValidationMessage,\n  formElementConditionallyShown,\n  onChange,\n  onLookup,\n  onUpdateFormElements,\n  isDirty,\n  setIsDirty,\n  sectionState,\n}: Props) {\n  const entries = React.useMemo(\n    () => (Array.isArray(value) ? value : []),\n    [value],\n  )\n\n  const handleAddEntry = React.useCallback(\n    (index: number) => {\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = [...(existingEntries || [])]\n          const entry = generateDefaultData(\n            element.elements,\n            generateNewRepeatableSetEntry(),\n          )\n\n          newEntries.splice(index, 0, entry)\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          if (\n            existingExecutedLookups !== undefined &&\n            !Array.isArray(existingExecutedLookups)\n          ) {\n            return []\n          }\n\n          const newExistingExecutedLookups = [\n            ...((existingExecutedLookups as ExecutedLookups[]) ??\n              Array.from(Array(entries.length))),\n          ]\n          newExistingExecutedLookups.push({})\n          return newExistingExecutedLookups\n        },\n        sectionState: (currentSectionState) => currentSectionState,\n      })\n      setIsDirty()\n    },\n    [element, onChange, setIsDirty, entries],\n  )\n\n  const handleRemoveEntry = React.useCallback(\n    (\n      index: number,\n      element: FormTypes.RepeatableSetElement,\n      idPrefix?: string,\n    ) => {\n      const entryIdPrefix = idPrefix || ''\n\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = [...(existingEntries || [])]\n          newEntries.splice(index, 1)\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          if (!Array.isArray(existingExecutedLookups)) {\n            return []\n          }\n          const newExistingExecutedLookups = [...existingExecutedLookups]\n\n          newExistingExecutedLookups.splice(index, 1)\n          return newExistingExecutedLookups\n        },\n        sectionState: (currentSectionState) => {\n          return (\n            currentSectionState?.reduce(\n              (\n                state: {\n                  id: string\n                  state: 'COLLAPSED' | 'EXPANDED'\n                }[],\n                section,\n              ) => {\n                if (!section.id.startsWith(entryIdPrefix)) {\n                  // Match pattern: {elementName}_entry-{index}_\n                  // also yields a prefix and suffix for any match found\n                  const idPrefixWithFullIdPattern = new RegExp(\n                    `(.+)${element.name}_entry-(\\\\d+)_(.+)`,\n                  )\n                  const match = section.id.match(idPrefixWithFullIdPattern)\n\n                  if (match) {\n                    const oldEntryIndex = parseInt(match[2], 10)\n                    if (oldEntryIndex > index) {\n                      const prefix = match[1]\n                      const restOfId = match[3]\n                      const newEntryIndex = oldEntryIndex - 1\n                      section.id = `${prefix ? prefix : ''}${element.name}_entry-${newEntryIndex}_${restOfId}`\n                    }\n                  }\n\n                  state.push(section)\n                }\n\n                return state\n              },\n              [],\n            ) || []\n          )\n        },\n      })\n      setIsDirty()\n    },\n    [onChange, setIsDirty],\n  )\n\n  const handleNestedChange = React.useCallback(\n    (\n      index: number,\n      nestedElement: FormTypes.FormElement,\n      {\n        value,\n        executedLookups,\n        sectionState,\n      }: Parameters<NestedFormElementValueChangeHandler>[1],\n      idPrefix?: string,\n    ) => {\n      if (nestedElement.type === 'section') {\n        // trigger onChange to update sectionState\n        onChange(\n          {\n            ...nestedElement,\n            id: idPrefix ? `${idPrefix}${nestedElement.id}` : nestedElement.id,\n          },\n          { executedLookups: undefined, sectionState },\n        )\n      }\n      if (!('name' in nestedElement)) {\n        return\n      }\n      onChange(element, {\n        value: (existingEntries) => {\n          const newEntries = (existingEntries || []).map((entry, i) => {\n            if (i === index) {\n              return {\n                ...entry,\n                [nestedElement.name]:\n                  typeof value === 'function'\n                    ? value(entry[nestedElement.name])\n                    : value,\n              }\n            } else {\n              return entry\n            }\n          })\n          return newEntries\n        },\n        executedLookups: (existingExecutedLookups) => {\n          const elementExecutedLookups = existingExecutedLookups ?? []\n          if (!Array.isArray(elementExecutedLookups)) {\n            return elementExecutedLookups\n          }\n          const newExecutedLookups = elementExecutedLookups.map(\n            (executedLookup, i) => {\n              if (i === index) {\n                const updatedExecutedLookups =\n                  typeof executedLookups === 'function'\n                    ? executedLookups(executedLookup?.[nestedElement.name])\n                    : executedLookups\n                return {\n                  ...executedLookup,\n                  [nestedElement.name]: updatedExecutedLookups,\n                }\n              }\n              return executedLookup\n            },\n          )\n          return newExecutedLookups\n        },\n        sectionState,\n      })\n    },\n    [element, onChange],\n  )\n\n  const { minSetEntries, maxSetEntries } =\n    useFormElementRepeatableSetEntries(element)\n\n  const repeatableSetValidation = React.useMemo(\n    () =>\n      !formElementValidation ||\n      typeof formElementValidation === 'string' ||\n      formElementValidation.type !== 'repeatableSet'\n        ? undefined\n        : formElementValidation,\n    [formElementValidation],\n  )\n\n  const repeatableSetEntriesConditionallyShown =\n    formElementConditionallyShown &&\n    formElementConditionallyShown.type === 'repeatableSet'\n      ? formElementConditionallyShown.entries\n      : {}\n\n  const { validationClassName } = useValidationClass({\n    formElementsValid: !repeatableSetValidation,\n    displayInvalidClassName: isDirty || displayValidationMessage,\n    validClassName: 'ob-repeatable-set-element__valid',\n    invalidClassName: 'ob-repeatable-set-element__invalid',\n  })\n\n  const ariaDescribedby = useElementAriaDescribedby(id, element)\n\n  const showAddButton = React.useMemo(\n    () => !maxSetEntries || entries.length < maxSetEntries,\n    [maxSetEntries, entries.length],\n  )\n\n  const repeatableSetContainerClass = React.useMemo(() => {\n    const prefix = 'ob-repeatable-set-container-layout__'\n    switch (element.layout) {\n      case 'MULTIPLE_ADD_BUTTONS':\n        return prefix + 'multiple-add-buttons'\n      default:\n        return 'single-add-button'\n    }\n  }, [element.layout])\n\n  return (\n    <div\n      className={clsx('cypress-repeatable-set-element', validationClassName)}\n      aria-labelledby={`${id}-label`}\n      aria-describedby={ariaDescribedby}\n      role=\"region\"\n    >\n      {/*  */}\n      <FormElementLabelContainer\n        className={clsx(\n          'ob-repeatable-set',\n          isEven ? 'even' : 'odd',\n          repeatableSetContainerClass,\n        )}\n        element={element}\n        id={id}\n        required={!!minSetEntries && minSetEntries > 0}\n      >\n        {element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton && (\n          <AddButton\n            onAdd={() => handleAddEntry(0)}\n            element={element}\n            id={id}\n            classes={['ob-button-repeatable-set-layout__multiple-add-buttons']}\n          />\n        )}\n        {entries.map((entry, index) => {\n          return (\n            <RepeatableSetEntry\n              key={entry[ENTRY_ID_PROPERTY_NAME] as string}\n              formId={formId}\n              index={index}\n              id={id}\n              isEven={isEven}\n              entry={entry}\n              element={element}\n              showAddButton={\n                element.layout === 'MULTIPLE_ADD_BUTTONS' && showAddButton\n              }\n              onChange={handleNestedChange}\n              onLookup={onLookup}\n              onAdd={handleAddEntry}\n              onRemove={handleRemoveEntry}\n              formElementsConditionallyShown={\n                repeatableSetEntriesConditionallyShown[index.toString()]\n              }\n              formElementsValidation={\n                repeatableSetValidation &&\n                repeatableSetValidation.entries[index.toString()]\n              }\n              displayValidationMessages={displayValidationMessage}\n              onUpdateFormElements={onUpdateFormElements}\n              sectionState={sectionState}\n            />\n          )\n        })}\n        {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') &&\n          showAddButton && (\n            <AddButton\n              onAdd={() => handleAddEntry(entries.length)}\n              element={element}\n              id={id}\n            />\n          )}\n        {(isDirty || displayValidationMessage) &&\n          !!repeatableSetValidation &&\n          !!repeatableSetValidation.set && (\n            <div role=\"alert\" className=\"has-margin-top-8\">\n              <div className=\"has-text-danger ob-error__text cypress-validation-message\">\n                {repeatableSetValidation.set}\n              </div>\n            </div>\n          )}\n      </FormElementLabelContainer>\n    </div>\n  )\n}\n\nexport default React.memo(FormElementRepeatableSet)\n\ntype RepeatableSetEntryProps = {\n  formId: number\n  id: string\n  index: number\n  isEven: boolean\n  entry: SubmissionTypes.S3SubmissionData['submission']\n  element: FormTypes.RepeatableSetElement\n  formElementsConditionallyShown: FormElementsConditionallyShown | undefined\n  formElementsValidation: FormElementsValidation | undefined\n  displayValidationMessages: boolean\n  showAddButton: boolean\n  onChange: (\n    index: number,\n    formElement: FormTypes.FormElement,\n    {\n      value,\n      executedLookups,\n    }: Parameters<NestedFormElementValueChangeHandler>[1],\n    idPrefix?: string,\n  ) => void\n  onLookup: FormElementLookupHandler\n  onAdd: (index: number) => unknown\n  onRemove: (\n    index: number,\n    element: FormTypes.RepeatableSetElement,\n    idPrefix?: string,\n  ) => unknown\n  onUpdateFormElements: UpdateFormElementsHandler\n  sectionState: SectionState\n}\n\nconst RepeatableSetEntry = React.memo<RepeatableSetEntryProps>(\n  function RepeatableSetEntry({\n    formId,\n    id,\n    index,\n    isEven,\n    entry,\n    element,\n    formElementsConditionallyShown,\n    displayValidationMessages,\n    formElementsValidation,\n    onChange,\n    onLookup,\n    onAdd,\n    onRemove,\n    onUpdateFormElements,\n    showAddButton,\n    sectionState,\n  }: RepeatableSetEntryProps) {\n    const [isConfirmingRemove, confirmRemove, cancelRemove] =\n      useBooleanState(false)\n    const elementDOMId = React.useMemo(() => new ElementDOMId(id), [id])\n\n    const handleChange: NestedFormElementValueChangeHandler = React.useCallback(\n      (nestedElement, { value, executedLookups, sectionState }, idPrefix) => {\n        onChange(\n          index,\n          nestedElement,\n          {\n            value,\n            executedLookups,\n            sectionState,\n          },\n          idPrefix,\n        )\n      },\n      [index, onChange],\n    )\n\n    const handleLookup = React.useCallback<FormElementLookupHandler>(\n      (mergeLookupResults) => {\n        onLookup((currentFormSubmission) => {\n          let newEntry = {}\n          const entries = currentFormSubmission.submission[\n            element.name\n          ] as Array<SubmissionTypes.S3SubmissionData['submission']>\n          const repeatableSetExecutedLookups =\n            (currentFormSubmission.executedLookups?.[\n              element.name\n            ] as ExecutedLookups[]) ?? Array.from(Array(entries.length))\n          // if the repeatable set is prefilled or has minimum entries then executed lookups exists,\n          // but is an empty array\n          for (let i = 0; i < entries.length; i++) {\n            if (!repeatableSetExecutedLookups[index]) {\n              repeatableSetExecutedLookups[index] = {}\n            }\n          }\n          let newExecutedLookups: ExecutedLookups = {}\n          const elements = currentFormSubmission.elements.map((formElement) => {\n            if (\n              formElement.type === 'repeatableSet' &&\n              formElement.name === element.name\n            ) {\n              const { elements, submission, executedLookups } =\n                mergeLookupResults({\n                  elements: formElement.elements,\n                  submission: entries[index],\n                  lastElementUpdated: currentFormSubmission.lastElementUpdated,\n                  executedLookups: repeatableSetExecutedLookups[index] ?? {},\n                  sectionState: currentFormSubmission.sectionState,\n                })\n              newEntry = submission\n              newExecutedLookups = executedLookups as ExecutedLookups\n              return {\n                ...formElement,\n                elements,\n              }\n            }\n            return formElement\n          })\n\n          const submission = {\n            ...currentFormSubmission.submission,\n            [element.name]: entries.map((entry, i) => {\n              if (i === index) {\n                return newEntry\n              }\n              return entry\n            }),\n          }\n\n          let updatedExecutedLookups = currentFormSubmission.executedLookups\n          if (Array.isArray(repeatableSetExecutedLookups)) {\n            updatedExecutedLookups = {\n              ...currentFormSubmission.executedLookups,\n              [element.name]: repeatableSetExecutedLookups.map((entry, i) => {\n                if (i == index) {\n                  return newExecutedLookups\n                }\n                return entry\n              }),\n            }\n          }\n\n          return {\n            elements,\n            submission,\n            executedLookups: updatedExecutedLookups,\n          }\n        })\n      },\n      [element.name, index, onLookup],\n    )\n\n    const { validationClassName } = useValidationClass({\n      formElementsValid: !formElementsValidation,\n      displayInvalidClassName: displayValidationMessages,\n      validClassName: 'ob-repeatable-set__valid',\n      invalidClassName: 'ob-repeatable-set__invalid',\n    })\n\n    const handleUpdateNestedFormElements =\n      React.useCallback<UpdateFormElementsHandler>(\n        (setter) => {\n          onUpdateFormElements((formElements) => {\n            return formElements.map((formElement) => {\n              if (\n                formElement.id === element.id &&\n                formElement.type === 'repeatableSet'\n              ) {\n                return {\n                  ...formElement,\n                  elements: setter(formElement.elements),\n                }\n              }\n              return formElement\n            })\n          })\n        },\n        [element.id, onUpdateFormElements],\n      )\n\n    const idPrefix = elementDOMId.repeatableSetEntryDOMIdPrefix(\n      index.toString(),\n    )\n\n    return (\n      <RepeatableSetEntryProvider\n        index={index}\n        element={element}\n        idPrefix={idPrefix}\n        onRemove={onRemove}\n        isAnimated={element.layout === 'MULTIPLE_ADD_BUTTONS'}\n      >\n        {({ onRemove }) => (\n          <>\n            <Modal\n              isOpen={isConfirmingRemove}\n              className=\"cypress-repeatable-set-prompt\"\n              titleClassName=\"cypress-repeatable-set-remove-entry-header\"\n              title={element.removeSetEntryLabel || 'Remove Entry'}\n              actions={\n                <>\n                  <button\n                    type=\"button\"\n                    className=\"button ob-button is-light cypress-cancel-repeatable-set\"\n                    onClick={cancelRemove}\n                  >\n                    Cancel\n                  </button>\n                  <button\n                    type=\"button\"\n                    className=\"button ob-button is-primary cypress-confirm-repeatable-set\"\n                    onClick={() => {\n                      cancelRemove()\n                      onRemove()\n                    }}\n                    autoFocus\n                  >\n                    Yes\n                  </button>\n                </>\n              }\n            >\n              Are you sure you want to remove this entry?\n            </Modal>\n\n            <div\n              className={clsx(\n                'ob-repeatable-set__container cypress-repeatable-set-container',\n                validationClassName,\n              )}\n            >\n              {(!element.layout || element.layout === 'SINGLE_ADD_BUTTON') && (\n                <RemoveButton\n                  onConfirmRemove={confirmRemove}\n                  element={element}\n                  className=\"ob-repeatable-set__button-remove-top\"\n                  index={index}\n                />\n              )}\n\n              <OneBlinkFormElements\n                formId={formId}\n                idPrefix={idPrefix}\n                isEven={isEven}\n                formElementsValidation={formElementsValidation}\n                displayValidationMessages={displayValidationMessages}\n                elements={element.elements}\n                onChange={handleChange}\n                onLookup={handleLookup}\n                model={entry}\n                parentElement={element}\n                formElementsConditionallyShown={formElementsConditionallyShown}\n                onUpdateFormElements={handleUpdateNestedFormElements}\n                sectionState={sectionState}\n              />\n              {element.layout === 'MULTIPLE_ADD_BUTTONS' && (\n                <RemoveButton\n                  onConfirmRemove={confirmRemove}\n                  element={element}\n                  index={index}\n                  className=\"ob-repeatable-set__button-remove-bottom\"\n                />\n              )}\n            </div>\n            {showAddButton && (\n              <AddButton\n                onAdd={() => onAdd(index + 1)}\n                element={element}\n                classes={[\n                  'ob-button-repeatable-set-layout__multiple-add-buttons',\n                ]}\n              />\n            )}\n          </>\n        )}\n      </RepeatableSetEntryProvider>\n    )\n  },\n)\n\nfunction AddButton({\n  id,\n  onAdd,\n  element,\n  classes,\n}: {\n  id?: string\n  onAdd: () => void\n  element: FormTypes.RepeatableSetElement\n  isPrimary?: boolean\n  classes?: string[]\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button ob-button ob-button__add cypress-add-repeatable-set is-primary',\n        classes,\n      )}\n      onClick={onAdd}\n      disabled={element.readOnly}\n      aria-label={element.addSetEntryLabel ? undefined : 'Add Entry'}\n      id={id}\n    >\n      <span className=\"icon\">\n        <MaterialIcon>add</MaterialIcon>\n      </span>\n      {!!element.addSetEntryLabel && <span>{element.addSetEntryLabel}</span>}\n    </button>\n  )\n}\n\nfunction RemoveButton({\n  onConfirmRemove,\n  element,\n  className,\n  index,\n}: {\n  onConfirmRemove: () => void\n  element: FormTypes.RepeatableSetElement\n  className?: string\n  index: number\n}) {\n  return (\n    <button\n      type=\"button\"\n      className={clsx(\n        'button ob-button ob-button_remove is-light cypress-remove-repeatable-set-entry',\n        className,\n      )}\n      onClick={onConfirmRemove}\n      disabled={element.readOnly}\n      aria-label={`${element.removeSetEntryLabel ?? 'Remove Entry'} ${index + 1}`}\n    >\n      <span className=\"icon\">\n        <MaterialIcon>delete_outline</MaterialIcon>\n      </span>\n      {!!element.removeSetEntryLabel && (\n        <span>{element.removeSetEntryLabel}</span>\n      )}\n    </button>\n  )\n}\n"]}

package/dist/form-elements/FormElementSection.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { FormTypes } from '@oneblink/types';
 import { Props } from '../components/renderer/OneBlinkFormElements';
-declare function FormElementSection<T extends FormTypes._NestedElementsElement>({ element, onLookup, displayValidationMessages, onUpdateFormElements, sectionHeaderId, collapsedSectionIds, ...props }: Omit<Props<T>, 'elements'> & {
+import { SectionState } from '../types/form';
+declare function FormElementSection<T extends FormTypes._NestedElementsElement>({ element, onLookup, displayValidationMessages, onUpdateFormElements, sectionHeaderId, sectionState, ...props }: Omit<Props<T>, 'elements'> & {
     element: FormTypes.SectionElement;
     sectionHeaderId: string;
-    collapsedSectionIds?: string[];
+    sectionState?: SectionState;
 }): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof FormElementSection>;
 export default _default;