@oneblink/apps-react 8.14.0-beta.2 → 9.0.0-beta.1

package/dist/components/QuillHTML.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 export default function QuillHTML({ html, ...props }: React.ComponentProps<'div'> & {
     html: string;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/QuillHTML.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import clsx from 'clsx';
 import sanitizeHtml from '../services/sanitize-html';
@@ -7,7 +8,7 @@ export default function QuillHTML({ html, ...props }) {
         const quillLegacyListsIndicator = 'ql-indent-';
         return [sanitizedHtml, sanitizedHtml.includes(quillLegacyListsIndicator)];
     }, [html]);
-    return (React.createElement("div", { ...props, className: clsx(props.className, 'ob-quill-content', {
+    return (_jsx("div", { ...props, className: clsx(props.className, 'ob-quill-content', {
             'ob-quill-legacy-content': includesLegacyLists,
             // "content" is a bulma class: https://bulma.io/documentation/elements/content/
             content: !includesLegacyLists,

package/dist/components/QuillHTML.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuillHTML.js","sourceRoot":"","sources":["../../src/components/QuillHTML.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,YAAY,MAAM,2BAA2B,CAAA;AAEpD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,IAAI,EACJ,GAAG,KAAK,EAGT;IACC,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACvD,MAAM,aAAa,GAAG,YAAY,CAAC,IAAI,CAAC,CAAA;QACxC,MAAM,yBAAyB,GAAG,YAAY,CAAA;QAC9C,OAAO,CAAC,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,CAAC,CAAA;IAC3E,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IACV,OAAO,CACL,gCACM,KAAK,EACT,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,kBAAkB,EAAE;YACnD,yBAAyB,EAAE,mBAAmB;YAC9C,+EAA+E;YAC/E,OAAO,EAAE,CAAC,mBAAmB;SAC9B,CAAC;QACF,2CAA2C;QAC3C,uBAAuB,EAAE;YACvB,MAAM;SACP,GACD,CACH,CAAA;AACH,CAAC","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport sanitizeHtml from '../services/sanitize-html'\n\nexport default function QuillHTML({\n  html,\n  ...props\n}: React.ComponentProps<'div'> & {\n  html: string\n}) {\n  const [__html, includesLegacyLists] = React.useMemo(() => {\n    const sanitizedHtml = sanitizeHtml(html)\n    const quillLegacyListsIndicator = 'ql-indent-'\n    return [sanitizedHtml, sanitizedHtml.includes(quillLegacyListsIndicator)]\n  }, [html])\n  return (\n    <div\n      {...props}\n      className={clsx(props.className, 'ob-quill-content', {\n        'ob-quill-legacy-content': includesLegacyLists,\n        // \"content\" is a bulma class: https://bulma.io/documentation/elements/content/\n        content: !includesLegacyLists,\n      })}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{\n        __html,\n      }}\n    />\n  )\n}\n"]}
+{"version":3,"file":"QuillHTML.js","sourceRoot":"","sources":["../../src/components/QuillHTML.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,YAAY,MAAM,2BAA2B,CAAA;AAEpD,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,IAAI,EACJ,GAAG,KAAK,EAGT;IACC,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACvD,MAAM,aAAa,GAAG,YAAY,CAAC,IAAI,CAAC,CAAA;QACxC,MAAM,yBAAyB,GAAG,YAAY,CAAA;QAC9C,OAAO,CAAC,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC,yBAAyB,CAAC,CAAC,CAAA;IAC3E,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IACV,OAAO,CACL,iBACM,KAAK,EACT,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,kBAAkB,EAAE;YACnD,yBAAyB,EAAE,mBAAmB;YAC9C,+EAA+E;YAC/E,OAAO,EAAE,CAAC,mBAAmB;SAC9B,CAAC;QACF,2CAA2C;QAC3C,uBAAuB,EAAE;YACvB,MAAM;SACP,GACD,CACH,CAAA;AACH,CAAC","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport sanitizeHtml from '../services/sanitize-html'\n\nexport default function QuillHTML({\n  html,\n  ...props\n}: React.ComponentProps<'div'> & {\n  html: string\n}) {\n  const [__html, includesLegacyLists] = React.useMemo(() => {\n    const sanitizedHtml = sanitizeHtml(html)\n    const quillLegacyListsIndicator = 'ql-indent-'\n    return [sanitizedHtml, sanitizedHtml.includes(quillLegacyListsIndicator)]\n  }, [html])\n  return (\n    <div\n      {...props}\n      className={clsx(props.className, 'ob-quill-content', {\n        'ob-quill-legacy-content': includesLegacyLists,\n        // \"content\" is a bulma class: https://bulma.io/documentation/elements/content/\n        content: !includesLegacyLists,\n      })}\n      // eslint-disable-next-line react/no-danger\n      dangerouslySetInnerHTML={{\n        __html,\n      }}\n    />\n  )\n}\n"]}

package/dist/components/SuccessSnackbar.d.ts

@@ -3,6 +3,6 @@ declare function SuccessSnackbar({ open, onClose, children, }: {
     open: boolean;
     children: React.ReactNode;
     onClose: (isOpen: false) => void;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof SuccessSnackbar>;
 export default _default;

package/dist/components/SuccessSnackbar.js

@@ -1,7 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { Grid, Icon, Snackbar, SnackbarContent } from '@mui/material';
 function SuccessSnackbar({ open, onClose, children, }) {
-    return (React.createElement(Snackbar, { anchorOrigin: {
+    return (_jsx(Snackbar, { anchorOrigin: {
             vertical: 'bottom',
             horizontal: 'right',
         }, open: open, onClose: (event, reason) => {
@@ -9,11 +10,7 @@ function SuccessSnackbar({ open, onClose, children, }) {
                 return;
             }
             onClose(false);
-        }, autoHideDuration: 3000 },
-        React.createElement(SnackbarContent, { sx: { bgcolor: 'success.main' }, message: React.createElement(Grid, { container: true, spacing: 2, alignItems: "center" },
-                React.createElement(Grid, { item: true, xs: "auto" },
-                    React.createElement(Icon, null, "check_circle")),
-                React.createElement(Grid, { item: true, xs: true }, children)) })));
+        }, autoHideDuration: 3000, children: _jsx(SnackbarContent, { sx: { bgcolor: 'success.main' }, message: _jsxs(Grid, { container: true, spacing: 2, alignItems: "center", children: [_jsx(Grid, { size: { xs: 'auto' }, children: _jsx(Icon, { children: "check_circle" }) }), _jsx(Grid, { size: { xs: 'grow' }, children: children })] }) }) }));
 }
 export default React.memo(SuccessSnackbar);
 //# sourceMappingURL=SuccessSnackbar.js.map

package/dist/components/SuccessSnackbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SuccessSnackbar.js","sourceRoot":"","sources":["../../src/components/SuccessSnackbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAErE,SAAS,eAAe,CAAC,EACvB,IAAI,EACJ,OAAO,EACP,QAAQ,GAKT;IACC,OAAO,CACL,oBAAC,QAAQ,IACP,YAAY,EAAE;YACZ,QAAQ,EAAE,QAAQ;YAClB,UAAU,EAAE,OAAO;SACpB,EACD,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;YACzB,IAAI,MAAM,KAAK,WAAW,EAAE,CAAC;gBAC3B,OAAM;YACR,CAAC;YAED,OAAO,CAAC,KAAK,CAAC,CAAA;QAChB,CAAC,EACD,gBAAgB,EAAE,IAAI;QAEtB,oBAAC,eAAe,IACd,EAAE,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,EAC/B,OAAO,EACL,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,UAAU,EAAC,QAAQ;gBAC7C,oBAAC,IAAI,IAAC,IAAI,QAAC,EAAE,EAAC,MAAM;oBAClB,oBAAC,IAAI,uBAAoB,CACpB;gBACP,oBAAC,IAAI,IAAC,IAAI,QAAC,EAAE,UACV,QAAQ,CACJ,CACF,GAET,CACO,CACZ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Grid, Icon, Snackbar, SnackbarContent } from '@mui/material'\n\nfunction SuccessSnackbar({\n  open,\n  onClose,\n  children,\n}: {\n  open: boolean\n  children: React.ReactNode\n  onClose: (isOpen: false) => void\n}) {\n  return (\n    <Snackbar\n      anchorOrigin={{\n        vertical: 'bottom',\n        horizontal: 'right',\n      }}\n      open={open}\n      onClose={(event, reason) => {\n        if (reason === 'clickaway') {\n          return\n        }\n\n        onClose(false)\n      }}\n      autoHideDuration={3000}\n    >\n      <SnackbarContent\n        sx={{ bgcolor: 'success.main' }}\n        message={\n          <Grid container spacing={2} alignItems=\"center\">\n            <Grid item xs=\"auto\">\n              <Icon>check_circle</Icon>\n            </Grid>\n            <Grid item xs>\n              {children}\n            </Grid>\n          </Grid>\n        }\n      />\n    </Snackbar>\n  )\n}\n\nexport default React.memo(SuccessSnackbar)\n"]}
+{"version":3,"file":"SuccessSnackbar.js","sourceRoot":"","sources":["../../src/components/SuccessSnackbar.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAErE,SAAS,eAAe,CAAC,EACvB,IAAI,EACJ,OAAO,EACP,QAAQ,GAKT;IACC,OAAO,CACL,KAAC,QAAQ,IACP,YAAY,EAAE;YACZ,QAAQ,EAAE,QAAQ;YAClB,UAAU,EAAE,OAAO;SACpB,EACD,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;YACzB,IAAI,MAAM,KAAK,WAAW,EAAE,CAAC;gBAC3B,OAAM;YACR,CAAC;YAED,OAAO,CAAC,KAAK,CAAC,CAAA;QAChB,CAAC,EACD,gBAAgB,EAAE,IAAI,YAEtB,KAAC,eAAe,IACd,EAAE,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,EAC/B,OAAO,EACL,MAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,EAAE,UAAU,EAAC,QAAQ,aAC7C,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,YACxB,KAAC,IAAI,+BAAoB,GACpB,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,YAAG,QAAQ,GAAQ,IACxC,GAET,GACO,CACZ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Grid, Icon, Snackbar, SnackbarContent } from '@mui/material'\n\nfunction SuccessSnackbar({\n  open,\n  onClose,\n  children,\n}: {\n  open: boolean\n  children: React.ReactNode\n  onClose: (isOpen: false) => void\n}) {\n  return (\n    <Snackbar\n      anchorOrigin={{\n        vertical: 'bottom',\n        horizontal: 'right',\n      }}\n      open={open}\n      onClose={(event, reason) => {\n        if (reason === 'clickaway') {\n          return\n        }\n\n        onClose(false)\n      }}\n      autoHideDuration={3000}\n    >\n      <SnackbarContent\n        sx={{ bgcolor: 'success.main' }}\n        message={\n          <Grid container spacing={2} alignItems=\"center\">\n            <Grid size={{ xs: 'auto' }}>\n              <Icon>check_circle</Icon>\n            </Grid>\n            <Grid size={{ xs: 'grow' }}>{children}</Grid>\n          </Grid>\n        }\n      />\n    </Snackbar>\n  )\n}\n\nexport default React.memo(SuccessSnackbar)\n"]}

package/dist/components/ValidationErrorsCard.d.ts

@@ -9,6 +9,6 @@ declare const _default: React.MemoExoticComponent<({ formElementsValidation, vis
     setPageId: ReturnType<typeof usePages>["setPageId"];
     navigationTopOffset: number | "CALCULATE";
     scrollableContainerId?: string;
-    validationErrorToastFocusElementRef: React.RefObject<HTMLButtonElement>;
-}) => React.JSX.Element>;
+    validationErrorToastFocusElementRef: React.RefObject<HTMLButtonElement | null>;
+}) => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/components/ValidationErrorsCard.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { IconButton, Collapse, Tooltip } from '@mui/material';
 import * as React from 'react';
 import MaterialIcon from './MaterialIcon';
@@ -133,58 +134,40 @@ const ValidationErrorsCard = ({ formElementsValidation, visiblePages, currentPag
         }
         return Array.from(pages.values());
     }, [formElementsValidation, visiblePages]);
-    return (React.createElement("div", { className: "ob-validation-notification-wrapper" },
-        React.createElement("div", { className: clsx('ob-validation-notification-card cypress-invalid-submit-attempt', {
+    return (_jsx("div", { className: "ob-validation-notification-wrapper", children: _jsx("div", { className: clsx('ob-validation-notification-card cypress-invalid-submit-attempt', {
                 'is-clickable': !isExpanded,
                 'is-contracted': !isExpanded,
                 'is-expanded': isExpanded,
-            }), onClick: !isExpanded ? expand : undefined },
-            React.createElement("div", { className: "ob-validation-notification-card-content" },
-                React.createElement("div", { className: "ob-validation-notification-card-header-wrapper" },
-                    React.createElement("div", { className: "ob-validation-notification-card-header-title-wrapper" },
-                        React.createElement(MaterialIcon, { className: clsx('ob-validation-notification-card-header-title-icon ob-validation-color-transition', {
-                                'has-text-danger': isExpanded,
-                                'has-text-white': !isExpanded,
-                            }) }, "error"),
-                        React.createElement("p", { className: clsx('ob-validation-color-transition ob-validation-notification-card-header-title-text', {
-                                'has-text-danger': isExpanded,
-                                'has-text-white': !isExpanded,
-                            }) }, "Validation Errors")),
-                    React.createElement("div", { className: "ob-validation-notification-card-header-collapse-icon-wrapper" },
-                        React.createElement(IconButton, { autoFocus: true, ref: validationErrorToastFocusElementRef, onClick: isExpanded ? contract : undefined, "aria-label": `${isExpanded ? 'Collapse' : 'Expand'} validation errors`, className: "cypress-validation-notification-toggle-messages-button" },
-                            React.createElement(MaterialIcon, { className: clsx('icon-small', {
-                                    'has-text-white': !isExpanded,
-                                }) }, isExpanded ? 'expand_more' : 'expand_less')))),
-                React.createElement("div", { className: "ob-validation-notification-card-collapse-wrapper" },
-                    React.createElement(Collapse, { in: isExpanded }, pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {
-                        const isNotFirstPage = pageIndex > 0;
-                        return (React.createElement(React.Fragment, { key: pageIndex },
-                            page && (React.createElement("p", { className: clsx('ob-validation-notification-card-page-label ob-validation-color-transition', {
-                                    'is-not-first': isNotFirstPage,
-                                }) }, page.label)),
-                            React.createElement("div", { className: "ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition" }, errors.map(({ errorMessage, label, elementDOMId }, index, list) => {
-                                const isFirst = index === 0;
-                                const isLast = index === list.length - 1;
-                                return (React.createElement(Clickable, { key: index, className: clsx('ob-list__item is-clickable ob-validation-notification-card-item cypress-validation-notification-error', {
-                                        'is-first': isFirst,
-                                        'is-last': isLast,
-                                    }), onClick: () => {
-                                        if (page && page.id !== currentPage.id) {
-                                            setPageId(page.id);
-                                        }
-                                        scrollToElement({
-                                            elementDOMId,
-                                            navigationTopOffset,
-                                            scrollableContainerId,
-                                        });
-                                    } },
-                                    React.createElement("div", { className: "ob-validation-notification-card-item-text" },
-                                        React.createElement("p", { className: "cypress-validation-notification-error-label" }, label),
-                                        React.createElement(Tooltip, { title: errorMessage, placement: "left", arrow: true },
-                                            React.createElement("p", { className: "ob-validation-notification-card-item-text-error-message has-text-danger cypress-validation-notification-error-message" }, errorMessage))),
-                                    React.createElement(MaterialIcon, { className: "has-text-grey icon-small ob-validation-notification-card-item-icon" }, "chevron_right")));
-                            }))));
-                    })))))));
+            }), onClick: !isExpanded ? expand : undefined, children: _jsxs("div", { className: "ob-validation-notification-card-content", children: [_jsxs("div", { className: "ob-validation-notification-card-header-wrapper", children: [_jsxs("div", { className: "ob-validation-notification-card-header-title-wrapper", children: [_jsx(MaterialIcon, { className: clsx('ob-validation-notification-card-header-title-icon ob-validation-color-transition', {
+                                            'has-text-danger': isExpanded,
+                                            'has-text-white': !isExpanded,
+                                        }), children: "error" }), _jsx("p", { className: clsx('ob-validation-color-transition ob-validation-notification-card-header-title-text', {
+                                            'has-text-danger': isExpanded,
+                                            'has-text-white': !isExpanded,
+                                        }), children: "Validation Errors" })] }), _jsx("div", { className: "ob-validation-notification-card-header-collapse-icon-wrapper", children: _jsx(IconButton, { autoFocus: true, ref: validationErrorToastFocusElementRef, onClick: isExpanded ? contract : undefined, "aria-label": `${isExpanded ? 'Collapse' : 'Expand'} validation errors`, className: "cypress-validation-notification-toggle-messages-button", children: _jsx(MaterialIcon, { className: clsx('icon-small', {
+                                            'has-text-white': !isExpanded,
+                                        }), children: isExpanded ? 'expand_more' : 'expand_less' }) }) })] }), _jsx("div", { className: "ob-validation-notification-card-collapse-wrapper", children: _jsx(Collapse, { in: isExpanded, children: pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {
+                                const isNotFirstPage = pageIndex > 0;
+                                return (_jsxs(React.Fragment, { children: [page && (_jsx("p", { className: clsx('ob-validation-notification-card-page-label ob-validation-color-transition', {
+                                                'is-not-first': isNotFirstPage,
+                                            }), children: page.label })), _jsx("div", { className: "ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition", children: errors.map(({ errorMessage, label, elementDOMId }, index, list) => {
+                                                const isFirst = index === 0;
+                                                const isLast = index === list.length - 1;
+                                                return (_jsxs(Clickable, { className: clsx('ob-list__item is-clickable ob-validation-notification-card-item cypress-validation-notification-error', {
+                                                        'is-first': isFirst,
+                                                        'is-last': isLast,
+                                                    }), onClick: () => {
+                                                        if (page && page.id !== currentPage.id) {
+                                                            setPageId(page.id);
+                                                        }
+                                                        scrollToElement({
+                                                            elementDOMId,
+                                                            navigationTopOffset,
+                                                            scrollableContainerId,
+                                                        });
+                                                    }, children: [_jsxs("div", { className: "ob-validation-notification-card-item-text", children: [_jsx("p", { className: "cypress-validation-notification-error-label", children: label }), _jsx(Tooltip, { title: errorMessage, placement: "left", arrow: true, children: _jsx("p", { className: "ob-validation-notification-card-item-text-error-message has-text-danger cypress-validation-notification-error-message", children: errorMessage }) })] }), _jsx(MaterialIcon, { className: "has-text-grey icon-small ob-validation-notification-card-item-icon", children: "chevron_right" })] }, index));
+                                            }) })] }, pageIndex));
+                            }) }) })] }) }) }));
 };
 export default React.memo(ValidationErrorsCard);
 //# sourceMappingURL=ValidationErrorsCard.js.map

package/dist/components/ValidationErrorsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ValidationErrorsCard.js","sourceRoot":"","sources":["../../src/components/ValidationErrorsCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconButton, Collapse, Tooltip } from '@mui/material'\nimport * as React from 'react'\nimport MaterialIcon from './MaterialIcon'\nimport { FormElementsValidation } from '../types/form'\nimport useBooleanState from '../hooks/useBooleanState'\nimport clsx from 'clsx'\nimport { FormTypes } from '@oneblink/types'\nimport usePages from '../hooks/usePages'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport scrollToElement from '../utils/scrollToElement'\nimport { Clickable } from './Clickable'\n\nconst NO_PAGE_KEY = 'NO_PAGE'\ntype ValidationErrorMetaData = {\n  elementDOMId: ElementDOMId\n  label: string\n  page?: {\n    label: string\n    id: string\n  }\n  errorMessage: string\n}\nconst getValidationErrors = ({\n  formElementsValidation,\n  elements,\n  page,\n  idPrefix,\n}: {\n  formElementsValidation: FormElementsValidation\n  elements: FormTypes.FormElement[]\n  page?: ValidationErrorMetaData['page']\n  idPrefix: string\n}) => {\n  return elements.reduce<Array<ValidationErrorMetaData>>((memo, el) => {\n    switch (el.type) {\n      case 'page': {\n        memo.push(\n          ...getValidationErrors({\n            formElementsValidation,\n            elements: el.elements,\n            page: el,\n            idPrefix,\n          }),\n        )\n        break\n      }\n      case 'section': {\n        memo.push(\n          ...getValidationErrors({\n            formElementsValidation,\n            elements: el.elements,\n            page,\n            idPrefix,\n          }),\n        )\n        break\n      }\n      case 'repeatableSet': {\n        const validationData = formElementsValidation[el.name]\n        if (\n          !!validationData &&\n          typeof validationData !== 'string' &&\n          validationData.type === 'repeatableSet'\n        ) {\n          const elementDOMId = new ElementDOMId({\n            element: el,\n            idPrefix,\n          })\n          if (validationData.set) {\n            memo.push({\n              elementDOMId,\n              errorMessage: validationData.set,\n              label: el.label,\n              page,\n            })\n          }\n          for (const [key, entry] of Object.entries(validationData.entries)) {\n            if (!entry) continue\n            memo.push(\n              ...getValidationErrors({\n                formElementsValidation: entry,\n                elements: el.elements,\n                page,\n                idPrefix: elementDOMId.repeatableSetEntryDOMIdPrefix(key),\n              }),\n            )\n          }\n        }\n        break\n      }\n      case 'infoPage':\n      case 'form': {\n        const validationData = formElementsValidation[el.name]\n        if (\n          !!validationData &&\n          typeof validationData !== 'string' &&\n          validationData.type === 'formElements'\n        ) {\n          if (validationData.formElements && el.elements) {\n            const elementDOMId = new ElementDOMId({\n              element: el,\n              idPrefix,\n            })\n            memo.push(\n              ...getValidationErrors({\n                formElementsValidation: validationData.formElements,\n                elements: el.elements,\n                page,\n                idPrefix: elementDOMId.subFormDOMIdPrefix,\n              }),\n            )\n          }\n        }\n        break\n      }\n      default: {\n        const validationMessage = formElementsValidation[el.name]\n        if (typeof validationMessage === 'string') {\n          const elementDOMId = new ElementDOMId({\n            element: el,\n            idPrefix,\n          })\n          memo.push({\n            elementDOMId,\n            label: el.label,\n            page,\n            errorMessage: validationMessage,\n          })\n        }\n      }\n    }\n    return memo\n  }, [])\n}\n\nconst ValidationErrorsCard = ({\n  formElementsValidation,\n  visiblePages,\n  currentPage,\n  setPageId,\n  navigationTopOffset,\n  scrollableContainerId,\n  validationErrorToastFocusElementRef,\n}: {\n  visiblePages: FormTypes.PageElement[]\n  formElementsValidation: FormElementsValidation | undefined\n  currentPage: FormTypes.PageElement\n  setPageId: ReturnType<typeof usePages>['setPageId']\n  navigationTopOffset: number | 'CALCULATE'\n  scrollableContainerId?: string\n  validationErrorToastFocusElementRef: React.RefObject<HTMLButtonElement>\n}) => {\n  const [isExpanded, expand, contract] = useBooleanState(false)\n\n  const pagesWithValidationErrors = React.useMemo(() => {\n    if (!formElementsValidation) return []\n    const flatErrors = getValidationErrors({\n      formElementsValidation,\n      elements: visiblePages,\n      idPrefix: '',\n    })\n\n    // Organise into pages\n    const pages = new Map<\n      string,\n      {\n        page: ValidationErrorMetaData['page']\n        errors: ValidationErrorMetaData[]\n      }\n    >()\n    for (const error of flatErrors) {\n      if (error.page) {\n        // If error belongs to a page\n        const existingSetEntry = pages.get(error.page.id)\n        const errors = [...(existingSetEntry?.errors || []), error]\n        const page = error.page\n\n        pages.set(page.id, {\n          page,\n          errors,\n        })\n      } else {\n        // No page associated with error\n        const existingSetEntry = pages.get(NO_PAGE_KEY)\n        const errors = [...(existingSetEntry?.errors || []), error]\n        pages.set(NO_PAGE_KEY, {\n          page: undefined,\n          errors,\n        })\n      }\n    }\n    return Array.from(pages.values())\n  }, [formElementsValidation, visiblePages])\n\n  return (\n    <div className=\"ob-validation-notification-wrapper\">\n      <div\n        className={clsx(\n          'ob-validation-notification-card cypress-invalid-submit-attempt',\n          {\n            'is-clickable': !isExpanded,\n            'is-contracted': !isExpanded,\n            'is-expanded': isExpanded,\n          },\n        )}\n        onClick={!isExpanded ? expand : undefined}\n      >\n        <div className=\"ob-validation-notification-card-content\">\n          <div className=\"ob-validation-notification-card-header-wrapper\">\n            <div className=\"ob-validation-notification-card-header-title-wrapper\">\n              <MaterialIcon\n                className={clsx(\n                  'ob-validation-notification-card-header-title-icon ob-validation-color-transition',\n                  {\n                    'has-text-danger': isExpanded,\n                    'has-text-white': !isExpanded,\n                  },\n                )}\n              >\n                error\n              </MaterialIcon>\n              <p\n                className={clsx(\n                  'ob-validation-color-transition ob-validation-notification-card-header-title-text',\n                  {\n                    'has-text-danger': isExpanded,\n                    'has-text-white': !isExpanded,\n                  },\n                )}\n              >\n                Validation Errors\n              </p>\n            </div>\n            <div className=\"ob-validation-notification-card-header-collapse-icon-wrapper\">\n              <IconButton\n                autoFocus\n                ref={validationErrorToastFocusElementRef}\n                onClick={isExpanded ? contract : undefined}\n                aria-label={`${isExpanded ? 'Collapse' : 'Expand'} validation errors`}\n                className=\"cypress-validation-notification-toggle-messages-button\"\n              >\n                <MaterialIcon\n                  className={clsx('icon-small', {\n                    'has-text-white': !isExpanded,\n                  })}\n                >\n                  {isExpanded ? 'expand_more' : 'expand_less'}\n                </MaterialIcon>\n              </IconButton>\n            </div>\n          </div>\n          <div className=\"ob-validation-notification-card-collapse-wrapper\">\n            <Collapse in={isExpanded}>\n              {pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {\n                const isNotFirstPage = pageIndex > 0\n                return (\n                  <React.Fragment key={pageIndex}>\n                    {page && (\n                      <p\n                        className={clsx(\n                          'ob-validation-notification-card-page-label ob-validation-color-transition',\n                          {\n                            'is-not-first': isNotFirstPage,\n                          },\n                        )}\n                      >\n                        {page.label}\n                      </p>\n                    )}\n                    <div className=\"ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition\">\n                      {errors.map(\n                        (\n                          { errorMessage, label, elementDOMId },\n                          index,\n                          list,\n                        ) => {\n                          const isFirst = index === 0\n                          const isLast = index === list.length - 1\n                          return (\n                            <Clickable\n                              key={index}\n                              className={clsx(\n                                'ob-list__item is-clickable ob-validation-notification-card-item cypress-validation-notification-error',\n                                {\n                                  'is-first': isFirst,\n                                  'is-last': isLast,\n                                },\n                              )}\n                              onClick={() => {\n                                if (page && page.id !== currentPage.id) {\n                                  setPageId(page.id)\n                                }\n\n                                scrollToElement({\n                                  elementDOMId,\n                                  navigationTopOffset,\n                                  scrollableContainerId,\n                                })\n                              }}\n                            >\n                              <div className=\"ob-validation-notification-card-item-text\">\n                                <p className=\"cypress-validation-notification-error-label\">\n                                  {label}\n                                </p>\n                                <Tooltip\n                                  title={errorMessage}\n                                  placement=\"left\"\n                                  arrow\n                                >\n                                  <p className=\"ob-validation-notification-card-item-text-error-message has-text-danger cypress-validation-notification-error-message\">\n                                    {errorMessage}\n                                  </p>\n                                </Tooltip>\n                              </div>\n                              <MaterialIcon className=\"has-text-grey icon-small ob-validation-notification-card-item-icon\">\n                                chevron_right\n                              </MaterialIcon>\n                            </Clickable>\n                          )\n                        },\n                      )}\n                    </div>\n                  </React.Fragment>\n                )\n              })}\n            </Collapse>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(ValidationErrorsCard)\n"]}
+{"version":3,"file":"ValidationErrorsCard.js","sourceRoot":"","sources":["../../src/components/ValidationErrorsCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconButton, Collapse, Tooltip } from '@mui/material'\nimport * as React from 'react'\nimport MaterialIcon from './MaterialIcon'\nimport { FormElementsValidation } from '../types/form'\nimport useBooleanState from '../hooks/useBooleanState'\nimport clsx from 'clsx'\nimport { FormTypes } from '@oneblink/types'\nimport usePages from '../hooks/usePages'\nimport ElementDOMId from '../utils/elementDOMIds'\nimport scrollToElement from '../utils/scrollToElement'\nimport { Clickable } from './Clickable'\n\nconst NO_PAGE_KEY = 'NO_PAGE'\ntype ValidationErrorMetaData = {\n  elementDOMId: ElementDOMId\n  label: string\n  page?: {\n    label: string\n    id: string\n  }\n  errorMessage: string\n}\nconst getValidationErrors = ({\n  formElementsValidation,\n  elements,\n  page,\n  idPrefix,\n}: {\n  formElementsValidation: FormElementsValidation\n  elements: FormTypes.FormElement[]\n  page?: ValidationErrorMetaData['page']\n  idPrefix: string\n}) => {\n  return elements.reduce<Array<ValidationErrorMetaData>>((memo, el) => {\n    switch (el.type) {\n      case 'page': {\n        memo.push(\n          ...getValidationErrors({\n            formElementsValidation,\n            elements: el.elements,\n            page: el,\n            idPrefix,\n          }),\n        )\n        break\n      }\n      case 'section': {\n        memo.push(\n          ...getValidationErrors({\n            formElementsValidation,\n            elements: el.elements,\n            page,\n            idPrefix,\n          }),\n        )\n        break\n      }\n      case 'repeatableSet': {\n        const validationData = formElementsValidation[el.name]\n        if (\n          !!validationData &&\n          typeof validationData !== 'string' &&\n          validationData.type === 'repeatableSet'\n        ) {\n          const elementDOMId = new ElementDOMId({\n            element: el,\n            idPrefix,\n          })\n          if (validationData.set) {\n            memo.push({\n              elementDOMId,\n              errorMessage: validationData.set,\n              label: el.label,\n              page,\n            })\n          }\n          for (const [key, entry] of Object.entries(validationData.entries)) {\n            if (!entry) continue\n            memo.push(\n              ...getValidationErrors({\n                formElementsValidation: entry,\n                elements: el.elements,\n                page,\n                idPrefix: elementDOMId.repeatableSetEntryDOMIdPrefix(key),\n              }),\n            )\n          }\n        }\n        break\n      }\n      case 'infoPage':\n      case 'form': {\n        const validationData = formElementsValidation[el.name]\n        if (\n          !!validationData &&\n          typeof validationData !== 'string' &&\n          validationData.type === 'formElements'\n        ) {\n          if (validationData.formElements && el.elements) {\n            const elementDOMId = new ElementDOMId({\n              element: el,\n              idPrefix,\n            })\n            memo.push(\n              ...getValidationErrors({\n                formElementsValidation: validationData.formElements,\n                elements: el.elements,\n                page,\n                idPrefix: elementDOMId.subFormDOMIdPrefix,\n              }),\n            )\n          }\n        }\n        break\n      }\n      default: {\n        const validationMessage = formElementsValidation[el.name]\n        if (typeof validationMessage === 'string') {\n          const elementDOMId = new ElementDOMId({\n            element: el,\n            idPrefix,\n          })\n          memo.push({\n            elementDOMId,\n            label: el.label,\n            page,\n            errorMessage: validationMessage,\n          })\n        }\n      }\n    }\n    return memo\n  }, [])\n}\n\nconst ValidationErrorsCard = ({\n  formElementsValidation,\n  visiblePages,\n  currentPage,\n  setPageId,\n  navigationTopOffset,\n  scrollableContainerId,\n  validationErrorToastFocusElementRef,\n}: {\n  visiblePages: FormTypes.PageElement[]\n  formElementsValidation: FormElementsValidation | undefined\n  currentPage: FormTypes.PageElement\n  setPageId: ReturnType<typeof usePages>['setPageId']\n  navigationTopOffset: number | 'CALCULATE'\n  scrollableContainerId?: string\n  validationErrorToastFocusElementRef: React.RefObject<HTMLButtonElement | null>\n}) => {\n  const [isExpanded, expand, contract] = useBooleanState(false)\n\n  const pagesWithValidationErrors = React.useMemo(() => {\n    if (!formElementsValidation) return []\n    const flatErrors = getValidationErrors({\n      formElementsValidation,\n      elements: visiblePages,\n      idPrefix: '',\n    })\n\n    // Organise into pages\n    const pages = new Map<\n      string,\n      {\n        page: ValidationErrorMetaData['page']\n        errors: ValidationErrorMetaData[]\n      }\n    >()\n    for (const error of flatErrors) {\n      if (error.page) {\n        // If error belongs to a page\n        const existingSetEntry = pages.get(error.page.id)\n        const errors = [...(existingSetEntry?.errors || []), error]\n        const page = error.page\n\n        pages.set(page.id, {\n          page,\n          errors,\n        })\n      } else {\n        // No page associated with error\n        const existingSetEntry = pages.get(NO_PAGE_KEY)\n        const errors = [...(existingSetEntry?.errors || []), error]\n        pages.set(NO_PAGE_KEY, {\n          page: undefined,\n          errors,\n        })\n      }\n    }\n    return Array.from(pages.values())\n  }, [formElementsValidation, visiblePages])\n\n  return (\n    <div className=\"ob-validation-notification-wrapper\">\n      <div\n        className={clsx(\n          'ob-validation-notification-card cypress-invalid-submit-attempt',\n          {\n            'is-clickable': !isExpanded,\n            'is-contracted': !isExpanded,\n            'is-expanded': isExpanded,\n          },\n        )}\n        onClick={!isExpanded ? expand : undefined}\n      >\n        <div className=\"ob-validation-notification-card-content\">\n          <div className=\"ob-validation-notification-card-header-wrapper\">\n            <div className=\"ob-validation-notification-card-header-title-wrapper\">\n              <MaterialIcon\n                className={clsx(\n                  'ob-validation-notification-card-header-title-icon ob-validation-color-transition',\n                  {\n                    'has-text-danger': isExpanded,\n                    'has-text-white': !isExpanded,\n                  },\n                )}\n              >\n                error\n              </MaterialIcon>\n              <p\n                className={clsx(\n                  'ob-validation-color-transition ob-validation-notification-card-header-title-text',\n                  {\n                    'has-text-danger': isExpanded,\n                    'has-text-white': !isExpanded,\n                  },\n                )}\n              >\n                Validation Errors\n              </p>\n            </div>\n            <div className=\"ob-validation-notification-card-header-collapse-icon-wrapper\">\n              <IconButton\n                autoFocus\n                ref={validationErrorToastFocusElementRef}\n                onClick={isExpanded ? contract : undefined}\n                aria-label={`${isExpanded ? 'Collapse' : 'Expand'} validation errors`}\n                className=\"cypress-validation-notification-toggle-messages-button\"\n              >\n                <MaterialIcon\n                  className={clsx('icon-small', {\n                    'has-text-white': !isExpanded,\n                  })}\n                >\n                  {isExpanded ? 'expand_more' : 'expand_less'}\n                </MaterialIcon>\n              </IconButton>\n            </div>\n          </div>\n          <div className=\"ob-validation-notification-card-collapse-wrapper\">\n            <Collapse in={isExpanded}>\n              {pagesWithValidationErrors.map(({ page, errors }, pageIndex) => {\n                const isNotFirstPage = pageIndex > 0\n                return (\n                  <React.Fragment key={pageIndex}>\n                    {page && (\n                      <p\n                        className={clsx(\n                          'ob-validation-notification-card-page-label ob-validation-color-transition',\n                          {\n                            'is-not-first': isNotFirstPage,\n                          },\n                        )}\n                      >\n                        {page.label}\n                      </p>\n                    )}\n                    <div className=\"ob-list has-dividers has-borders ob-validation-notification-card-list ob-validation-color-transition\">\n                      {errors.map(\n                        (\n                          { errorMessage, label, elementDOMId },\n                          index,\n                          list,\n                        ) => {\n                          const isFirst = index === 0\n                          const isLast = index === list.length - 1\n                          return (\n                            <Clickable\n                              key={index}\n                              className={clsx(\n                                'ob-list__item is-clickable ob-validation-notification-card-item cypress-validation-notification-error',\n                                {\n                                  'is-first': isFirst,\n                                  'is-last': isLast,\n                                },\n                              )}\n                              onClick={() => {\n                                if (page && page.id !== currentPage.id) {\n                                  setPageId(page.id)\n                                }\n\n                                scrollToElement({\n                                  elementDOMId,\n                                  navigationTopOffset,\n                                  scrollableContainerId,\n                                })\n                              }}\n                            >\n                              <div className=\"ob-validation-notification-card-item-text\">\n                                <p className=\"cypress-validation-notification-error-label\">\n                                  {label}\n                                </p>\n                                <Tooltip\n                                  title={errorMessage}\n                                  placement=\"left\"\n                                  arrow\n                                >\n                                  <p className=\"ob-validation-notification-card-item-text-error-message has-text-danger cypress-validation-notification-error-message\">\n                                    {errorMessage}\n                                  </p>\n                                </Tooltip>\n                              </div>\n                              <MaterialIcon className=\"has-text-grey icon-small ob-validation-notification-card-item-icon\">\n                                chevron_right\n                              </MaterialIcon>\n                            </Clickable>\n                          )\n                        },\n                      )}\n                    </div>\n                  </React.Fragment>\n                )\n              })}\n            </Collapse>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default React.memo(ValidationErrorsCard)\n"]}

package/dist/components/calendar-bookings/CalendarBookingsCancelForm.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-declare function CalendarBookingsCancelForm(): React.JSX.Element;
+declare function CalendarBookingsCancelForm(): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof CalendarBookingsCancelForm>;
 export default _default;

package/dist/components/calendar-bookings/CalendarBookingsCancelForm.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { NylasScheduling } from '@nylas/react';
 import { schedulingService } from '@oneblink/apps';
@@ -7,11 +8,9 @@ import useCalendarBookings from './CalendarBookingsProvider';
 function NylasCancelForm({ sessionId, bookingRef, }) {
     const { setBookingError, themeConfig } = useCalendarBookings();
     if (!bookingRef) {
-        return (React.createElement(ErrorMessage, { title: "Error Retrieving Data", gutterTop: true },
-            React.createElement("span", { className: "cypress-booking-ref-not-found-error-message" }, "Could not find a calendar booking to cancel")));
+        return (_jsx(ErrorMessage, { title: "Error Retrieving Data", gutterTop: true, children: _jsx("span", { className: "cypress-booking-ref-not-found-error-message", children: "Could not find a calendar booking to cancel" }) }));
     }
-    return (React.createElement("div", { className: "ob-scheduling-booking-form" },
-        React.createElement(NylasScheduling, { sessionId: sessionId, eventOverrides: {
+    return (_jsx("div", { className: "ob-scheduling-booking-form", children: _jsx(NylasScheduling, { sessionId: sessionId, eventOverrides: {
                 bookedEventInfo: async (event) => {
                     var _a;
                     event.preventDefault();
@@ -19,10 +18,10 @@ function NylasCancelForm({ sessionId, bookingRef, }) {
                         setBookingError((_a = event.detail.error.message) !== null && _a !== void 0 ? _a : 'Calendar Booking Error');
                     }
                 },
-            }, themeConfig: themeConfig, cancelBookingRef: bookingRef, enableUserFeedback: false, nylasBranding: false })));
+            }, themeConfig: themeConfig, cancelBookingRef: bookingRef, enableUserFeedback: false, nylasBranding: false }) }));
 }
 function CalendarBookingsCancelForm() {
-    return (React.createElement(CalendarBookingsContainer, { fetchConfiguration: schedulingService.createNylasExistingBookingSession }, (props) => React.createElement(NylasCancelForm, { ...props })));
+    return (_jsx(CalendarBookingsContainer, { fetchConfiguration: schedulingService.createNylasExistingBookingSession, children: (props) => _jsx(NylasCancelForm, { ...props }) }));
 }
 export default React.memo(CalendarBookingsCancelForm);
 //# sourceMappingURL=CalendarBookingsCancelForm.js.map

package/dist/components/calendar-bookings/CalendarBookingsCancelForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarBookingsCancelForm.js","sourceRoot":"","sources":["../../../src/components/calendar-bookings/CalendarBookingsCancelForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAClD,OAAO,YAAY,MAAM,0BAA0B,CAAA;AACnD,OAAO,yBAAyB,MAAM,6BAA6B,CAAA;AACnE,OAAO,mBAAmB,MAAM,4BAA4B,CAAA;AAE5D,SAAS,eAAe,CAAC,EACvB,SAAS,EACT,UAAU,GAKX;IACC,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,mBAAmB,EAAE,CAAA;IAE9D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,CACL,oBAAC,YAAY,IAAC,KAAK,EAAC,uBAAuB,EAAC,SAAS;YACnD,8BAAM,SAAS,EAAC,6CAA6C,kDAEtD,CACM,CAChB,CAAA;IACH,CAAC;IAED,OAAO,CACL,6BAAK,SAAS,EAAC,4BAA4B;QACzC,oBAAC,eAAe,IACd,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE;gBACd,eAAe,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;;oBAC/B,KAAK,CAAC,cAAc,EAAE,CAAA;oBACtB,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;wBACvB,eAAe,CACb,MAAA,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,mCAAI,wBAAwB,CACvD,CAAA;oBACH,CAAC;gBACH,CAAC;aACF,EACD,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,UAAU,EAC5B,kBAAkB,EAAE,KAAK,EACzB,aAAa,EAAE,KAAK,GACpB,CACE,CACP,CAAA;AACH,CAAC;AAED,SAAS,0BAA0B;IACjC,OAAO,CACL,oBAAC,yBAAyB,IACxB,kBAAkB,EAAE,iBAAiB,CAAC,iCAAiC,IAEtE,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,eAAe,OAAK,KAAK,GAAI,CAChB,CAC7B,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { NylasScheduling } from '@nylas/react'\nimport { schedulingService } from '@oneblink/apps'\nimport ErrorMessage from '../messages/ErrorMessage'\nimport CalendarBookingsContainer from './CalendarBookingsContainer'\nimport useCalendarBookings from './CalendarBookingsProvider'\n\nfunction NylasCancelForm({\n  sessionId,\n  bookingRef,\n}: Awaited<\n  ReturnType<typeof schedulingService.createNylasExistingBookingSession>\n> & {\n  submissionId: string\n}) {\n  const { setBookingError, themeConfig } = useCalendarBookings()\n\n  if (!bookingRef) {\n    return (\n      <ErrorMessage title=\"Error Retrieving Data\" gutterTop>\n        <span className=\"cypress-booking-ref-not-found-error-message\">\n          Could not find a calendar booking to cancel\n        </span>\n      </ErrorMessage>\n    )\n  }\n\n  return (\n    <div className=\"ob-scheduling-booking-form\">\n      <NylasScheduling\n        sessionId={sessionId}\n        eventOverrides={{\n          bookedEventInfo: async (event) => {\n            event.preventDefault()\n            if (event.detail.error) {\n              setBookingError(\n                event.detail.error.message ?? 'Calendar Booking Error',\n              )\n            }\n          },\n        }}\n        themeConfig={themeConfig}\n        cancelBookingRef={bookingRef}\n        enableUserFeedback={false}\n        nylasBranding={false}\n      />\n    </div>\n  )\n}\n\nfunction CalendarBookingsCancelForm() {\n  return (\n    <CalendarBookingsContainer\n      fetchConfiguration={schedulingService.createNylasExistingBookingSession}\n    >\n      {(props) => <NylasCancelForm {...props} />}\n    </CalendarBookingsContainer>\n  )\n}\n\nexport default React.memo(CalendarBookingsCancelForm)\n"]}
+{"version":3,"file":"CalendarBookingsCancelForm.js","sourceRoot":"","sources":["../../../src/components/calendar-bookings/CalendarBookingsCancelForm.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAClD,OAAO,YAAY,MAAM,0BAA0B,CAAA;AACnD,OAAO,yBAAyB,MAAM,6BAA6B,CAAA;AACnE,OAAO,mBAAmB,MAAM,4BAA4B,CAAA;AAE5D,SAAS,eAAe,CAAC,EACvB,SAAS,EACT,UAAU,GAKX;IACC,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,mBAAmB,EAAE,CAAA;IAE9D,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,CACL,KAAC,YAAY,IAAC,KAAK,EAAC,uBAAuB,EAAC,SAAS,kBACnD,eAAM,SAAS,EAAC,6CAA6C,4DAEtD,GACM,CAChB,CAAA;IACH,CAAC;IAED,OAAO,CACL,cAAK,SAAS,EAAC,4BAA4B,YACzC,KAAC,eAAe,IACd,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE;gBACd,eAAe,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE;;oBAC/B,KAAK,CAAC,cAAc,EAAE,CAAA;oBACtB,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;wBACvB,eAAe,CACb,MAAA,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,mCAAI,wBAAwB,CACvD,CAAA;oBACH,CAAC;gBACH,CAAC;aACF,EACD,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,UAAU,EAC5B,kBAAkB,EAAE,KAAK,EACzB,aAAa,EAAE,KAAK,GACpB,GACE,CACP,CAAA;AACH,CAAC;AAED,SAAS,0BAA0B;IACjC,OAAO,CACL,KAAC,yBAAyB,IACxB,kBAAkB,EAAE,iBAAiB,CAAC,iCAAiC,YAEtE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAC,eAAe,OAAK,KAAK,GAAI,GAChB,CAC7B,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAA","sourcesContent":["import React from 'react'\nimport { NylasScheduling } from '@nylas/react'\nimport { schedulingService } from '@oneblink/apps'\nimport ErrorMessage from '../messages/ErrorMessage'\nimport CalendarBookingsContainer from './CalendarBookingsContainer'\nimport useCalendarBookings from './CalendarBookingsProvider'\n\nfunction NylasCancelForm({\n  sessionId,\n  bookingRef,\n}: Awaited<\n  ReturnType<typeof schedulingService.createNylasExistingBookingSession>\n> & {\n  submissionId: string\n}) {\n  const { setBookingError, themeConfig } = useCalendarBookings()\n\n  if (!bookingRef) {\n    return (\n      <ErrorMessage title=\"Error Retrieving Data\" gutterTop>\n        <span className=\"cypress-booking-ref-not-found-error-message\">\n          Could not find a calendar booking to cancel\n        </span>\n      </ErrorMessage>\n    )\n  }\n\n  return (\n    <div className=\"ob-scheduling-booking-form\">\n      <NylasScheduling\n        sessionId={sessionId}\n        eventOverrides={{\n          bookedEventInfo: async (event) => {\n            event.preventDefault()\n            if (event.detail.error) {\n              setBookingError(\n                event.detail.error.message ?? 'Calendar Booking Error',\n              )\n            }\n          },\n        }}\n        themeConfig={themeConfig}\n        cancelBookingRef={bookingRef}\n        enableUserFeedback={false}\n        nylasBranding={false}\n      />\n    </div>\n  )\n}\n\nfunction CalendarBookingsCancelForm() {\n  return (\n    <CalendarBookingsContainer\n      fetchConfiguration={schedulingService.createNylasExistingBookingSession}\n    >\n      {(props) => <NylasCancelForm {...props} />}\n    </CalendarBookingsContainer>\n  )\n}\n\nexport default React.memo(CalendarBookingsCancelForm)\n"]}

package/dist/components/calendar-bookings/CalendarBookingsContainer.d.ts

@@ -4,4 +4,4 @@ export default function CalendarBookingsContainer<T>({ fetchConfiguration, child
     children: (renderProps: {
         submissionId: string;
     } & T) => React.ReactNode;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/calendar-bookings/CalendarBookingsContainer.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import useQuery from '../../hooks/useQuery';
 import useLoadDataState from '../../hooks/useLoadDataState';
@@ -10,25 +11,22 @@ function CalendarBookingLoader({ submissionId, fetchConfiguration, children, })
         return await fetchConfiguration(submissionId, abortSignal);
     }, [fetchConfiguration, submissionId]));
     if (nylasSchedulingState.status === 'LOADING') {
-        return (React.createElement("div", { className: "has-margin-top-1" },
-            React.createElement("div", { className: "cypress-loading has-text-centered" },
-                React.createElement(OnLoading, { className: "has-text-centered" }))));
+        return (_jsx("div", { className: "has-margin-top-1", children: _jsx("div", { className: "cypress-loading has-text-centered", children: _jsx(OnLoading, { className: "has-text-centered" }) }) }));
     }
     if (nylasSchedulingState.status === 'ERROR') {
-        return (React.createElement(ErrorModal, { error: nylasSchedulingState.error, onClose: refreshNylasState }));
+        return (_jsx(ErrorModal, { error: nylasSchedulingState.error, onClose: refreshNylasState }));
     }
-    return (React.createElement(CalendarBookingsProvider, { refreshNylasState: refreshNylasState }, children({
-        ...nylasSchedulingState.result,
-        submissionId,
-    })));
+    return (_jsx(CalendarBookingsProvider, { refreshNylasState: refreshNylasState, children: children({
+            ...nylasSchedulingState.result,
+            submissionId,
+        }) }));
 }
 export default function CalendarBookingsContainer({ fetchConfiguration, children, }) {
     const { submissionId: submissionIdQs } = useQuery();
     const submissionId = React.useMemo(() => (typeof submissionIdQs === 'string' ? submissionIdQs : undefined), [submissionIdQs]);
     if (!submissionId) {
-        return (React.createElement(ErrorMessage, { title: "Missing Configuration", gutterTop: true },
-            React.createElement("span", { className: "cypress-scheduling-booking-form-invalid-querystring ob-scheduling-booking-form__invalid-querystring-message" }, "It seems you have navigated here incorrectly. Please go back.")));
+        return (_jsx(ErrorMessage, { title: "Missing Configuration", gutterTop: true, children: _jsx("span", { className: "cypress-scheduling-booking-form-invalid-querystring ob-scheduling-booking-form__invalid-querystring-message", children: "It seems you have navigated here incorrectly. Please go back." }) }));
     }
-    return (React.createElement(CalendarBookingLoader, { fetchConfiguration: fetchConfiguration, submissionId: submissionId }, children));
+    return (_jsx(CalendarBookingLoader, { fetchConfiguration: fetchConfiguration, submissionId: submissionId, children: children }));
 }
 //# sourceMappingURL=CalendarBookingsContainer.js.map

package/dist/components/calendar-bookings/CalendarBookingsContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarBookingsContainer.js","sourceRoot":"","sources":["../../../src/components/calendar-bookings/CalendarBookingsContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,sBAAsB,CAAA;AAC3C,OAAO,gBAAgB,MAAM,8BAA8B,CAAA;AAC3D,OAAO,YAAY,MAAM,0BAA0B,CAAA;AACnD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAA;AACrE,OAAO,SAAS,MAAM,uBAAuB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AAOrC,SAAS,qBAAqB,CAAI,EAChC,YAAY,EACZ,kBAAkB,EAClB,QAAQ,GAKT;IACC,MAAM,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,GAAG,gBAAgB,CAChE,KAAK,CAAC,WAAW,CACf,KAAK,EAAE,WAAW,EAAE,EAAE;QACpB,OAAO,MAAM,kBAAkB,CAAC,YAAY,EAAE,WAAW,CAAC,CAAA;IAC5D,CAAC,EACD,CAAC,kBAAkB,EAAE,YAAY,CAAC,CACnC,CACF,CAAA;IAED,IAAI,oBAAoB,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;QAC9C,OAAO,CACL,6BAAK,SAAS,EAAC,kBAAkB;YAC/B,6BAAK,SAAS,EAAC,mCAAmC;gBAChD,oBAAC,SAAS,IAAC,SAAS,EAAC,mBAAmB,GAAG,CACvC,CACF,CACP,CAAA;IACH,CAAC;IAED,IAAI,oBAAoB,CAAC,MAAM,KAAK,OAAO,EAAE,CAAC;QAC5C,OAAO,CACL,oBAAC,UAAU,IACT,KAAK,EAAE,oBAAoB,CAAC,KAAK,EACjC,OAAO,EAAE,iBAAiB,GAC1B,CACH,CAAA;IACH,CAAC;IAED,OAAO,CACL,oBAAC,wBAAwB,IAAC,iBAAiB,EAAE,iBAAiB,IAC3D,QAAQ,CAAC;QACR,GAAG,oBAAoB,CAAC,MAAM;QAC9B,YAAY;KACb,CAAC,CACuB,CAC5B,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAI,EACnD,kBAAkB,EAClB,QAAQ,GAOT;IACC,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAE,CAAA;IAEnD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC,OAAO,cAAc,KAAK,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,EACvE,CAAC,cAAc,CAAC,CACjB,CAAA;IAED,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,OAAO,CACL,oBAAC,YAAY,IAAC,KAAK,EAAC,uBAAuB,EAAC,SAAS;YACnD,8BAAM,SAAS,EAAC,6GAA6G,oEAEtH,CACM,CAChB,CAAA;IACH,CAAC;IAED,OAAO,CACL,oBAAC,qBAAqB,IACpB,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,IAEzB,QAAQ,CACa,CACzB,CAAA;AACH,CAAC","sourcesContent":["import React from 'react'\nimport useQuery from '../../hooks/useQuery'\nimport useLoadDataState from '../../hooks/useLoadDataState'\nimport ErrorMessage from '../messages/ErrorMessage'\nimport { CalendarBookingsProvider } from './CalendarBookingsProvider'\nimport OnLoading from '../renderer/OnLoading'\nimport ErrorModal from './ErrorModal'\n\ntype FetchConfiguration<T> = (\n  submissionId: string,\n  abortSignal: AbortSignal,\n) => Promise<T>\n\nfunction CalendarBookingLoader<T>({\n  submissionId,\n  fetchConfiguration,\n  children,\n}: {\n  submissionId: string\n  fetchConfiguration: FetchConfiguration<T>\n  children: (renderProps: { submissionId: string } & T) => React.ReactNode\n}) {\n  const [nylasSchedulingState, refreshNylasState] = useLoadDataState<T>(\n    React.useCallback(\n      async (abortSignal) => {\n        return await fetchConfiguration(submissionId, abortSignal)\n      },\n      [fetchConfiguration, submissionId],\n    ),\n  )\n\n  if (nylasSchedulingState.status === 'LOADING') {\n    return (\n      <div className=\"has-margin-top-1\">\n        <div className=\"cypress-loading has-text-centered\">\n          <OnLoading className=\"has-text-centered\" />\n        </div>\n      </div>\n    )\n  }\n\n  if (nylasSchedulingState.status === 'ERROR') {\n    return (\n      <ErrorModal\n        error={nylasSchedulingState.error}\n        onClose={refreshNylasState}\n      />\n    )\n  }\n\n  return (\n    <CalendarBookingsProvider refreshNylasState={refreshNylasState}>\n      {children({\n        ...nylasSchedulingState.result,\n        submissionId,\n      })}\n    </CalendarBookingsProvider>\n  )\n}\n\nexport default function CalendarBookingsContainer<T>({\n  fetchConfiguration,\n  children,\n}: {\n  fetchConfiguration: (\n    submissionId: string,\n    abortSignal: AbortSignal,\n  ) => Promise<T>\n  children: (renderProps: { submissionId: string } & T) => React.ReactNode\n}) {\n  const { submissionId: submissionIdQs } = useQuery()\n\n  const submissionId = React.useMemo(\n    () => (typeof submissionIdQs === 'string' ? submissionIdQs : undefined),\n    [submissionIdQs],\n  )\n\n  if (!submissionId) {\n    return (\n      <ErrorMessage title=\"Missing Configuration\" gutterTop>\n        <span className=\"cypress-scheduling-booking-form-invalid-querystring ob-scheduling-booking-form__invalid-querystring-message\">\n          It seems you have navigated here incorrectly. Please go back.\n        </span>\n      </ErrorMessage>\n    )\n  }\n\n  return (\n    <CalendarBookingLoader\n      fetchConfiguration={fetchConfiguration}\n      submissionId={submissionId}\n    >\n      {children}\n    </CalendarBookingLoader>\n  )\n}\n"]}
+{"version":3,"file":"CalendarBookingsContainer.js","sourceRoot":"","sources":["../../../src/components/calendar-bookings/CalendarBookingsContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,sBAAsB,CAAA;AAC3C,OAAO,gBAAgB,MAAM,8BAA8B,CAAA;AAC3D,OAAO,YAAY,MAAM,0BAA0B,CAAA;AACnD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAA;AACrE,OAAO,SAAS,MAAM,uBAAuB,CAAA;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAA;AAOrC,SAAS,qBAAqB,CAAI,EAChC,YAAY,EACZ,kBAAkB,EAClB,QAAQ,GAKT;IACC,MAAM,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,GAAG,gBAAgB,CAChE,KAAK,CAAC,WAAW,CACf,KAAK,EAAE,WAAW,EAAE,EAAE;QACpB,OAAO,MAAM,kBAAkB,CAAC,YAAY,EAAE,WAAW,CAAC,CAAA;IAC5D,CAAC,EACD,CAAC,kBAAkB,EAAE,YAAY,CAAC,CACnC,CACF,CAAA;IAED,IAAI,oBAAoB,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;QAC9C,OAAO,CACL,cAAK,SAAS,EAAC,kBAAkB,YAC/B,cAAK,SAAS,EAAC,mCAAmC,YAChD,KAAC,SAAS,IAAC,SAAS,EAAC,mBAAmB,GAAG,GACvC,GACF,CACP,CAAA;IACH,CAAC;IAED,IAAI,oBAAoB,CAAC,MAAM,KAAK,OAAO,EAAE,CAAC;QAC5C,OAAO,CACL,KAAC,UAAU,IACT,KAAK,EAAE,oBAAoB,CAAC,KAAK,EACjC,OAAO,EAAE,iBAAiB,GAC1B,CACH,CAAA;IACH,CAAC;IAED,OAAO,CACL,KAAC,wBAAwB,IAAC,iBAAiB,EAAE,iBAAiB,YAC3D,QAAQ,CAAC;YACR,GAAG,oBAAoB,CAAC,MAAM;YAC9B,YAAY;SACb,CAAC,GACuB,CAC5B,CAAA;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAI,EACnD,kBAAkB,EAClB,QAAQ,GAOT;IACC,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAE,CAAA;IAEnD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC,OAAO,cAAc,KAAK,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,EACvE,CAAC,cAAc,CAAC,CACjB,CAAA;IAED,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,OAAO,CACL,KAAC,YAAY,IAAC,KAAK,EAAC,uBAAuB,EAAC,SAAS,kBACnD,eAAM,SAAS,EAAC,6GAA6G,8EAEtH,GACM,CAChB,CAAA;IACH,CAAC;IAED,OAAO,CACL,KAAC,qBAAqB,IACpB,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,YAEzB,QAAQ,GACa,CACzB,CAAA;AACH,CAAC","sourcesContent":["import React from 'react'\nimport useQuery from '../../hooks/useQuery'\nimport useLoadDataState from '../../hooks/useLoadDataState'\nimport ErrorMessage from '../messages/ErrorMessage'\nimport { CalendarBookingsProvider } from './CalendarBookingsProvider'\nimport OnLoading from '../renderer/OnLoading'\nimport ErrorModal from './ErrorModal'\n\ntype FetchConfiguration<T> = (\n  submissionId: string,\n  abortSignal: AbortSignal,\n) => Promise<T>\n\nfunction CalendarBookingLoader<T>({\n  submissionId,\n  fetchConfiguration,\n  children,\n}: {\n  submissionId: string\n  fetchConfiguration: FetchConfiguration<T>\n  children: (renderProps: { submissionId: string } & T) => React.ReactNode\n}) {\n  const [nylasSchedulingState, refreshNylasState] = useLoadDataState<T>(\n    React.useCallback(\n      async (abortSignal) => {\n        return await fetchConfiguration(submissionId, abortSignal)\n      },\n      [fetchConfiguration, submissionId],\n    ),\n  )\n\n  if (nylasSchedulingState.status === 'LOADING') {\n    return (\n      <div className=\"has-margin-top-1\">\n        <div className=\"cypress-loading has-text-centered\">\n          <OnLoading className=\"has-text-centered\" />\n        </div>\n      </div>\n    )\n  }\n\n  if (nylasSchedulingState.status === 'ERROR') {\n    return (\n      <ErrorModal\n        error={nylasSchedulingState.error}\n        onClose={refreshNylasState}\n      />\n    )\n  }\n\n  return (\n    <CalendarBookingsProvider refreshNylasState={refreshNylasState}>\n      {children({\n        ...nylasSchedulingState.result,\n        submissionId,\n      })}\n    </CalendarBookingsProvider>\n  )\n}\n\nexport default function CalendarBookingsContainer<T>({\n  fetchConfiguration,\n  children,\n}: {\n  fetchConfiguration: (\n    submissionId: string,\n    abortSignal: AbortSignal,\n  ) => Promise<T>\n  children: (renderProps: { submissionId: string } & T) => React.ReactNode\n}) {\n  const { submissionId: submissionIdQs } = useQuery()\n\n  const submissionId = React.useMemo(\n    () => (typeof submissionIdQs === 'string' ? submissionIdQs : undefined),\n    [submissionIdQs],\n  )\n\n  if (!submissionId) {\n    return (\n      <ErrorMessage title=\"Missing Configuration\" gutterTop>\n        <span className=\"cypress-scheduling-booking-form-invalid-querystring ob-scheduling-booking-form__invalid-querystring-message\">\n          It seems you have navigated here incorrectly. Please go back.\n        </span>\n      </ErrorMessage>\n    )\n  }\n\n  return (\n    <CalendarBookingLoader\n      fetchConfiguration={fetchConfiguration}\n      submissionId={submissionId}\n    >\n      {children}\n    </CalendarBookingLoader>\n  )\n}\n"]}

package/dist/components/calendar-bookings/CalendarBookingsForm.d.ts

@@ -2,6 +2,6 @@ import * as React from 'react';
 import { submissionService } from '@oneblink/apps';
 declare function CalendarBookingsForm({ onDone, }: {
     onDone: (formSubmissionResult: submissionService.FormSubmissionResult) => Promise<void>;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof CalendarBookingsForm>;
 export default _default;

package/dist/components/calendar-bookings/CalendarBookingsForm.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import { NylasScheduling } from '@nylas/react';
 import { Collapse, Fade } from '@mui/material';
@@ -86,53 +87,40 @@ function NylasBookingForm({ submissionId, name, email, configurationId, sessionI
             }));
         }
     }, [onBookingConfirmed, executePostSubmissionAction]);
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Collapse, { in: isConfirmingBooking },
-            React.createElement("div", { className: "has-margin-top-1" },
-                React.createElement("div", { className: "cypress-loading has-text-centered" },
-                    React.createElement(OnLoading, { className: "has-text-centered" }),
-                    React.createElement(Fade, { in: !!(formSubmissionResult === null || formSubmissionResult === void 0 ? void 0 : formSubmissionResult.payment) },
-                        React.createElement("span", null, "Redirecting to payment"))))),
-        React.createElement("div", { className: "ob-scheduling-booking-form" },
-            !(formSubmissionResult === null || formSubmissionResult === void 0 ? void 0 : formSubmissionResult.payment) && (React.createElement(NylasScheduling, { eventOverrides: {
-                    timeslotConfirmed: onTimeSlotConfirmed,
-                    async bookedEventInfo(event) {
-                        var _a, _b;
-                        console.log('bookedEventInfo event', event);
-                        event.preventDefault();
-                        if ('error' in event.detail) {
-                            setBookingError((_b = (_a = event.detail.error) === null || _a === void 0 ? void 0 : _a.message) !== null && _b !== void 0 ? _b : 'Calendar Booking Error');
-                        }
-                        else if ('data' in event.detail) {
-                            await handleConfirmedBooking({
-                                submissionId,
-                                startTime: new Date(event.detail.data.start_time * 1000),
-                                endTime: new Date(event.detail.data.end_time * 1000),
-                                location: event.detail.data.location,
-                                isReschedule: false,
-                            });
-                        }
-                    },
-                }, bookingInfo: {
-                    primaryParticipant: {
-                        name: name !== null && name !== void 0 ? name : '',
-                        email: email !== null && email !== void 0 ? email : '',
-                    },
-                    additionalFields: {
-                        submissionId: {
-                            value: submissionId,
-                            type: 'text',
-                        },
-                    },
-                }, enableUserFeedback: false, configurationId: configurationId, sessionId: sessionId, nylasBranding: false })),
-            formSubmissionResult && !formSubmissionResult.payment && (React.createElement(Receipt, { className: "ob-scheduling-receipt", containerClassName: "ob-scheduling-receipt__container" },
-                React.createElement("div", { className: "buttons" },
-                    React.createElement("button", { type: "button", className: clsx('is-primary button ob-button ob-scheduling-receipt__button ob-scheduling-receipt__okay-button cypress-scheduling-receipt-okay-button', { 'is-loading': isRunningPostSubmissionAction }), disabled: isRunningPostSubmissionAction, onClick: () => executePostSubmissionAction(formSubmissionResult) }, "Done")))),
-            React.createElement(ErrorModal, { error: postSubmissionError, onClose: clearPostSubmissionError }),
-            React.createElement(ErrorModal, { error: confirmingBookingError, onClose: clearConfirmingBookingError }))));
+    return (_jsxs(_Fragment, { children: [_jsx(Collapse, { in: isConfirmingBooking, children: _jsx("div", { className: "has-margin-top-1", children: _jsxs("div", { className: "cypress-loading has-text-centered", children: [_jsx(OnLoading, { className: "has-text-centered" }), _jsx(Fade, { in: !!(formSubmissionResult === null || formSubmissionResult === void 0 ? void 0 : formSubmissionResult.payment), children: _jsx("span", { children: "Redirecting to payment" }) })] }) }) }), _jsxs("div", { className: "ob-scheduling-booking-form", children: [!(formSubmissionResult === null || formSubmissionResult === void 0 ? void 0 : formSubmissionResult.payment) && (_jsx(NylasScheduling, { eventOverrides: {
+                            timeslotConfirmed: onTimeSlotConfirmed,
+                            async bookedEventInfo(event) {
+                                var _a, _b;
+                                console.log('bookedEventInfo event', event);
+                                event.preventDefault();
+                                if ('error' in event.detail) {
+                                    setBookingError((_b = (_a = event.detail.error) === null || _a === void 0 ? void 0 : _a.message) !== null && _b !== void 0 ? _b : 'Calendar Booking Error');
+                                }
+                                else if ('data' in event.detail) {
+                                    await handleConfirmedBooking({
+                                        submissionId,
+                                        startTime: new Date(event.detail.data.start_time * 1000),
+                                        endTime: new Date(event.detail.data.end_time * 1000),
+                                        location: event.detail.data.location,
+                                        isReschedule: false,
+                                    });
+                                }
+                            },
+                        }, bookingInfo: {
+                            primaryParticipant: {
+                                name: name !== null && name !== void 0 ? name : '',
+                                email: email !== null && email !== void 0 ? email : '',
+                            },
+                            additionalFields: {
+                                submissionId: {
+                                    value: submissionId,
+                                    type: 'text',
+                                },
+                            },
+                        }, enableUserFeedback: false, configurationId: configurationId, sessionId: sessionId, nylasBranding: false })), formSubmissionResult && !formSubmissionResult.payment && (_jsx(Receipt, { className: "ob-scheduling-receipt", containerClassName: "ob-scheduling-receipt__container", children: _jsx("div", { className: "buttons", children: _jsx("button", { type: "button", className: clsx('is-primary button ob-button ob-scheduling-receipt__button ob-scheduling-receipt__okay-button cypress-scheduling-receipt-okay-button', { 'is-loading': isRunningPostSubmissionAction }), disabled: isRunningPostSubmissionAction, onClick: () => executePostSubmissionAction(formSubmissionResult), children: "Done" }) }) })), _jsx(ErrorModal, { error: postSubmissionError, onClose: clearPostSubmissionError }), _jsx(ErrorModal, { error: confirmingBookingError, onClose: clearConfirmingBookingError })] })] }));
 }
 function CalendarBookingsForm({ onDone, }) {
-    return (React.createElement(CalendarBookingsContainer, { fetchConfiguration: schedulingService.createNylasNewBookingSession }, (props) => React.createElement(NylasBookingForm, { ...props, onDone: onDone })));
+    return (_jsx(CalendarBookingsContainer, { fetchConfiguration: schedulingService.createNylasNewBookingSession, children: (props) => _jsx(NylasBookingForm, { ...props, onDone: onDone }) }));
 }
 export default React.memo(CalendarBookingsForm);
 //# sourceMappingURL=CalendarBookingsForm.js.map