@oneblink/apps-react 8.4.0 → 8.5.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/OneBlinkFormBase.d.ts +7 -1
- package/dist/OneBlinkFormBase.js +140 -136
- package/dist/OneBlinkFormBase.js.map +1 -1
- package/dist/components/ArcGISWebMap.js +10 -2
- package/dist/components/ArcGISWebMap.js.map +1 -1
- package/dist/hooks/useFormElementOptions.js +10 -4
- package/dist/hooks/useFormElementOptions.js.map +1 -1
- package/dist/hooks/useReplaceInjectablesOverrides.d.ts +11 -0
- package/dist/hooks/useReplaceInjectablesOverrides.js +7 -0
- package/dist/hooks/useReplaceInjectablesOverrides.js.map +1 -0
- package/dist/hooks/useReplaceableText.js +7 -4
- package/dist/hooks/useReplaceableText.js.map +1 -1
- package/dist/hooks/useUserProfileForInjectables.d.ts +4 -0
- package/dist/hooks/useUserProfileForInjectables.js +18 -0
- package/dist/hooks/useUserProfileForInjectables.js.map +1 -0
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { submissionService, attachmentsService } from '@oneblink/apps';
|
|
3
3
|
import { FormTypes, FormsAppsTypes, ScheduledTasksTypes, SubmissionTypes } from '@oneblink/types';
|
|
4
|
+
import { ReplaceInjectablesOverrides } from './hooks/useReplaceInjectablesOverrides';
|
|
4
5
|
import { CaptchaType, ExecutedLookups, SetFormSubmission } from './types/form';
|
|
5
6
|
export type OneBlinkReadOnlyFormProps = {
|
|
6
7
|
/**
|
|
@@ -26,6 +27,11 @@ export type OneBlinkReadOnlyFormProps = {
|
|
|
26
27
|
* scheduled task associated with a group via a form submission
|
|
27
28
|
*/
|
|
28
29
|
taskGroupInstance?: ScheduledTasksTypes.TaskGroupInstance;
|
|
30
|
+
/**
|
|
31
|
+
* Override the default behaviour when injecting values, such as in an info
|
|
32
|
+
* element or a default value.
|
|
33
|
+
*/
|
|
34
|
+
replaceInjectablesOverrides?: ReplaceInjectablesOverrides;
|
|
29
35
|
};
|
|
30
36
|
export type OneBlinkFormBaseProps = OneBlinkReadOnlyFormProps & {
|
|
31
37
|
/** The function to call when the user cancels the form */
|
|
@@ -131,6 +137,6 @@ export type OneBlinkFormControlledProps = {
|
|
|
131
137
|
type Props = OneBlinkFormBaseProps & OneBlinkFormControlledProps & {
|
|
132
138
|
isReadOnly: boolean;
|
|
133
139
|
};
|
|
134
|
-
declare function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captchaSiteKey, definition, disabled, isPreview, submission, isReadOnly, onCancel, onSubmit, onSaveDraft, setFormSubmission, buttons, primaryColour, attachmentRetentionInDays, isPendingQueueEnabled, handleNavigateAway, isInfoPage: isInfoPageProp, lastElementUpdated, executedLookups, task, taskGroup, taskGroupInstance, onUploadAttachment, captchaType, shouldUseNavigableValidationErrorsNotification, navigableValidationErrorsNotificationSettings, }: Props): React.JSX.Element;
|
|
140
|
+
declare function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captchaSiteKey, definition, disabled, isPreview, submission, isReadOnly, onCancel, onSubmit, onSaveDraft, setFormSubmission, buttons, primaryColour, attachmentRetentionInDays, isPendingQueueEnabled, handleNavigateAway, isInfoPage: isInfoPageProp, lastElementUpdated, executedLookups, task, taskGroup, taskGroupInstance, onUploadAttachment, captchaType, shouldUseNavigableValidationErrorsNotification, navigableValidationErrorsNotificationSettings, replaceInjectablesOverrides, }: Props): React.JSX.Element;
|
|
135
141
|
declare const _default: React.MemoExoticComponent<typeof OneBlinkFormBase>;
|
|
136
142
|
export default _default;
|
package/dist/OneBlinkFormBase.js
CHANGED
|
@@ -15,6 +15,7 @@ import useConditionalLogic from './hooks/useConditionalLogic';
|
|
|
15
15
|
import usePages from './hooks/usePages';
|
|
16
16
|
import useLookups from './hooks/useLookups';
|
|
17
17
|
import { FormDefinitionContext } from './hooks/useFormDefinition';
|
|
18
|
+
import { ReplaceInjectablesOverridesContext, } from './hooks/useReplaceInjectablesOverrides';
|
|
18
19
|
import { InjectPagesContext } from './hooks/useInjectPages';
|
|
19
20
|
import { FormElementOptionsContextProvider } from './hooks/useDynamicOptionsLoaderState';
|
|
20
21
|
import { FormElementLookupsContextProvider } from './hooks/useFormElementLookups';
|
|
@@ -37,10 +38,12 @@ import { injectOptionsAcrossAllElements } from './services/injectableOptions';
|
|
|
37
38
|
import MaterialIcon from './components/MaterialIcon';
|
|
38
39
|
import ValidationErrorsCard from './components/ValidationErrorsCard';
|
|
39
40
|
import { sendGoogleAnalyticsEvent } from './utils/sendGoogleAnalyticsEvent';
|
|
40
|
-
|
|
41
|
+
import { useUserProfileForInjectablesOutsideContext } from './hooks/useUserProfileForInjectables';
|
|
42
|
+
function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captchaSiteKey, definition, disabled, isPreview, submission, isReadOnly, onCancel, onSubmit, onSaveDraft, setFormSubmission, buttons, primaryColour, attachmentRetentionInDays, isPendingQueueEnabled, handleNavigateAway, isInfoPage: isInfoPageProp, lastElementUpdated, executedLookups, task, taskGroup, taskGroupInstance, onUploadAttachment, captchaType, shouldUseNavigableValidationErrorsNotification = true, navigableValidationErrorsNotificationSettings, replaceInjectablesOverrides, }) {
|
|
41
43
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
42
44
|
const isOffline = useIsOffline();
|
|
43
|
-
const { isUsingFormsKey
|
|
45
|
+
const { isUsingFormsKey } = useAuth();
|
|
46
|
+
const userProfileForInjectables = useUserProfileForInjectablesOutsideContext(replaceInjectablesOverrides === null || replaceInjectablesOverrides === void 0 ? void 0 : replaceInjectablesOverrides.getUserProfile);
|
|
44
47
|
const captchasRef = React.useRef([]);
|
|
45
48
|
const theme = React.useMemo(() => createMuiTheme({
|
|
46
49
|
palette: {
|
|
@@ -434,7 +437,7 @@ function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captc
|
|
|
434
437
|
elements: definition.elements,
|
|
435
438
|
submission: submissionData.submission,
|
|
436
439
|
taskContext: taskContextValue,
|
|
437
|
-
userProfile:
|
|
440
|
+
userProfile: userProfileForInjectables,
|
|
438
441
|
});
|
|
439
442
|
setIsPreparingToSubmit(false);
|
|
440
443
|
resetRecaptchas();
|
|
@@ -460,7 +463,7 @@ function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captc
|
|
|
460
463
|
allowNavigation,
|
|
461
464
|
definition,
|
|
462
465
|
taskContextValue,
|
|
463
|
-
|
|
466
|
+
userProfileForInjectables,
|
|
464
467
|
resetRecaptchas,
|
|
465
468
|
onSubmit,
|
|
466
469
|
captchaSiteKey,
|
|
@@ -623,142 +626,143 @@ function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captc
|
|
|
623
626
|
}
|
|
624
627
|
return (React.createElement(ThemeProvider, { theme: theme },
|
|
625
628
|
React.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns },
|
|
626
|
-
React.createElement(
|
|
627
|
-
React.createElement(
|
|
628
|
-
React.createElement(
|
|
629
|
-
React.createElement(
|
|
630
|
-
React.createElement(
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
React.createElement("
|
|
635
|
-
React.createElement("div",
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
}) },
|
|
639
|
-
React.createElement("div", { className: clsx('ob-steps-navigation__header', {
|
|
640
|
-
'is-active': isStepsHeaderActive,
|
|
641
|
-
}), onClick: toggleStepsNavigation },
|
|
642
|
-
React.createElement("span", { className: "icon is-invisible" },
|
|
643
|
-
React.createElement(MaterialIcon, null, "keyboard_arrow_down")),
|
|
644
|
-
React.createElement("div", { className: "steps-header-active-page" },
|
|
645
|
-
isDisplayingCurrentPageError ? (React.createElement("span", { className: "icon" },
|
|
646
|
-
React.createElement(MaterialIcon, { className: "has-text-danger is-size-4" }, "warning"))) : (React.createElement("span", { className: "steps-header-active-page-icon" }, currentPageNumber)),
|
|
647
|
-
React.createElement("span", { className: "steps-header-active-page-label cypress-tablet-step-title" }, currentPage ? currentPage.label : '')),
|
|
648
|
-
React.createElement("span", { className: "dropdown icon" },
|
|
649
|
-
React.createElement(MaterialIcon, null, "keyboard_arrow_down"))),
|
|
650
|
-
React.createElement("div", { className: clsx('ob-steps-navigation__steps', {
|
|
629
|
+
React.createElement(ReplaceInjectablesOverridesContext.Provider, { value: replaceInjectablesOverrides },
|
|
630
|
+
React.createElement(FormDefinitionContext.Provider, { value: definition },
|
|
631
|
+
React.createElement(FormElementOptionsContextProvider, null,
|
|
632
|
+
React.createElement(FormElementLookupsContextProvider, null,
|
|
633
|
+
React.createElement(OneBlinkFormContainerContext.Provider, { value: obFormContainerHTMLElementRef.current },
|
|
634
|
+
React.createElement("div", { className: clsx('ob-form-container', {
|
|
635
|
+
'is-showing-pages': isShowingMultiplePages,
|
|
636
|
+
}), ref: obFormContainerHTMLElementRef },
|
|
637
|
+
React.createElement("form", { name: "obForm", className: `ob-form cypress-ob-form ob-form__page-${currentPageIndex + 1}`, noValidate: true, onSubmit: (e) => handleSubmit(e, false) },
|
|
638
|
+
React.createElement("div", null,
|
|
639
|
+
React.createElement("div", { ref: scrollToTopOfPageHTMLElementRef }),
|
|
640
|
+
isShowingMultiplePages && (React.createElement("div", { className: clsx('ob-steps-navigation', {
|
|
651
641
|
'is-active': isStepsHeaderActive,
|
|
652
642
|
}) },
|
|
653
|
-
React.createElement("div", { className:
|
|
654
|
-
|
|
655
|
-
|
|
643
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__header', {
|
|
644
|
+
'is-active': isStepsHeaderActive,
|
|
645
|
+
}), onClick: toggleStepsNavigation },
|
|
646
|
+
React.createElement("span", { className: "icon is-invisible" },
|
|
647
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_down")),
|
|
648
|
+
React.createElement("div", { className: "steps-header-active-page" },
|
|
649
|
+
isDisplayingCurrentPageError ? (React.createElement("span", { className: "icon" },
|
|
650
|
+
React.createElement(MaterialIcon, { className: "has-text-danger is-size-4" }, "warning"))) : (React.createElement("span", { className: "steps-header-active-page-icon" }, currentPageNumber)),
|
|
651
|
+
React.createElement("span", { className: "steps-header-active-page-label cypress-tablet-step-title" }, currentPage ? currentPage.label : '')),
|
|
652
|
+
React.createElement("span", { className: "dropdown icon" },
|
|
653
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_down"))),
|
|
654
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__steps', {
|
|
655
|
+
'is-active': isStepsHeaderActive,
|
|
656
|
+
}) },
|
|
657
|
+
React.createElement("div", { className: "steps is-small is-horizontal-tablet cypress-steps" }, visiblePages.map((page, index) => {
|
|
658
|
+
const hasErrors = checkDisplayPageError(page);
|
|
659
|
+
return (React.createElement("div", { key: page.id, id: `steps-navigation-step-${page.id}`, className: clsx('step-item cypress-step-item', {
|
|
660
|
+
'is-active': currentPage.id === page.id,
|
|
661
|
+
'is-completed': currentPageIndex > index,
|
|
662
|
+
'is-error': hasErrors,
|
|
663
|
+
}), onClick: (e) => {
|
|
664
|
+
e.stopPropagation();
|
|
665
|
+
if (page.id !== currentPage.id) {
|
|
666
|
+
setPageId(page.id);
|
|
667
|
+
}
|
|
668
|
+
} },
|
|
669
|
+
React.createElement("div", { className: "step-marker step-marker-error ob-step-marker cypress-step-marker",
|
|
670
|
+
// @ts-expect-error ???
|
|
671
|
+
name: `cypress-page-stepper-${index + 1}`, value: index + 1 }, hasErrors ? (React.createElement(Tooltip, { title: "Page has errors" },
|
|
672
|
+
React.createElement("span", { className: "icon tooltip has-tooltip-top cypress-page-error" },
|
|
673
|
+
React.createElement(MaterialIcon, { className: "has-text-danger is-size-3" }, "warning")))) : (React.createElement("span", null, index + 1))),
|
|
674
|
+
React.createElement("div", { className: "step-details ob-step-details" },
|
|
675
|
+
React.createElement("p", { className: "step-title ob-step-title cypress-desktop-step-title", id: `steps-navigation-step-label-${page.id}` }, page.label))));
|
|
676
|
+
}))))),
|
|
677
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__background', {
|
|
678
|
+
'is-active': isStepsHeaderActive,
|
|
679
|
+
}), onClick: toggleStepsNavigation }),
|
|
680
|
+
React.createElement("div", { className: "steps" },
|
|
681
|
+
React.createElement("div", { className: clsx('steps-content', {
|
|
682
|
+
'is-single-step': !isShowingMultiplePages,
|
|
683
|
+
}) },
|
|
684
|
+
React.createElement(InjectPagesContext.Provider, { value: handlePagesLookupResult },
|
|
685
|
+
React.createElement(GoogleMapsApiKeyContext.Provider, { value: googleMapsApiKey },
|
|
686
|
+
React.createElement(AbnLookupAuthenticationGuidContext.Provider, { value: abnLookupAuthenticationGuid },
|
|
687
|
+
React.createElement(CaptchaContext.Provider, { value: captchaContextValue },
|
|
688
|
+
React.createElement(AttachmentBlobsProvider, null,
|
|
689
|
+
React.createElement(FormIsReadOnlyContext.Provider, { value: isReadOnly },
|
|
690
|
+
React.createElement(TaskContext.Provider, { value: taskContextValue },
|
|
691
|
+
React.createElement(OnUploadAttachmentContext.Provider, { value: onUploadAttachment }, visiblePages.map((pageElement) => (React.createElement(PageFormElements, { key: pageElement.id, isActive: pageElement.id ===
|
|
692
|
+
currentPage.id, formId: definition.id, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, displayValidationMessages: hasAttemptedSubmit ||
|
|
693
|
+
isDisplayingCurrentPageError, pageElement: pageElement, onChange: handleChange, model: submission, setFormSubmission: setFormSubmission })))))))))))),
|
|
694
|
+
isShowingMultiplePages && (React.createElement("div", { className: "steps-actions" },
|
|
695
|
+
React.createElement("div", { className: "steps-action" },
|
|
696
|
+
React.createElement("button", { type: "button", onClick: goToPreviousPage, disabled: isFirstVisiblePage, className: "button is-light cypress-pages-previous" },
|
|
697
|
+
React.createElement("span", { className: "icon" },
|
|
698
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_left")),
|
|
699
|
+
React.createElement("span", null, "Back"))),
|
|
700
|
+
React.createElement("div", { className: "step-progress-mobile cypress-steps-mobile" }, visiblePages.map((page, index) => (React.createElement("div", { key: page.id, className: clsx('step-progress-mobile-dot', {
|
|
656
701
|
'is-active': currentPage.id === page.id,
|
|
657
702
|
'is-completed': currentPageIndex > index,
|
|
658
|
-
'
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
React.createElement("
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
!submissionConditionallyEnabled },
|
|
722
|
-
React.createElement(CustomisableButtonInner, { label: isInfoPage
|
|
723
|
-
? 'Done'
|
|
724
|
-
: ((_e = buttons === null || buttons === void 0 ? void 0 : buttons.submit) === null || _e === void 0 ? void 0 : _e.label) || 'Submit', icon: (_f = buttons === null || buttons === void 0 ? void 0 : buttons.submit) === null || _f === void 0 ? void 0 : _f.icon })))))))),
|
|
725
|
-
!isReadOnly && !isPreview && (React.createElement(React.Fragment, null,
|
|
726
|
-
React.createElement(Prompt, { when: isDirty && !isNavigationAllowed, message: handleBlockedNavigation }),
|
|
727
|
-
React.createElement(Modal, { isOpen: hasConfirmedNavigation === false, title: "Unsaved Changes", cardClassName: "cypress-cancel-confirm", titleClassName: "cypress-cancel-confirm-title", bodyClassName: "cypress-cancel-confirm-body", actions: React.createElement(React.Fragment, null,
|
|
728
|
-
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button is-success cypress-cancel-confirm-save-draft", onClick: () => handleSaveDraft(false) },
|
|
729
|
-
React.createElement(CustomisableButtonInner, { label: ((_g = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _g === void 0 ? void 0 : _g.label) || 'Save Draft', icon: (_h = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _h === void 0 ? void 0 : _h.icon }))),
|
|
730
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
731
|
-
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-cancel-confirm-back", onClick: handleKeepGoing },
|
|
732
|
-
React.createElement(CustomisableButtonInner, { label: ((_j = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptNo) === null || _j === void 0 ? void 0 : _j.label) || 'Back', icon: (_k = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptNo) === null || _k === void 0 ? void 0 : _k.icon })),
|
|
733
|
-
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-cancel-confirm-discard", onClick: handleDiscardUnsavedChanges, autoFocus: true },
|
|
734
|
-
React.createElement(CustomisableButtonInner, { label: ((_l = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptYes) === null || _l === void 0 ? void 0 : _l.label) || 'Discard', icon: (_m = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptYes) === null || _m === void 0 ? void 0 : _m.icon }))) },
|
|
735
|
-
React.createElement("p", null, "You have unsaved changes, are you sure you want discard them?")),
|
|
736
|
-
React.createElement(Modal, { isOpen: promptUploadingAttachments === true, title: "Attachment upload in progress", cardClassName: "cypress-attachments-wait-continue", titleClassName: "cypress-attachments-confirm-wait-title", bodyClassName: "cypress-attachments-confirm-wait-body", actions: React.createElement(React.Fragment, null,
|
|
737
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
738
|
-
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-attachments-confirm-wait", onClick: handleWaitForAttachments }, "Wait"),
|
|
739
|
-
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-attachments-confirm-continue", onClick: handleContinueWithAttachments, autoFocus: true }, "Continue")) },
|
|
740
|
-
React.createElement("p", null, "Your attachments are still uploading, do you want to wait for the uploads to complete or continue using the app? If you click continue the attachments will upload in the background. Do not close the app until the upload has been completed.")),
|
|
741
|
-
React.createElement(Modal, { isOpen: promptOfflineSubmissionAttempt, title: "It looks like you're Offline", className: "ob-modal__offline-submission-attempt", cardClassName: "cypress-submission-offline has-text-centered", titleClassName: "cypress-offline-title", bodyClassName: "cypress-offline-body", actions: React.createElement(React.Fragment, null,
|
|
742
|
-
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button ob-button__offline-submission-attempt-save-draft is-success", onClick: () => handleSaveDraft(false) },
|
|
743
|
-
React.createElement(CustomisableButtonInner, { label: ((_o = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _o === void 0 ? void 0 : _o.label) || 'Save Draft', icon: (_p = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _p === void 0 ? void 0 : _p.icon }))),
|
|
744
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
745
|
-
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-cancel is-light", onClick: () => setPromptOfflineSubmissionAttempt(false) }, "Cancel"),
|
|
746
|
-
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-try-again is-primary", onClick: (e) => {
|
|
747
|
-
setPromptOfflineSubmissionAttempt(false);
|
|
748
|
-
handleSubmit(e, false);
|
|
749
|
-
}, autoFocus: true }, "Try Again")) },
|
|
750
|
-
React.createElement("p", { className: "ob-modal__offline-submission-attempt-message" },
|
|
751
|
-
"You cannot submit this form while offline, please try again when connectivity is restored.",
|
|
752
|
-
onSaveDraft && (React.createElement("span", { className: "ob-modal__offline-submission-attempt-save-draft-message" },
|
|
753
|
-
' ',
|
|
754
|
-
"Alternatively, click the",
|
|
755
|
-
' ',
|
|
756
|
-
React.createElement("b", null, ((_q = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _q === void 0 ? void 0 : _q.label) || 'Save Draft'),
|
|
757
|
-
' ',
|
|
758
|
-
"button below to come back to this later."))),
|
|
759
|
-
React.createElement(MaterialIcon, { className: "has-text-warning icon-x-large ob-modal__offline-submission-attempt-icon" }, "wifi_off")))),
|
|
760
|
-
shouldUseNavigableValidationErrorsNotification &&
|
|
761
|
-
isShowingValidationErrorsCard && (React.createElement(ValidationErrorsCard, { visiblePages: visiblePages, formElementsValidation: formElementsValidation, setPageId: setPageId, currentPage: currentPage, navigationTopOffset: (_r = navigableValidationErrorsNotificationSettings === null || navigableValidationErrorsNotificationSettings === void 0 ? void 0 : navigableValidationErrorsNotificationSettings.navigationTopOffset) !== null && _r !== void 0 ? _r : 'CALCULATE', scrollableContainerId: navigableValidationErrorsNotificationSettings === null || navigableValidationErrorsNotificationSettings === void 0 ? void 0 : navigableValidationErrorsNotificationSettings.scrollableContainerId, validationErrorToastFocusElementRef: validationErrorToastFocusElementRef }))))))))));
|
|
703
|
+
'has-background-danger': currentPage.id !== page.id &&
|
|
704
|
+
checkDisplayPageError(page),
|
|
705
|
+
}) })))),
|
|
706
|
+
React.createElement("div", { className: "steps-action" },
|
|
707
|
+
React.createElement("button", { type: "button", onClick: goToNextPage, disabled: isLastVisiblePage, className: "button is-light cypress-pages-next" },
|
|
708
|
+
React.createElement("span", null, "Next"),
|
|
709
|
+
React.createElement("span", { className: "icon" },
|
|
710
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_right"))))))),
|
|
711
|
+
!isReadOnly && (React.createElement("div", { className: "buttons ob-buttons ob-buttons-submit" },
|
|
712
|
+
onSaveDraft && !isInfoPage && (React.createElement("button", { type: "button", className: "button ob-button is-primary ob-button-save-draft cypress-save-draft-form", onClick: () => handleSaveDraft(false), disabled: isPreview || disabled },
|
|
713
|
+
React.createElement(CustomisableButtonInner, { label: ((_a = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _a === void 0 ? void 0 : _a.label) || 'Save Draft', icon: (_b = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _b === void 0 ? void 0 : _b.icon }))),
|
|
714
|
+
React.createElement("span", { className: "ob-buttons-submit__spacer" }),
|
|
715
|
+
!isInfoPage && (React.createElement("button", { type: "button", className: "button ob-button is-light ob-button-submit-cancel cypress-cancel-form", onClick: handleCancel, disabled: isPreview || disabled },
|
|
716
|
+
React.createElement(CustomisableButtonInner, { label: ((_c = buttons === null || buttons === void 0 ? void 0 : buttons.cancel) === null || _c === void 0 ? void 0 : _c.label) || 'Cancel', icon: (_d = buttons === null || buttons === void 0 ? void 0 : buttons.cancel) === null || _d === void 0 ? void 0 : _d.icon }))),
|
|
717
|
+
isLastVisiblePage && (React.createElement(Tooltip, { title: submissionConditionallyEnabled
|
|
718
|
+
? ''
|
|
719
|
+
: 'Submission disabled: Your inputs have not met the criteria for submission' },
|
|
720
|
+
React.createElement("button", { type: "submit", className: clsx('button ob-button is-success ob-button-submit cypress-submit-form-button cypress-submit-form', { 'is-loading': isPreparingToSubmit }, {
|
|
721
|
+
'ob-button-submit-is-disabled': submissionConditionallyEnabled,
|
|
722
|
+
}), disabled: isPreview ||
|
|
723
|
+
disabled ||
|
|
724
|
+
isPreparingToSubmit ||
|
|
725
|
+
!submissionConditionallyEnabled },
|
|
726
|
+
React.createElement(CustomisableButtonInner, { label: isInfoPage
|
|
727
|
+
? 'Done'
|
|
728
|
+
: ((_e = buttons === null || buttons === void 0 ? void 0 : buttons.submit) === null || _e === void 0 ? void 0 : _e.label) || 'Submit', icon: (_f = buttons === null || buttons === void 0 ? void 0 : buttons.submit) === null || _f === void 0 ? void 0 : _f.icon })))))))),
|
|
729
|
+
!isReadOnly && !isPreview && (React.createElement(React.Fragment, null,
|
|
730
|
+
React.createElement(Prompt, { when: isDirty && !isNavigationAllowed, message: handleBlockedNavigation }),
|
|
731
|
+
React.createElement(Modal, { isOpen: hasConfirmedNavigation === false, title: "Unsaved Changes", cardClassName: "cypress-cancel-confirm", titleClassName: "cypress-cancel-confirm-title", bodyClassName: "cypress-cancel-confirm-body", actions: React.createElement(React.Fragment, null,
|
|
732
|
+
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button is-success cypress-cancel-confirm-save-draft", onClick: () => handleSaveDraft(false) },
|
|
733
|
+
React.createElement(CustomisableButtonInner, { label: ((_g = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _g === void 0 ? void 0 : _g.label) || 'Save Draft', icon: (_h = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _h === void 0 ? void 0 : _h.icon }))),
|
|
734
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
735
|
+
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-cancel-confirm-back", onClick: handleKeepGoing },
|
|
736
|
+
React.createElement(CustomisableButtonInner, { label: ((_j = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptNo) === null || _j === void 0 ? void 0 : _j.label) || 'Back', icon: (_k = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptNo) === null || _k === void 0 ? void 0 : _k.icon })),
|
|
737
|
+
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-cancel-confirm-discard", onClick: handleDiscardUnsavedChanges, autoFocus: true },
|
|
738
|
+
React.createElement(CustomisableButtonInner, { label: ((_l = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptYes) === null || _l === void 0 ? void 0 : _l.label) || 'Discard', icon: (_m = buttons === null || buttons === void 0 ? void 0 : buttons.cancelPromptYes) === null || _m === void 0 ? void 0 : _m.icon }))) },
|
|
739
|
+
React.createElement("p", null, "You have unsaved changes, are you sure you want discard them?")),
|
|
740
|
+
React.createElement(Modal, { isOpen: promptUploadingAttachments === true, title: "Attachment upload in progress", cardClassName: "cypress-attachments-wait-continue", titleClassName: "cypress-attachments-confirm-wait-title", bodyClassName: "cypress-attachments-confirm-wait-body", actions: React.createElement(React.Fragment, null,
|
|
741
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
742
|
+
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-attachments-confirm-wait", onClick: handleWaitForAttachments }, "Wait"),
|
|
743
|
+
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-attachments-confirm-continue", onClick: handleContinueWithAttachments, autoFocus: true }, "Continue")) },
|
|
744
|
+
React.createElement("p", null, "Your attachments are still uploading, do you want to wait for the uploads to complete or continue using the app? If you click continue the attachments will upload in the background. Do not close the app until the upload has been completed.")),
|
|
745
|
+
React.createElement(Modal, { isOpen: promptOfflineSubmissionAttempt, title: "It looks like you're Offline", className: "ob-modal__offline-submission-attempt", cardClassName: "cypress-submission-offline has-text-centered", titleClassName: "cypress-offline-title", bodyClassName: "cypress-offline-body", actions: React.createElement(React.Fragment, null,
|
|
746
|
+
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button ob-button__offline-submission-attempt-save-draft is-success", onClick: () => handleSaveDraft(false) },
|
|
747
|
+
React.createElement(CustomisableButtonInner, { label: ((_o = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _o === void 0 ? void 0 : _o.label) || 'Save Draft', icon: (_p = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _p === void 0 ? void 0 : _p.icon }))),
|
|
748
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
749
|
+
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-cancel is-light", onClick: () => setPromptOfflineSubmissionAttempt(false) }, "Cancel"),
|
|
750
|
+
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-try-again is-primary", onClick: (e) => {
|
|
751
|
+
setPromptOfflineSubmissionAttempt(false);
|
|
752
|
+
handleSubmit(e, false);
|
|
753
|
+
}, autoFocus: true }, "Try Again")) },
|
|
754
|
+
React.createElement("p", { className: "ob-modal__offline-submission-attempt-message" },
|
|
755
|
+
"You cannot submit this form while offline, please try again when connectivity is restored.",
|
|
756
|
+
onSaveDraft && (React.createElement("span", { className: "ob-modal__offline-submission-attempt-save-draft-message" },
|
|
757
|
+
' ',
|
|
758
|
+
"Alternatively, click the",
|
|
759
|
+
' ',
|
|
760
|
+
React.createElement("b", null, ((_q = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _q === void 0 ? void 0 : _q.label) || 'Save Draft'),
|
|
761
|
+
' ',
|
|
762
|
+
"button below to come back to this later."))),
|
|
763
|
+
React.createElement(MaterialIcon, { className: "has-text-warning icon-x-large ob-modal__offline-submission-attempt-icon" }, "wifi_off")))),
|
|
764
|
+
shouldUseNavigableValidationErrorsNotification &&
|
|
765
|
+
isShowingValidationErrorsCard && (React.createElement(ValidationErrorsCard, { visiblePages: visiblePages, formElementsValidation: formElementsValidation, setPageId: setPageId, currentPage: currentPage, navigationTopOffset: (_r = navigableValidationErrorsNotificationSettings === null || navigableValidationErrorsNotificationSettings === void 0 ? void 0 : navigableValidationErrorsNotificationSettings.navigationTopOffset) !== null && _r !== void 0 ? _r : 'CALCULATE', scrollableContainerId: navigableValidationErrorsNotificationSettings === null || navigableValidationErrorsNotificationSettings === void 0 ? void 0 : navigableValidationErrorsNotificationSettings.scrollableContainerId, validationErrorToastFocusElementRef: validationErrorToastFocusElementRef })))))))))));
|
|
762
766
|
}
|
|
763
767
|
export default React.memo(OneBlinkFormBase);
|
|
764
768
|
//# sourceMappingURL=OneBlinkFormBase.js.map
|