@oneblink/apps-react 7.3.0-beta.2 → 8.0.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 +1 -2
- package/dist/OneBlinkFormBase.js +137 -135
- package/dist/OneBlinkFormBase.js.map +1 -1
- package/dist/components/renderer/PageFormElements.js +1 -2
- package/dist/components/renderer/PageFormElements.js.map +1 -1
- package/dist/form-elements/FormElementDate.js +32 -35
- package/dist/form-elements/FormElementDate.js.map +1 -1
- package/dist/form-elements/FormElementDateTime.js +31 -39
- package/dist/form-elements/FormElementDateTime.js.map +1 -1
- package/dist/form-elements/FormElementTime.js +29 -32
- package/dist/form-elements/FormElementTime.js.map +1 -1
- package/dist/hooks/form-date-picker/useFormDatePickerProps.d.ts +27 -0
- package/dist/hooks/form-date-picker/useFormDatePickerProps.js +56 -0
- package/dist/hooks/form-date-picker/useFormDatePickerProps.js.map +1 -0
- package/dist/styles.css +0 -915
- package/dist/styles.scss +0 -2
- package/package.json +1 -2
- package/dist/hooks/useFlatpickr.d.ts +0 -14
- package/dist/hooks/useFlatpickr.js +0 -111
- package/dist/hooks/useFlatpickr.js.map +0 -1
- package/dist/hooks/useFlatpickrGuid.d.ts +0 -7
- package/dist/hooks/useFlatpickrGuid.js +0 -12
- package/dist/hooks/useFlatpickrGuid.js.map +0 -1
- package/dist/styles/date.scss +0 -7
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { submissionService } from '@oneblink/apps';
|
|
2
|
+
import { submissionService, attachmentsService } from '@oneblink/apps';
|
|
3
3
|
import { FormTypes, FormsAppsTypes, ScheduledTasksTypes, SubmissionTypes } from '@oneblink/types';
|
|
4
|
-
import { attachmentsService } from '@oneblink/apps';
|
|
5
4
|
import { CaptchaType, ExecutedLookups, SetFormSubmission } from './types/form';
|
|
6
5
|
export type OneBlinkReadOnlyFormProps = {
|
|
7
6
|
/**
|
package/dist/OneBlinkFormBase.js
CHANGED
|
@@ -4,8 +4,9 @@ import Tooltip from './components/renderer/Tooltip';
|
|
|
4
4
|
import { Prompt, useHistory } from 'react-router-dom';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
6
|
import * as bulmaToast from 'bulma-toast';
|
|
7
|
-
import { localisationService } from '@oneblink/apps';
|
|
8
|
-
import {
|
|
7
|
+
import { localisationService, attachmentsService, } from '@oneblink/apps';
|
|
8
|
+
import { LocalizationProvider } from '@mui/x-date-pickers';
|
|
9
|
+
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
|
9
10
|
import Modal from './components/renderer/Modal';
|
|
10
11
|
import cleanFormSubmissionModel from './services/cleanFormSubmissionModel';
|
|
11
12
|
import PageFormElements from './components/renderer/PageFormElements';
|
|
@@ -598,143 +599,144 @@ function OneBlinkFormBase({ googleMapsApiKey, abnLookupAuthenticationGuid, captc
|
|
|
598
599
|
React.createElement("p", { className: "has-text-grey" }, localisationService.formatDatetimeLong(new Date())))));
|
|
599
600
|
}
|
|
600
601
|
return (React.createElement(ThemeProvider, { theme: theme },
|
|
601
|
-
React.createElement(
|
|
602
|
-
React.createElement(
|
|
603
|
-
React.createElement(
|
|
604
|
-
React.createElement(
|
|
605
|
-
React.createElement(
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
React.createElement("
|
|
610
|
-
React.createElement("div",
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
}) },
|
|
614
|
-
React.createElement("div", { className: clsx('ob-steps-navigation__header', {
|
|
615
|
-
'is-active': isStepsHeaderActive,
|
|
616
|
-
}), onClick: toggleStepsNavigation },
|
|
617
|
-
React.createElement("span", { className: "icon is-invisible" },
|
|
618
|
-
React.createElement(MaterialIcon, null, "keyboard_arrow_down")),
|
|
619
|
-
React.createElement("div", { className: "steps-header-active-page" },
|
|
620
|
-
isDisplayingCurrentPageError ? (React.createElement("span", { className: "icon" },
|
|
621
|
-
React.createElement(MaterialIcon, { className: "has-text-danger is-size-4" }, "warning"))) : (React.createElement("span", { className: "steps-header-active-page-icon" }, currentPageNumber)),
|
|
622
|
-
React.createElement("span", { className: "steps-header-active-page-label cypress-tablet-step-title" }, currentPage ? currentPage.label : '')),
|
|
623
|
-
React.createElement("span", { className: "dropdown icon" },
|
|
624
|
-
React.createElement(MaterialIcon, null, "keyboard_arrow_down"))),
|
|
625
|
-
React.createElement("div", { className: clsx('ob-steps-navigation__steps', {
|
|
602
|
+
React.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns },
|
|
603
|
+
React.createElement(FormDefinitionContext.Provider, { value: definition },
|
|
604
|
+
React.createElement(FormElementOptionsContextProvider, null,
|
|
605
|
+
React.createElement(FormElementLookupsContextProvider, null,
|
|
606
|
+
React.createElement(OneBlinkFormContainerContext.Provider, { value: obFormContainerHTMLElementRef.current },
|
|
607
|
+
React.createElement("div", { className: clsx('ob-form-container', {
|
|
608
|
+
'is-showing-pages': isShowingMultiplePages,
|
|
609
|
+
}), ref: obFormContainerHTMLElementRef },
|
|
610
|
+
React.createElement("form", { name: "obForm", className: `ob-form cypress-ob-form ob-form__page-${currentPageIndex + 1}`, noValidate: true, onSubmit: (e) => handleSubmit(e, false) },
|
|
611
|
+
React.createElement("div", null,
|
|
612
|
+
React.createElement("div", { ref: scrollToTopOfPageHTMLElementRef }),
|
|
613
|
+
isShowingMultiplePages && (React.createElement("div", { className: clsx('ob-steps-navigation', {
|
|
626
614
|
'is-active': isStepsHeaderActive,
|
|
627
615
|
}) },
|
|
628
|
-
React.createElement("div", { className:
|
|
629
|
-
|
|
630
|
-
|
|
616
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__header', {
|
|
617
|
+
'is-active': isStepsHeaderActive,
|
|
618
|
+
}), onClick: toggleStepsNavigation },
|
|
619
|
+
React.createElement("span", { className: "icon is-invisible" },
|
|
620
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_down")),
|
|
621
|
+
React.createElement("div", { className: "steps-header-active-page" },
|
|
622
|
+
isDisplayingCurrentPageError ? (React.createElement("span", { className: "icon" },
|
|
623
|
+
React.createElement(MaterialIcon, { className: "has-text-danger is-size-4" }, "warning"))) : (React.createElement("span", { className: "steps-header-active-page-icon" }, currentPageNumber)),
|
|
624
|
+
React.createElement("span", { className: "steps-header-active-page-label cypress-tablet-step-title" }, currentPage ? currentPage.label : '')),
|
|
625
|
+
React.createElement("span", { className: "dropdown icon" },
|
|
626
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_down"))),
|
|
627
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__steps', {
|
|
628
|
+
'is-active': isStepsHeaderActive,
|
|
629
|
+
}) },
|
|
630
|
+
React.createElement("div", { className: "steps is-small is-horizontal-tablet cypress-steps" }, visiblePages.map((page, index) => {
|
|
631
|
+
const hasErrors = checkDisplayPageError(page);
|
|
632
|
+
return (React.createElement("div", { key: page.id, id: `steps-navigation-step-${page.id}`, className: clsx('step-item cypress-step-item', {
|
|
633
|
+
'is-active': currentPage.id === page.id,
|
|
634
|
+
'is-completed': currentPageIndex > index,
|
|
635
|
+
'is-error': hasErrors,
|
|
636
|
+
}), onClick: (e) => {
|
|
637
|
+
e.stopPropagation();
|
|
638
|
+
if (page.id !== currentPage.id) {
|
|
639
|
+
setPageId(page.id);
|
|
640
|
+
}
|
|
641
|
+
} },
|
|
642
|
+
React.createElement("div", { className: "step-marker step-marker-error ob-step-marker cypress-step-marker",
|
|
643
|
+
// @ts-expect-error ???
|
|
644
|
+
name: `cypress-page-stepper-${index + 1}`, value: index + 1 }, hasErrors ? (React.createElement(Tooltip, { title: "Page has errors" },
|
|
645
|
+
React.createElement("span", { className: "icon tooltip has-tooltip-top cypress-page-error" },
|
|
646
|
+
React.createElement(MaterialIcon, { className: "has-text-danger is-size-3" }, "warning")))) : (React.createElement("span", null, index + 1))),
|
|
647
|
+
React.createElement("div", { className: "step-details ob-step-details" },
|
|
648
|
+
React.createElement("p", { className: "step-title ob-step-title cypress-desktop-step-title", id: `steps-navigation-step-label-${page.id}` }, page.label))));
|
|
649
|
+
}))))),
|
|
650
|
+
React.createElement("div", { className: clsx('ob-steps-navigation__background', {
|
|
651
|
+
'is-active': isStepsHeaderActive,
|
|
652
|
+
}), onClick: toggleStepsNavigation }),
|
|
653
|
+
React.createElement("div", { className: "steps" },
|
|
654
|
+
React.createElement("div", { className: clsx('steps-content', {
|
|
655
|
+
'is-single-step': !isShowingMultiplePages,
|
|
656
|
+
}) },
|
|
657
|
+
React.createElement(InjectPagesContext.Provider, { value: handlePagesLookupResult },
|
|
658
|
+
React.createElement(GoogleMapsApiKeyContext.Provider, { value: googleMapsApiKey },
|
|
659
|
+
React.createElement(AbnLookupAuthenticationGuidContext.Provider, { value: abnLookupAuthenticationGuid },
|
|
660
|
+
React.createElement(CaptchaContext.Provider, { value: captchaContextValue },
|
|
661
|
+
React.createElement(AttachmentBlobsProvider, null,
|
|
662
|
+
React.createElement(FormIsReadOnlyContext.Provider, { value: isReadOnly },
|
|
663
|
+
React.createElement(TaskContext.Provider, { value: taskContextValue },
|
|
664
|
+
React.createElement(OnUploadAttachmentContext.Provider, { value: onUploadAttachment }, visiblePages.map((pageElement) => (React.createElement(PageFormElements, { key: pageElement.id, isActive: pageElement.id ===
|
|
665
|
+
currentPage.id, formId: definition.id, formElementsConditionallyShown: formElementsConditionallyShown, formElementsValidation: formElementsValidation, displayValidationMessages: hasAttemptedSubmit ||
|
|
666
|
+
isDisplayingCurrentPageError, pageElement: pageElement, onChange: handleChange, model: submission, setFormSubmission: setFormSubmission })))))))))))),
|
|
667
|
+
isShowingMultiplePages && (React.createElement("div", { className: "steps-actions" },
|
|
668
|
+
React.createElement("div", { className: "steps-action" },
|
|
669
|
+
React.createElement("button", { type: "button", onClick: goToPreviousPage, disabled: isFirstVisiblePage, className: "button is-light cypress-pages-previous" },
|
|
670
|
+
React.createElement("span", { className: "icon" },
|
|
671
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_left")),
|
|
672
|
+
React.createElement("span", null, "Back"))),
|
|
673
|
+
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', {
|
|
631
674
|
'is-active': currentPage.id === page.id,
|
|
632
675
|
'is-completed': currentPageIndex > index,
|
|
633
|
-
'
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
React.createElement("
|
|
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
|
-
|
|
697
|
-
React.createElement(CustomisableButtonInner, { label: isInfoPage
|
|
698
|
-
? 'Done'
|
|
699
|
-
: ((_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 })))))))),
|
|
700
|
-
!isReadOnly && !isPreview && (React.createElement(React.Fragment, null,
|
|
701
|
-
React.createElement(Prompt, { when: isDirty && !isNavigationAllowed, message: handleBlockedNavigation }),
|
|
702
|
-
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,
|
|
703
|
-
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button is-success cypress-cancel-confirm-save-draft", onClick: () => handleSaveDraft(false) },
|
|
704
|
-
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 }))),
|
|
705
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
706
|
-
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-cancel-confirm-back", onClick: handleKeepGoing },
|
|
707
|
-
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 })),
|
|
708
|
-
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-cancel-confirm-discard", onClick: handleDiscardUnsavedChanges, autoFocus: true },
|
|
709
|
-
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 }))) },
|
|
710
|
-
React.createElement("p", null, "You have unsaved changes, are you sure you want discard them?")),
|
|
711
|
-
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,
|
|
712
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
713
|
-
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-attachments-confirm-wait", onClick: handleWaitForAttachments }, "Wait"),
|
|
714
|
-
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-attachments-confirm-continue", onClick: handleContinueWithAttachments, autoFocus: true }, "Continue")) },
|
|
715
|
-
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.")),
|
|
716
|
-
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,
|
|
717
|
-
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button ob-button__offline-submission-attempt-save-draft is-success", onClick: () => handleSaveDraft(false) },
|
|
718
|
-
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 }))),
|
|
719
|
-
React.createElement("span", { style: { flex: 1 } }),
|
|
720
|
-
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-cancel is-light", onClick: () => setPromptOfflineSubmissionAttempt(false) }, "Cancel"),
|
|
721
|
-
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-try-again is-primary", onClick: (e) => {
|
|
722
|
-
setPromptOfflineSubmissionAttempt(false);
|
|
723
|
-
handleSubmit(e, false);
|
|
724
|
-
}, autoFocus: true }, "Try Again")) },
|
|
725
|
-
React.createElement("p", { className: "ob-modal__offline-submission-attempt-message" },
|
|
726
|
-
"You cannot submit this form while offline, please try again when connectivity is restored.",
|
|
727
|
-
onSaveDraft && (React.createElement("span", { className: "ob-modal__offline-submission-attempt-save-draft-message" },
|
|
728
|
-
' ',
|
|
729
|
-
"Alternatively, click the",
|
|
730
|
-
' ',
|
|
731
|
-
React.createElement("b", null, ((_q = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _q === void 0 ? void 0 : _q.label) || 'Save Draft'),
|
|
732
|
-
' ',
|
|
733
|
-
"button below to come back to this later."))),
|
|
734
|
-
React.createElement(MaterialIcon, { className: "has-text-warning icon-x-large ob-modal__offline-submission-attempt-icon" }, "wifi_off")))),
|
|
735
|
-
shouldUseNavigableValidationErrorsNotification &&
|
|
736
|
-
!!formElementsValidation &&
|
|
737
|
-
hasAttemptedSubmit && (React.createElement(ValidationErrorsCard, { 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 })))))))));
|
|
676
|
+
'has-background-danger': currentPage.id !== page.id &&
|
|
677
|
+
checkDisplayPageError(page),
|
|
678
|
+
}) })))),
|
|
679
|
+
React.createElement("div", { className: "steps-action" },
|
|
680
|
+
React.createElement("button", { type: "button", onClick: goToNextPage, disabled: isLastVisiblePage, className: "button is-light cypress-pages-next" },
|
|
681
|
+
React.createElement("span", null, "Next"),
|
|
682
|
+
React.createElement("span", { className: "icon" },
|
|
683
|
+
React.createElement(MaterialIcon, null, "keyboard_arrow_right"))))))),
|
|
684
|
+
!isReadOnly && (React.createElement("div", { className: "buttons ob-buttons ob-buttons-submit" },
|
|
685
|
+
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 },
|
|
686
|
+
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 }))),
|
|
687
|
+
React.createElement("span", { className: "ob-buttons-submit__spacer" }),
|
|
688
|
+
!isInfoPage && (React.createElement("button", { type: "button", className: "button ob-button is-light ob-button-submit-cancel cypress-cancel-form", onClick: handleCancel, disabled: isPreview || disabled },
|
|
689
|
+
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 }))),
|
|
690
|
+
isLastVisiblePage && (React.createElement(Tooltip, { title: submissionConditionallyEnabled
|
|
691
|
+
? ''
|
|
692
|
+
: 'Submission disabled: Your inputs have not met the criteria for submission' },
|
|
693
|
+
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 }, {
|
|
694
|
+
'ob-button-submit-is-disabled': submissionConditionallyEnabled,
|
|
695
|
+
}), disabled: isPreview ||
|
|
696
|
+
disabled ||
|
|
697
|
+
isPreparingToSubmit ||
|
|
698
|
+
!submissionConditionallyEnabled },
|
|
699
|
+
React.createElement(CustomisableButtonInner, { label: isInfoPage
|
|
700
|
+
? 'Done'
|
|
701
|
+
: ((_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 })))))))),
|
|
702
|
+
!isReadOnly && !isPreview && (React.createElement(React.Fragment, null,
|
|
703
|
+
React.createElement(Prompt, { when: isDirty && !isNavigationAllowed, message: handleBlockedNavigation }),
|
|
704
|
+
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,
|
|
705
|
+
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button is-success cypress-cancel-confirm-save-draft", onClick: () => handleSaveDraft(false) },
|
|
706
|
+
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 }))),
|
|
707
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
708
|
+
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-cancel-confirm-back", onClick: handleKeepGoing },
|
|
709
|
+
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 })),
|
|
710
|
+
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-cancel-confirm-discard", onClick: handleDiscardUnsavedChanges, autoFocus: true },
|
|
711
|
+
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 }))) },
|
|
712
|
+
React.createElement("p", null, "You have unsaved changes, are you sure you want discard them?")),
|
|
713
|
+
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,
|
|
714
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
715
|
+
React.createElement("button", { type: "button", className: "button ob-button is-light cypress-attachments-confirm-wait", onClick: handleWaitForAttachments }, "Wait"),
|
|
716
|
+
React.createElement("button", { type: "button", className: "button ob-button is-primary cypress-attachments-confirm-continue", onClick: handleContinueWithAttachments, autoFocus: true }, "Continue")) },
|
|
717
|
+
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.")),
|
|
718
|
+
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,
|
|
719
|
+
onSaveDraft && (React.createElement("button", { type: "button", className: "button ob-button ob-button__offline-submission-attempt-save-draft is-success", onClick: () => handleSaveDraft(false) },
|
|
720
|
+
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 }))),
|
|
721
|
+
React.createElement("span", { style: { flex: 1 } }),
|
|
722
|
+
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-cancel is-light", onClick: () => setPromptOfflineSubmissionAttempt(false) }, "Cancel"),
|
|
723
|
+
React.createElement("button", { className: "button ob-button ob-button__offline-submission-attempt-try-again is-primary", onClick: (e) => {
|
|
724
|
+
setPromptOfflineSubmissionAttempt(false);
|
|
725
|
+
handleSubmit(e, false);
|
|
726
|
+
}, autoFocus: true }, "Try Again")) },
|
|
727
|
+
React.createElement("p", { className: "ob-modal__offline-submission-attempt-message" },
|
|
728
|
+
"You cannot submit this form while offline, please try again when connectivity is restored.",
|
|
729
|
+
onSaveDraft && (React.createElement("span", { className: "ob-modal__offline-submission-attempt-save-draft-message" },
|
|
730
|
+
' ',
|
|
731
|
+
"Alternatively, click the",
|
|
732
|
+
' ',
|
|
733
|
+
React.createElement("b", null, ((_q = buttons === null || buttons === void 0 ? void 0 : buttons.saveDraft) === null || _q === void 0 ? void 0 : _q.label) || 'Save Draft'),
|
|
734
|
+
' ',
|
|
735
|
+
"button below to come back to this later."))),
|
|
736
|
+
React.createElement(MaterialIcon, { className: "has-text-warning icon-x-large ob-modal__offline-submission-attempt-icon" }, "wifi_off")))),
|
|
737
|
+
shouldUseNavigableValidationErrorsNotification &&
|
|
738
|
+
!!formElementsValidation &&
|
|
739
|
+
hasAttemptedSubmit && (React.createElement(ValidationErrorsCard, { 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 }))))))))));
|
|
738
740
|
}
|
|
739
741
|
export default React.memo(OneBlinkFormBase);
|
|
740
742
|
//# sourceMappingURL=OneBlinkFormBase.js.map
|