@oneblink/apps-react 5.6.1-beta.1 → 5.7.0-beta.1

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.
@@ -116,7 +116,8 @@ function PaymentReceipt({ onDone, onCancel, }) {
116
116
  amount: submissionResult.payment.amount,
117
117
  formSubmissionResult: submissionResult,
118
118
  paymentSubmissionEvent,
119
- paymentReceiptUrl: `${window.location.origin}${window.location.pathname}`,
119
+ paymentReceiptUrl: submissionResult.payment.paymentReceiptUrl,
120
+ paymentFormUrl: submissionResult.payment.paymentFormUrl,
120
121
  });
121
122
  await submissionService.executePostSubmissionAction(submissionResult, history.push);
122
123
  }
@@ -1 +1 @@
1
- {"version":3,"file":"PaymentReceipt.js","sourceRoot":"","sources":["../src/PaymentReceipt.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { useHistory } from 'react-router-dom'\nimport {\n paymentService,\n submissionService,\n OneBlinkAppsError,\n} from '@oneblink/apps'\nimport useIsMounted from './hooks/useIsMounted'\n\nimport useQuery from './hooks/useQuery'\nimport Modal from './components/renderer/Modal'\nimport OnLoading from './components/renderer/OnLoading'\nimport {\n Receipt,\n ReceiptList,\n ReceiptListItem,\n ReceiptButton,\n} from './components/receipts'\n\nconst { handlePaymentQuerystring, handlePaymentSubmissionEvent } =\n paymentService\n\nfunction PaymentReceipt({\n onDone,\n onCancel,\n}: {\n /**\n * The function to call when the user clicks 'Done'. See\n * [FormSubmissionResult](https://oneblink.github.io/apps/modules/submissionService.html#FormSubmissionResult)\n * for the structure of the argument.\n */\n onDone: (\n submissionResult: submissionService.FormSubmissionResult,\n ) => Promise<void>\n /**\n * The function to call when the user clicks 'Cancel'. See\n * [FormSubmissionResult](https://oneblink.github.io/apps/modules/submissionService.html#FormSubmissionResult)\n * for the structure of the argument.\n */\n onCancel: (\n submissionResult: submissionService.FormSubmissionResult,\n ) => Promise<void>\n}) {\n const isMounted = useIsMounted()\n const query = useQuery()\n const history = useHistory()\n\n const [\n { isLoading, loadError, transaction, submissionResult, receiptItems },\n setLoadState,\n ] = React.useState<{\n isLoading: boolean\n loadError: Error | null\n transaction: paymentService.HandlePaymentResult['transaction'] | null\n submissionResult: submissionService.FormSubmissionResult | null\n receiptItems: paymentService.PaymentReceiptItem[] | null\n }>({\n isLoading: true,\n loadError: null,\n transaction: null,\n submissionResult: null,\n receiptItems: null,\n })\n const [\n { isRunningPostSubmissionAction, postSubmissionError },\n setPostSubmissionState,\n ] = React.useState<{\n isRunningPostSubmissionAction: boolean\n postSubmissionError: OneBlinkAppsError | null\n }>({\n isRunningPostSubmissionAction: false,\n postSubmissionError: null,\n })\n const clearPostSubmissionError = React.useCallback(() => {\n setPostSubmissionState((currentState) => ({\n ...currentState,\n postSubmissionError: null,\n }))\n }, [])\n const [{ isRetrying, retryError }, setRetryState] = React.useState<{\n isRetrying: boolean\n retryError: OneBlinkAppsError | null\n }>({\n isRetrying: false,\n retryError: null,\n })\n const clearRetryError = React.useCallback(() => {\n setRetryState((currentState) => ({\n ...currentState,\n retryError: null,\n }))\n }, [])\n\n React.useEffect(() => {\n let ignore = false\n\n const getTransaction = async () => {\n let newError = null\n let newTransaction = null\n let newSubmissionResult = null\n let newReceiptItems = null\n try {\n const result = await handlePaymentQuerystring(query)\n newTransaction = result.transaction\n newSubmissionResult = result.submissionResult\n newReceiptItems = result.receiptItems\n } catch (error) {\n console.warn('Error while attempting to load transaction', error)\n newError = error as Error\n }\n\n if (!ignore) {\n setLoadState({\n isLoading: false,\n loadError: newError,\n transaction: newTransaction,\n submissionResult: newSubmissionResult,\n receiptItems: newReceiptItems,\n })\n }\n }\n getTransaction()\n\n return () => {\n ignore = true\n }\n }, [query])\n\n const executePostSubmissionAction = React.useCallback(\n async (\n action: (\n submissionRresult: submissionService.FormSubmissionResult,\n ) => Promise<void>,\n ) => {\n if (!submissionResult || !isMounted.current) {\n return\n }\n\n setPostSubmissionState({\n isRunningPostSubmissionAction: true,\n postSubmissionError: null,\n })\n\n let newError = null\n try {\n await action({ ...submissionResult, payment: null })\n } catch (error) {\n console.warn('Error while running post submission action', error)\n newError = error as OneBlinkAppsError\n }\n\n if (isMounted.current) {\n setPostSubmissionState({\n isRunningPostSubmissionAction: false,\n postSubmissionError: newError,\n })\n }\n },\n [isMounted, submissionResult],\n )\n\n const handleDone = React.useCallback(async () => {\n executePostSubmissionAction(onDone)\n }, [executePostSubmissionAction, onDone])\n\n const handleCancel = React.useCallback(() => {\n executePostSubmissionAction(onCancel)\n }, [executePostSubmissionAction, onCancel])\n\n const handleTryAgain = React.useCallback(async () => {\n if (!submissionResult || !submissionResult.payment) {\n return\n }\n const paymentSubmissionEvent = submissionResult.payment.submissionEvent\n\n if (isMounted.current) {\n setRetryState({\n isRetrying: true,\n retryError: null,\n })\n }\n\n let newError = null\n try {\n submissionResult.payment = await handlePaymentSubmissionEvent({\n amount: submissionResult.payment.amount,\n formSubmissionResult: submissionResult,\n paymentSubmissionEvent,\n paymentReceiptUrl: `${window.location.origin}${window.location.pathname}`,\n })\n await submissionService.executePostSubmissionAction(\n submissionResult,\n history.push,\n )\n } catch (error) {\n console.warn('Error while attempting to retry transaction', error)\n newError = error as OneBlinkAppsError\n }\n\n if (isMounted.current) {\n setRetryState({\n isRetrying: false,\n retryError: newError,\n })\n }\n }, [history.push, isMounted, submissionResult])\n\n return (\n <div>\n {isLoading && (\n <section>\n <div className=\"cypress-loading has-text-centered\">\n <OnLoading className=\"has-text-centered\"></OnLoading>\n <span>Retrieving transaction details...</span>\n </div>\n </section>\n )}\n\n {transaction && (\n <Receipt\n className=\"ob-payment-receipt\"\n containerClassName=\"ob-payment-receipt__container\"\n >\n <ReceiptList\n successIconClassName=\"ob-payment-receipt__success-icon\"\n warningIconClassName=\"ob-payment-receipt__warning-icon\"\n warningMessageClassName=\"ob-payment-receipt__warning-message cypress-payment-receipt-warning-message\"\n warningMessage={\n transaction.isSuccess\n ? undefined\n : transaction.errorMessage || undefined\n }\n >\n {receiptItems &&\n receiptItems.length &&\n receiptItems.map((receiptItem, i) => {\n return (\n <ReceiptListItem\n key={i}\n className={receiptItem.className ?? ''}\n valueClassName={receiptItem.valueClassName ?? ''}\n icon={receiptItem.icon}\n label={receiptItem.label}\n value={receiptItem.value}\n allowCopyToClipboard={receiptItem.allowCopyToClipboard}\n />\n )\n })}\n <ReceiptListItem\n className=\"ob-payment-receipt__warning\"\n valueClassName=\"cypress-payment-receipt-warning\"\n label=\"Warning\"\n value=\"Please do not click back in your browser, doing so will cause issues with your payment.\"\n />\n </ReceiptList>\n\n <div className=\"buttons\">\n {transaction.isSuccess ? (\n <ReceiptButton\n className=\"is-primary ob-payment-receipt__button ob-payment-receipt__okay-button cypress-payment-receipt-okay-button\"\n label=\"Done\"\n isLoading={isRunningPostSubmissionAction}\n onClick={handleDone}\n />\n ) : (\n <>\n <ReceiptButton\n className=\"ob-payment-receipt__button ob-payment-receipt__cancel-button cypress-payment-receipt-cancel-button\"\n label=\"Cancel\"\n isDisabled={isRetrying}\n isLoading={isRunningPostSubmissionAction}\n onClick={handleCancel}\n />\n <ReceiptButton\n className=\"is-primary ob-payment-receipt__button ob-payment-receipt__try-again-button cypress-payment-receipt-try-again-button\"\n label=\"Try Again\"\n isDisabled={isRunningPostSubmissionAction}\n isLoading={isRetrying}\n onClick={handleTryAgain}\n />\n </>\n )}\n </div>\n </Receipt>\n )}\n\n {loadError && (\n <section className=\"cypress-payment-receipt-loading-error-message\">\n <div className=\"ob-payment-receipt__error-icon-container has-text-centered has-margin-bottom-8\">\n <i className=\"ob-payment-receipt__error-icon material-icons has-text-danger icon-x-large\">\n error\n </i>\n </div>\n <p className=\"ob-payment-receipt__error-message has-text-centered has-margin-bottom-4\">\n {loadError.message}\n </p>\n </section>\n )}\n\n {retryError && (\n <Modal\n isOpen\n title={retryError.title || 'Whoops...'}\n bodyClassName=\"cypress-payment-receipt-retry-error-message\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-payment-receipt-retry-error-okay-button\"\n onClick={clearRetryError}\n >\n Okay\n </button>\n }\n >\n {retryError.message}\n </Modal>\n )}\n\n {postSubmissionError && (\n <Modal\n isOpen\n title={postSubmissionError.title || 'Whoops...'}\n bodyClassName=\"cypress-payment-receipt-retry-error-message\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-payment-receipt-retry-error-okay-button\"\n onClick={clearPostSubmissionError}\n >\n Okay\n </button>\n }\n >\n {postSubmissionError.message}\n </Modal>\n )}\n </div>\n )\n}\n\n/**\n * Component for rendering a OneBlink Form Payment Receipt. This component will\n * payment receipt but it is up to the developer to implement what happens when\n * the user clicks 'Done'.\n *\n * It is also recommended to import the `css` from this library as well.\n *\n * ```js\n * import { PaymentReceipt } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n * ```\n *\n * #### Example\n *\n * ```tsx\n * import React from 'react'\n * import ReactDOM from 'react-dom'\n * import { PaymentReceipt } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n *\n * function ReceiptContainer() {\n * const handleDone = React.useCallback(async () => {\n * console.log('All done!')\n * }, [])\n * const handleCancel = React.useCallback(async () => {\n * console.log('Cancelled!')\n * }, [])\n *\n * return <PaymentReceipt onDone={handleDone} onCancel={handleCancel} />\n * }\n *\n * function App() {\n * return (\n * <IsOfflineContextProvider>\n * <ReceiptContainer />\n * </IsOfflineContextProvider>\n * )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n * ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport default React.memo(PaymentReceipt)\n"]}
1
+ {"version":3,"file":"PaymentReceipt.js","sourceRoot":"","sources":["../src/PaymentReceipt.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { useHistory } from 'react-router-dom'\nimport {\n paymentService,\n submissionService,\n OneBlinkAppsError,\n} from '@oneblink/apps'\nimport useIsMounted from './hooks/useIsMounted'\n\nimport useQuery from './hooks/useQuery'\nimport Modal from './components/renderer/Modal'\nimport OnLoading from './components/renderer/OnLoading'\nimport {\n Receipt,\n ReceiptList,\n ReceiptListItem,\n ReceiptButton,\n} from './components/receipts'\n\nconst { handlePaymentQuerystring, handlePaymentSubmissionEvent } =\n paymentService\n\nfunction PaymentReceipt({\n onDone,\n onCancel,\n}: {\n /**\n * The function to call when the user clicks 'Done'. See\n * [FormSubmissionResult](https://oneblink.github.io/apps/modules/submissionService.html#FormSubmissionResult)\n * for the structure of the argument.\n */\n onDone: (\n submissionResult: submissionService.FormSubmissionResult,\n ) => Promise<void>\n /**\n * The function to call when the user clicks 'Cancel'. See\n * [FormSubmissionResult](https://oneblink.github.io/apps/modules/submissionService.html#FormSubmissionResult)\n * for the structure of the argument.\n */\n onCancel: (\n submissionResult: submissionService.FormSubmissionResult,\n ) => Promise<void>\n}) {\n const isMounted = useIsMounted()\n const query = useQuery()\n const history = useHistory()\n\n const [\n { isLoading, loadError, transaction, submissionResult, receiptItems },\n setLoadState,\n ] = React.useState<{\n isLoading: boolean\n loadError: Error | null\n transaction: paymentService.HandlePaymentResult['transaction'] | null\n submissionResult: submissionService.FormSubmissionResult | null\n receiptItems: paymentService.PaymentReceiptItem[] | null\n }>({\n isLoading: true,\n loadError: null,\n transaction: null,\n submissionResult: null,\n receiptItems: null,\n })\n const [\n { isRunningPostSubmissionAction, postSubmissionError },\n setPostSubmissionState,\n ] = React.useState<{\n isRunningPostSubmissionAction: boolean\n postSubmissionError: OneBlinkAppsError | null\n }>({\n isRunningPostSubmissionAction: false,\n postSubmissionError: null,\n })\n const clearPostSubmissionError = React.useCallback(() => {\n setPostSubmissionState((currentState) => ({\n ...currentState,\n postSubmissionError: null,\n }))\n }, [])\n const [{ isRetrying, retryError }, setRetryState] = React.useState<{\n isRetrying: boolean\n retryError: OneBlinkAppsError | null\n }>({\n isRetrying: false,\n retryError: null,\n })\n const clearRetryError = React.useCallback(() => {\n setRetryState((currentState) => ({\n ...currentState,\n retryError: null,\n }))\n }, [])\n\n React.useEffect(() => {\n let ignore = false\n\n const getTransaction = async () => {\n let newError = null\n let newTransaction = null\n let newSubmissionResult = null\n let newReceiptItems = null\n try {\n const result = await handlePaymentQuerystring(query)\n newTransaction = result.transaction\n newSubmissionResult = result.submissionResult\n newReceiptItems = result.receiptItems\n } catch (error) {\n console.warn('Error while attempting to load transaction', error)\n newError = error as Error\n }\n\n if (!ignore) {\n setLoadState({\n isLoading: false,\n loadError: newError,\n transaction: newTransaction,\n submissionResult: newSubmissionResult,\n receiptItems: newReceiptItems,\n })\n }\n }\n getTransaction()\n\n return () => {\n ignore = true\n }\n }, [query])\n\n const executePostSubmissionAction = React.useCallback(\n async (\n action: (\n submissionRresult: submissionService.FormSubmissionResult,\n ) => Promise<void>,\n ) => {\n if (!submissionResult || !isMounted.current) {\n return\n }\n\n setPostSubmissionState({\n isRunningPostSubmissionAction: true,\n postSubmissionError: null,\n })\n\n let newError = null\n try {\n await action({ ...submissionResult, payment: null })\n } catch (error) {\n console.warn('Error while running post submission action', error)\n newError = error as OneBlinkAppsError\n }\n\n if (isMounted.current) {\n setPostSubmissionState({\n isRunningPostSubmissionAction: false,\n postSubmissionError: newError,\n })\n }\n },\n [isMounted, submissionResult],\n )\n\n const handleDone = React.useCallback(async () => {\n executePostSubmissionAction(onDone)\n }, [executePostSubmissionAction, onDone])\n\n const handleCancel = React.useCallback(() => {\n executePostSubmissionAction(onCancel)\n }, [executePostSubmissionAction, onCancel])\n\n const handleTryAgain = React.useCallback(async () => {\n if (!submissionResult || !submissionResult.payment) {\n return\n }\n const paymentSubmissionEvent = submissionResult.payment.submissionEvent\n\n if (isMounted.current) {\n setRetryState({\n isRetrying: true,\n retryError: null,\n })\n }\n\n let newError = null\n try {\n submissionResult.payment = await handlePaymentSubmissionEvent({\n amount: submissionResult.payment.amount,\n formSubmissionResult: submissionResult,\n paymentSubmissionEvent,\n paymentReceiptUrl: submissionResult.payment.paymentReceiptUrl,\n paymentFormUrl: submissionResult.payment.paymentFormUrl,\n })\n await submissionService.executePostSubmissionAction(\n submissionResult,\n history.push,\n )\n } catch (error) {\n console.warn('Error while attempting to retry transaction', error)\n newError = error as OneBlinkAppsError\n }\n\n if (isMounted.current) {\n setRetryState({\n isRetrying: false,\n retryError: newError,\n })\n }\n }, [history.push, isMounted, submissionResult])\n\n return (\n <div>\n {isLoading && (\n <section>\n <div className=\"cypress-loading has-text-centered\">\n <OnLoading className=\"has-text-centered\"></OnLoading>\n <span>Retrieving transaction details...</span>\n </div>\n </section>\n )}\n\n {transaction && (\n <Receipt\n className=\"ob-payment-receipt\"\n containerClassName=\"ob-payment-receipt__container\"\n >\n <ReceiptList\n successIconClassName=\"ob-payment-receipt__success-icon\"\n warningIconClassName=\"ob-payment-receipt__warning-icon\"\n warningMessageClassName=\"ob-payment-receipt__warning-message cypress-payment-receipt-warning-message\"\n warningMessage={\n transaction.isSuccess\n ? undefined\n : transaction.errorMessage || undefined\n }\n >\n {receiptItems &&\n receiptItems.length &&\n receiptItems.map((receiptItem, i) => {\n return (\n <ReceiptListItem\n key={i}\n className={receiptItem.className ?? ''}\n valueClassName={receiptItem.valueClassName ?? ''}\n icon={receiptItem.icon}\n label={receiptItem.label}\n value={receiptItem.value}\n allowCopyToClipboard={receiptItem.allowCopyToClipboard}\n />\n )\n })}\n <ReceiptListItem\n className=\"ob-payment-receipt__warning\"\n valueClassName=\"cypress-payment-receipt-warning\"\n label=\"Warning\"\n value=\"Please do not click back in your browser, doing so will cause issues with your payment.\"\n />\n </ReceiptList>\n\n <div className=\"buttons\">\n {transaction.isSuccess ? (\n <ReceiptButton\n className=\"is-primary ob-payment-receipt__button ob-payment-receipt__okay-button cypress-payment-receipt-okay-button\"\n label=\"Done\"\n isLoading={isRunningPostSubmissionAction}\n onClick={handleDone}\n />\n ) : (\n <>\n <ReceiptButton\n className=\"ob-payment-receipt__button ob-payment-receipt__cancel-button cypress-payment-receipt-cancel-button\"\n label=\"Cancel\"\n isDisabled={isRetrying}\n isLoading={isRunningPostSubmissionAction}\n onClick={handleCancel}\n />\n <ReceiptButton\n className=\"is-primary ob-payment-receipt__button ob-payment-receipt__try-again-button cypress-payment-receipt-try-again-button\"\n label=\"Try Again\"\n isDisabled={isRunningPostSubmissionAction}\n isLoading={isRetrying}\n onClick={handleTryAgain}\n />\n </>\n )}\n </div>\n </Receipt>\n )}\n\n {loadError && (\n <section className=\"cypress-payment-receipt-loading-error-message\">\n <div className=\"ob-payment-receipt__error-icon-container has-text-centered has-margin-bottom-8\">\n <i className=\"ob-payment-receipt__error-icon material-icons has-text-danger icon-x-large\">\n error\n </i>\n </div>\n <p className=\"ob-payment-receipt__error-message has-text-centered has-margin-bottom-4\">\n {loadError.message}\n </p>\n </section>\n )}\n\n {retryError && (\n <Modal\n isOpen\n title={retryError.title || 'Whoops...'}\n bodyClassName=\"cypress-payment-receipt-retry-error-message\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-payment-receipt-retry-error-okay-button\"\n onClick={clearRetryError}\n >\n Okay\n </button>\n }\n >\n {retryError.message}\n </Modal>\n )}\n\n {postSubmissionError && (\n <Modal\n isOpen\n title={postSubmissionError.title || 'Whoops...'}\n bodyClassName=\"cypress-payment-receipt-retry-error-message\"\n actions={\n <button\n type=\"button\"\n className=\"button ob-button is-primary cypress-payment-receipt-retry-error-okay-button\"\n onClick={clearPostSubmissionError}\n >\n Okay\n </button>\n }\n >\n {postSubmissionError.message}\n </Modal>\n )}\n </div>\n )\n}\n\n/**\n * Component for rendering a OneBlink Form Payment Receipt. This component will\n * payment receipt but it is up to the developer to implement what happens when\n * the user clicks 'Done'.\n *\n * It is also recommended to import the `css` from this library as well.\n *\n * ```js\n * import { PaymentReceipt } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n * ```\n *\n * #### Example\n *\n * ```tsx\n * import React from 'react'\n * import ReactDOM from 'react-dom'\n * import { PaymentReceipt } from '@oneblink/apps-react'\n * import '@oneblink/apps-react/dist/styles.css'\n *\n * function ReceiptContainer() {\n * const handleDone = React.useCallback(async () => {\n * console.log('All done!')\n * }, [])\n * const handleCancel = React.useCallback(async () => {\n * console.log('Cancelled!')\n * }, [])\n *\n * return <PaymentReceipt onDone={handleDone} onCancel={handleCancel} />\n * }\n *\n * function App() {\n * return (\n * <IsOfflineContextProvider>\n * <ReceiptContainer />\n * </IsOfflineContextProvider>\n * )\n * }\n *\n * const root = document.getElementById('root')\n * if (root) {\n * ReactDOM.render(<App />, root)\n * }\n * ```\n *\n * @param props\n * @returns\n * @group Components\n */\nexport default React.memo(PaymentReceipt)\n"]}
@@ -12,10 +12,10 @@ export declare const CustomAccordion: import("@emotion/styled").StyledComponent<
12
12
  children?: import("react").ReactElement<any, any> | undefined;
13
13
  }> | undefined;
14
14
  TransitionProps?: import("@mui/material/transitions").TransitionProps | undefined;
15
- } & Omit<import("@mui/material").PaperOwnProps, "onChange" | "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
15
+ } & Omit<import("@mui/material").PaperOwnProps, "classes" | "onChange"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
16
16
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
17
- }, "children" | "disabled" | "sx" | "onChange" | "elevation" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "disableGutters" | "square" | "defaultExpanded" | "expanded" | "TransitionComponent" | "TransitionProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
17
+ }, "children" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | "onChange" | "elevation" | "disabled" | "variant" | "disableGutters" | "square" | "defaultExpanded" | "expanded" | "TransitionComponent" | "TransitionProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
18
18
  export declare const CustomAccordionSummary: import("@emotion/styled").StyledComponent<import("@mui/material").AccordionSummaryOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
19
19
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
20
- }, "className" | "style" | "children" | "disabled" | "sx" | "tabIndex" | "action" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "expandIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
20
+ }, "className" | "style" | "children" | "classes" | "sx" | "tabIndex" | "disabled" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "expandIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
21
21
  export declare const CustomAccordionDetails: import("@emotion/styled").StyledComponent<import("@mui/material").AccordionDetailsProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -11,5 +11,5 @@ type ListProps = {
11
11
  };
12
12
  export declare const ListItem: import("@emotion/styled").StyledComponent<Omit<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof React.HTMLAttributes<HTMLSpanElement>> & {
13
13
  ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
14
- }, "className" | "p" | "style" | "children" | "top" | "right" | "bottom" | "left" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform" | "sx" | "align" | "classes" | "gutterBottom" | "noWrap" | "paragraph" | "variant" | "variantMapping">, "ref"> & import("@mui/system").MUIStyledCommonProps<Theme> & ListProps, {}, {}>;
14
+ }, "className" | "p" | "style" | "children" | "classes" | "sx" | "color" | "height" | "width" | "display" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "order" | "overflow" | "visibility" | "align" | "top" | "right" | "bottom" | "left" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "displayPrint" | "textOverflow" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "lineHeight" | "textAlign" | "textTransform" | "gutterBottom" | "noWrap" | "paragraph" | "variant" | "variantMapping">, "ref"> & import("@mui/system").MUIStyledCommonProps<Theme> & ListProps, {}, {}>;
15
15
  export {};
@@ -0,0 +1,13 @@
1
+ import { SubmissionTypes } from '@oneblink/types';
2
+ import React from 'react';
3
+ declare function PaymentForm({ onCompleted, onCancelled, }: {
4
+ onCompleted: (result: {
5
+ formSubmissionPayment: SubmissionTypes.FormSubmissionPayment;
6
+ paymentReceiptUrl: string;
7
+ }) => void;
8
+ onCancelled: (result: {
9
+ paymentReceiptUrl: string;
10
+ }) => void;
11
+ }): JSX.Element;
12
+ declare const _default: React.MemoExoticComponent<typeof PaymentForm>;
13
+ export default _default;
@@ -0,0 +1,55 @@
1
+ import { paymentService } from '@oneblink/apps';
2
+ import React from 'react';
3
+ import WestpacQuickStreamPaymentForm from './WestpacQuickStreamPaymentForm';
4
+ import useQuery from '../../hooks/useQuery';
5
+ import { useLoadDataState } from '../../typedoc';
6
+ import OnLoading from '../renderer/OnLoading';
7
+ function PaymentForm({ onCompleted, onCancelled, }) {
8
+ const query = useQuery();
9
+ const loadPaymentFormConfiguration = React.useCallback(async (abortSignal) => {
10
+ const formSubmissionPaymentId = query.formSubmissionPaymentId;
11
+ if (typeof formSubmissionPaymentId !== 'string') {
12
+ throw new Error('It looks like you are attempting to make an unknown payment.');
13
+ }
14
+ const { formSubmissionResult, paymentSubmissionEvent } = await paymentService.getFormSubmissionResultPayment();
15
+ switch (paymentSubmissionEvent.type) {
16
+ case 'BPOINT':
17
+ case 'CP_PAY':
18
+ case 'NSW_GOV_PAY':
19
+ case 'WESTPAC_QUICK_WEB': {
20
+ throw new Error(`"${paymentSubmissionEvent.type}" payment events do not support a custom payment form.`);
21
+ }
22
+ case 'WESTPAC_QUICK_STREAM': {
23
+ const { supplierBusinessCode, publishableApiKey, isTestMode } = await paymentService.westpacQuickStream.getPaymentFormConfiguration({
24
+ formSubmissionPaymentId,
25
+ formSubmissionResult,
26
+ paymentSubmissionEvent,
27
+ abortSignal,
28
+ });
29
+ return {
30
+ renderPaymentForm: () => (React.createElement(WestpacQuickStreamPaymentForm, { formSubmissionResult: formSubmissionResult, paymentSubmissionEvent: paymentSubmissionEvent, formSubmissionPaymentId: formSubmissionPaymentId, supplierBusinessCode: supplierBusinessCode, publishableApiKey: publishableApiKey, isTestMode: isTestMode, onCompleted: onCompleted, onCancelled: onCancelled })),
31
+ };
32
+ }
33
+ }
34
+ }, [onCancelled, onCompleted, query.formSubmissionPaymentId]);
35
+ const [state] = useLoadDataState(loadPaymentFormConfiguration);
36
+ switch (state.status) {
37
+ case 'LOADING': {
38
+ return (React.createElement("section", null,
39
+ React.createElement("div", { className: "cypress-loading has-text-centered" },
40
+ React.createElement(OnLoading, { className: "has-text-centered" }),
41
+ React.createElement("span", null, "Loading payment configuration..."))));
42
+ }
43
+ case 'ERROR': {
44
+ return (React.createElement("section", { className: "cypress-payment-form-loading-error-message" },
45
+ React.createElement("div", { className: "ob-payment-form__error-icon-container has-text-centered has-margin-bottom-8" },
46
+ React.createElement("i", { className: "ob-payment-form__error-icon material-icons has-text-danger icon-x-large" }, "error")),
47
+ React.createElement("p", { className: "ob-payment-form__error-message has-text-centered has-margin-bottom-4" }, state.error.message)));
48
+ }
49
+ case 'SUCCESS': {
50
+ return state.result.renderPaymentForm();
51
+ }
52
+ }
53
+ }
54
+ export default React.memo(PaymentForm);
55
+ //# sourceMappingURL=PaymentForm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PaymentForm.js","sourceRoot":"","sources":["../../../src/components/payments/PaymentForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,6BAA6B,MAAM,iCAAiC,CAAA;AAC3E,OAAO,QAAQ,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,SAAS,MAAM,uBAAuB,CAAA;AAE7C,SAAS,WAAW,CAAC,EACnB,WAAW,EACX,WAAW,GAOZ;IACC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,4BAA4B,GAAG,KAAK,CAAC,WAAW,CACpD,KAAK,EAAE,WAAwB,EAAE,EAAE;QACjC,MAAM,uBAAuB,GAAG,KAAK,CAAC,uBAAuB,CAAA;QAC7D,IAAI,OAAO,uBAAuB,KAAK,QAAQ,EAAE;YAC/C,MAAM,IAAI,KAAK,CACb,8DAA8D,CAC/D,CAAA;SACF;QAED,MAAM,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,GACpD,MAAM,cAAc,CAAC,8BAA8B,EAAE,CAAA;QACvD,QAAQ,sBAAsB,CAAC,IAAI,EAAE;YACnC,KAAK,QAAQ,CAAC;YACd,KAAK,QAAQ,CAAC;YACd,KAAK,aAAa,CAAC;YACnB,KAAK,mBAAmB,CAAC,CAAC;gBACxB,MAAM,IAAI,KAAK,CACb,IAAI,sBAAsB,CAAC,IAAI,wDAAwD,CACxF,CAAA;aACF;YACD,KAAK,sBAAsB,CAAC,CAAC;gBAC3B,MAAM,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,UAAU,EAAE,GAC3D,MAAM,cAAc,CAAC,kBAAkB,CAAC,2BAA2B,CACjE;oBACE,uBAAuB;oBACvB,oBAAoB;oBACpB,sBAAsB;oBACtB,WAAW;iBACZ,CACF,CAAA;gBACH,OAAO;oBACL,iBAAiB,EAAE,GAAG,EAAE,CAAC,CACvB,oBAAC,6BAA6B,IAC5B,oBAAoB,EAAE,oBAAoB,EAC1C,sBAAsB,EAAE,sBAAsB,EAC9C,uBAAuB,EAAE,uBAAuB,EAChD,oBAAoB,EAAE,oBAAoB,EAC1C,iBAAiB,EAAE,iBAAiB,EACpC,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW,GACxB,CACH;iBACF,CAAA;aACF;SACF;IACH,CAAC,EACD,CAAC,WAAW,EAAE,WAAW,EAAE,KAAK,CAAC,uBAAuB,CAAC,CAC1D,CAAA;IAED,MAAM,CAAC,KAAK,CAAC,GAAG,gBAAgB,CAAC,4BAA4B,CAAC,CAAA;IAE9D,QAAQ,KAAK,CAAC,MAAM,EAAE;QACpB,KAAK,SAAS,CAAC,CAAC;YACd,OAAO,CACL;gBACE,6BAAK,SAAS,EAAC,mCAAmC;oBAChD,oBAAC,SAAS,IAAC,SAAS,EAAC,mBAAmB,GAAa;oBACrD,qEAA6C,CACzC,CACE,CACX,CAAA;SACF;QACD,KAAK,OAAO,CAAC,CAAC;YACZ,OAAO,CACL,iCAAS,SAAS,EAAC,4CAA4C;gBAC7D,6BAAK,SAAS,EAAC,6EAA6E;oBAC1F,2BAAG,SAAS,EAAC,yEAAyE,YAElF,CACA;gBACN,2BAAG,SAAS,EAAC,sEAAsE,IAChF,KAAK,CAAC,KAAK,CAAC,OAAO,CAClB,CACI,CACX,CAAA;SACF;QACD,KAAK,SAAS,CAAC,CAAC;YACd,OAAO,KAAK,CAAC,MAAM,CAAC,iBAAiB,EAAE,CAAA;SACxC;KACF;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA","sourcesContent":["import { paymentService } from '@oneblink/apps'\nimport { SubmissionTypes } from '@oneblink/types'\nimport React from 'react'\nimport WestpacQuickStreamPaymentForm from './WestpacQuickStreamPaymentForm'\nimport useQuery from '../../hooks/useQuery'\nimport { useLoadDataState } from '../../typedoc'\nimport OnLoading from '../renderer/OnLoading'\n\nfunction PaymentForm({\n onCompleted,\n onCancelled,\n}: {\n onCompleted: (result: {\n formSubmissionPayment: SubmissionTypes.FormSubmissionPayment\n paymentReceiptUrl: string\n }) => void\n onCancelled: (result: { paymentReceiptUrl: string }) => void\n}) {\n const query = useQuery()\n\n const loadPaymentFormConfiguration = React.useCallback(\n async (abortSignal: AbortSignal) => {\n const formSubmissionPaymentId = query.formSubmissionPaymentId\n if (typeof formSubmissionPaymentId !== 'string') {\n throw new Error(\n 'It looks like you are attempting to make an unknown payment.',\n )\n }\n\n const { formSubmissionResult, paymentSubmissionEvent } =\n await paymentService.getFormSubmissionResultPayment()\n switch (paymentSubmissionEvent.type) {\n case 'BPOINT':\n case 'CP_PAY':\n case 'NSW_GOV_PAY':\n case 'WESTPAC_QUICK_WEB': {\n throw new Error(\n `\"${paymentSubmissionEvent.type}\" payment events do not support a custom payment form.`,\n )\n }\n case 'WESTPAC_QUICK_STREAM': {\n const { supplierBusinessCode, publishableApiKey, isTestMode } =\n await paymentService.westpacQuickStream.getPaymentFormConfiguration(\n {\n formSubmissionPaymentId,\n formSubmissionResult,\n paymentSubmissionEvent,\n abortSignal,\n },\n )\n return {\n renderPaymentForm: () => (\n <WestpacQuickStreamPaymentForm\n formSubmissionResult={formSubmissionResult}\n paymentSubmissionEvent={paymentSubmissionEvent}\n formSubmissionPaymentId={formSubmissionPaymentId}\n supplierBusinessCode={supplierBusinessCode}\n publishableApiKey={publishableApiKey}\n isTestMode={isTestMode}\n onCompleted={onCompleted}\n onCancelled={onCancelled}\n />\n ),\n }\n }\n }\n },\n [onCancelled, onCompleted, query.formSubmissionPaymentId],\n )\n\n const [state] = useLoadDataState(loadPaymentFormConfiguration)\n\n switch (state.status) {\n case 'LOADING': {\n return (\n <section>\n <div className=\"cypress-loading has-text-centered\">\n <OnLoading className=\"has-text-centered\"></OnLoading>\n <span>Loading payment configuration...</span>\n </div>\n </section>\n )\n }\n case 'ERROR': {\n return (\n <section className=\"cypress-payment-form-loading-error-message\">\n <div className=\"ob-payment-form__error-icon-container has-text-centered has-margin-bottom-8\">\n <i className=\"ob-payment-form__error-icon material-icons has-text-danger icon-x-large\">\n error\n </i>\n </div>\n <p className=\"ob-payment-form__error-message has-text-centered has-margin-bottom-4\">\n {state.error.message}\n </p>\n </section>\n )\n }\n case 'SUCCESS': {\n return state.result.renderPaymentForm()\n }\n }\n}\n\nexport default React.memo(PaymentForm)\n"]}
@@ -0,0 +1,47 @@
1
+ import { submissionService } from '@oneblink/apps';
2
+ import { SubmissionTypes, SubmissionEventTypes } from '@oneblink/types';
3
+ import React from 'react';
4
+ interface TrustedFrame {
5
+ submitForm(callback: (errors: Array<{
6
+ fieldName: string;
7
+ messages: string[];
8
+ }> | undefined, data: {
9
+ singleUseToken: {
10
+ singleUseTokenId: string;
11
+ };
12
+ }) => void): void;
13
+ }
14
+ declare global {
15
+ interface Window {
16
+ QuickstreamAPI: {
17
+ init(options: {
18
+ publishableApiKey: string;
19
+ }): void;
20
+ creditCards: {
21
+ createTrustedFrame(options: unknown, callback: (errors: Array<{
22
+ fieldName: string;
23
+ messages: string[];
24
+ }> | undefined, data: {
25
+ trustedFrame: TrustedFrame;
26
+ }) => void): void;
27
+ };
28
+ };
29
+ }
30
+ }
31
+ declare function WestpacQuickStreamPaymentForm({ formSubmissionResult, paymentSubmissionEvent, formSubmissionPaymentId, supplierBusinessCode, publishableApiKey, isTestMode, onCompleted, onCancelled, }: {
32
+ formSubmissionResult: submissionService.FormSubmissionResult;
33
+ paymentSubmissionEvent: SubmissionEventTypes.WestpacQuickStreamSubmissionEvent;
34
+ formSubmissionPaymentId: string;
35
+ supplierBusinessCode: string;
36
+ publishableApiKey: string;
37
+ isTestMode: boolean;
38
+ onCompleted: (result: {
39
+ formSubmissionPayment: SubmissionTypes.FormSubmissionPayment;
40
+ paymentReceiptUrl: string;
41
+ }) => void;
42
+ onCancelled: (result: {
43
+ paymentReceiptUrl: string;
44
+ }) => void;
45
+ }): JSX.Element;
46
+ declare const _default: React.MemoExoticComponent<typeof WestpacQuickStreamPaymentForm>;
47
+ export default _default;
@@ -0,0 +1,208 @@
1
+ import { OneBlinkAppsError, paymentService, } from '@oneblink/apps';
2
+ import clsx from 'clsx';
3
+ import React from 'react';
4
+ import OnLoading from '../renderer/OnLoading';
5
+ import OneBlinkAppsErrorOriginalMessage from '../renderer/OneBlinkAppsErrorOriginalMessage';
6
+ import Modal from '../renderer/Modal';
7
+ function WestpacQuickStreamPaymentForm({ formSubmissionResult, paymentSubmissionEvent, formSubmissionPaymentId, supplierBusinessCode, publishableApiKey, isTestMode, onCompleted, onCancelled, }) {
8
+ const [{ isCompletingTransaction, completeTransactionError }, setCompleteTransactionState,] = React.useState({
9
+ isCompletingTransaction: false,
10
+ completeTransactionError: null,
11
+ });
12
+ const clearCompleteTransactionError = React.useCallback(() => {
13
+ setCompleteTransactionState({
14
+ isCompletingTransaction: false,
15
+ completeTransactionError: null,
16
+ });
17
+ }, []);
18
+ const [{ isLoading, loadError }, setLoadState] = React.useState({
19
+ isLoading: true,
20
+ loadError: null,
21
+ });
22
+ React.useEffect(() => {
23
+ const abortController = new AbortController();
24
+ const scriptEle = document.createElement('script');
25
+ scriptEle.type = 'text/javascript';
26
+ scriptEle.async = true;
27
+ const run = async () => {
28
+ try {
29
+ scriptEle.src = isTestMode
30
+ ? 'https://api.quickstream.support.qvalent.com/rest/v1/quickstream-api-1.0.min.js'
31
+ : 'https://api.quickstream.westpac.com.au/rest/v1/quickstream-api-1.0.min.js';
32
+ await new Promise((resolve, reject) => {
33
+ try {
34
+ scriptEle.addEventListener('load', () => {
35
+ resolve(undefined);
36
+ }, {
37
+ signal: abortController.signal,
38
+ });
39
+ scriptEle.addEventListener('error', () => {
40
+ reject(new Error(`Failed to load the script ${scriptEle.src}`));
41
+ }, {
42
+ signal: abortController.signal,
43
+ });
44
+ document.body.appendChild(scriptEle);
45
+ }
46
+ catch (error) {
47
+ console.warn('Failed to load script', error);
48
+ reject(error);
49
+ }
50
+ });
51
+ window.QuickstreamAPI.init({
52
+ publishableApiKey,
53
+ });
54
+ const trustedFrame = await new Promise((resolve, reject) => {
55
+ window.QuickstreamAPI.creditCards.createTrustedFrame({
56
+ config: {
57
+ supplierBusinessCode,
58
+ threeDS2: true,
59
+ },
60
+ iframe: {
61
+ width: '100%',
62
+ height: '100%',
63
+ style: {
64
+ border: '1px solid #dedede',
65
+ 'border-radius': '2px',
66
+ 'margin-bottom': '0.75rem',
67
+ 'min-height': '400px',
68
+ padding: '1.5rem',
69
+ width: '100%',
70
+ 'background-color': 'white',
71
+ },
72
+ },
73
+ showAcceptedCards: true,
74
+ showRequiredIndicators: true,
75
+ }, (errors, data) => {
76
+ if (errors) {
77
+ reject(errors);
78
+ return;
79
+ }
80
+ resolve(data.trustedFrame);
81
+ });
82
+ });
83
+ const westpacQuickStreamForm = document.getElementById('westpac-quick-stream-form-id');
84
+ westpacQuickStreamForm === null || westpacQuickStreamForm === void 0 ? void 0 : westpacQuickStreamForm.addEventListener('submit', (event) => {
85
+ event.preventDefault();
86
+ setCompleteTransactionState({
87
+ isCompletingTransaction: true,
88
+ completeTransactionError: null,
89
+ });
90
+ trustedFrame.submitForm((errors, data) => {
91
+ if (errors) {
92
+ console.log('Invalid payment form submission', errors);
93
+ setCompleteTransactionState({
94
+ isCompletingTransaction: false,
95
+ completeTransactionError: null,
96
+ });
97
+ return;
98
+ }
99
+ paymentService.westpacQuickStream
100
+ .completeTransaction({
101
+ singleUseTokenId: data.singleUseToken.singleUseTokenId,
102
+ formSubmissionResult,
103
+ formSubmissionPaymentId,
104
+ paymentSubmissionEvent,
105
+ })
106
+ .then(onCompleted)
107
+ .catch((error) => {
108
+ setCompleteTransactionState({
109
+ isCompletingTransaction: false,
110
+ completeTransactionError: error,
111
+ });
112
+ });
113
+ });
114
+ });
115
+ if (!abortController.signal.aborted) {
116
+ setLoadState({
117
+ isLoading: false,
118
+ loadError: null,
119
+ });
120
+ }
121
+ }
122
+ catch (error) {
123
+ if (!abortController.signal.aborted) {
124
+ setLoadState({
125
+ isLoading: false,
126
+ loadError: error,
127
+ });
128
+ }
129
+ }
130
+ };
131
+ run();
132
+ return () => {
133
+ abortController.abort();
134
+ document.body.removeChild(scriptEle);
135
+ };
136
+ }, [
137
+ formSubmissionPaymentId,
138
+ formSubmissionResult,
139
+ isTestMode,
140
+ onCompleted,
141
+ paymentSubmissionEvent,
142
+ publishableApiKey,
143
+ supplierBusinessCode,
144
+ ]);
145
+ const [{ isCancellingTransaction, cancelError }, setCancelState] = React.useState({
146
+ isCancellingTransaction: false,
147
+ cancelError: null,
148
+ });
149
+ const clearCancelError = React.useCallback(() => {
150
+ setCancelState({
151
+ isCancellingTransaction: false,
152
+ cancelError: null,
153
+ });
154
+ }, []);
155
+ const handleCancel = React.useCallback(async () => {
156
+ setCancelState({
157
+ isCancellingTransaction: true,
158
+ cancelError: null,
159
+ });
160
+ try {
161
+ const result = await paymentService.westpacQuickStream.cancelPayment({
162
+ formSubmissionPaymentId,
163
+ formSubmissionResult,
164
+ });
165
+ onCancelled(result);
166
+ }
167
+ catch (error) {
168
+ console.warn('Failed to cancel payment', error);
169
+ setCancelState({
170
+ isCancellingTransaction: false,
171
+ cancelError: error,
172
+ });
173
+ }
174
+ }, [formSubmissionPaymentId, formSubmissionResult, onCancelled]);
175
+ return (React.createElement(React.Fragment, null,
176
+ isLoading && (React.createElement("section", null,
177
+ React.createElement("div", { className: "cypress-loading has-text-centered" },
178
+ React.createElement(OnLoading, { className: "has-text-centered" }),
179
+ React.createElement("span", null, "Building payment form...")))),
180
+ loadError && (React.createElement("section", { className: "cypress-payment-receipt-loading-error-message" },
181
+ React.createElement("div", { className: "ob-payment-receipt__error-icon-container has-text-centered has-margin-bottom-8" },
182
+ React.createElement("i", { className: "ob-payment-receipt__error-icon material-icons has-text-danger icon-x-large" }, "error")),
183
+ React.createElement("p", { className: "ob-payment-receipt__error-message has-text-centered has-margin-bottom-4" }, loadError.message))),
184
+ React.createElement("section", null,
185
+ React.createElement("form", { id: "westpac-quick-stream-form-id" },
186
+ React.createElement("div", { "data-quickstream-api": "creditCardContainer" }),
187
+ !isLoading && !loadError && (React.createElement(React.Fragment, null,
188
+ React.createElement("button", { type: "button", disabled: isCompletingTransaction || isCancellingTransaction, onClick: handleCancel, className: clsx('button ob-button is-outlined', {
189
+ 'is-loading': isCancellingTransaction,
190
+ }) }, "Cancel"),
191
+ React.createElement("button", { type: "submit", disabled: isCompletingTransaction || isCancellingTransaction, className: clsx('button ob-button is-success', {
192
+ 'is-loading': isCompletingTransaction,
193
+ }) }, "Make Payment"))))),
194
+ React.createElement(Modal, { isOpen: true, title: "Payment Issue", className: "cypress-payment-error-close-button", actions: React.createElement(React.Fragment, null,
195
+ React.createElement("button", { type: "button", className: "button ob-button cypress-payment-error-close-button is-light", onClick: clearCompleteTransactionError }, "Okay")) },
196
+ React.createElement(React.Fragment, null,
197
+ React.createElement("div", null, completeTransactionError instanceof Error
198
+ ? completeTransactionError.message
199
+ : completeTransactionError),
200
+ completeTransactionError instanceof OneBlinkAppsError && (React.createElement(OneBlinkAppsErrorOriginalMessage, { error: completeTransactionError.originalError })))),
201
+ React.createElement(Modal, { isOpen: true, title: "Cancel Issue", className: "cypress-cancel-error-close-button", actions: React.createElement(React.Fragment, null,
202
+ React.createElement("button", { type: "button", className: "button ob-button cypress-cancel-error-close-button is-light", onClick: clearCancelError }, "Okay")) },
203
+ React.createElement(React.Fragment, null,
204
+ React.createElement("div", null, cancelError instanceof Error ? cancelError.message : cancelError),
205
+ cancelError instanceof OneBlinkAppsError && (React.createElement(OneBlinkAppsErrorOriginalMessage, { error: cancelError.originalError }))))));
206
+ }
207
+ export default React.memo(WestpacQuickStreamPaymentForm);
208
+ //# sourceMappingURL=WestpacQuickStreamPaymentForm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WestpacQuickStreamPaymentForm.js","sourceRoot":"","sources":["../../../src/components/payments/WestpacQuickStreamPaymentForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n OneBlinkAppsError,\n paymentService,\n submissionService,\n} from '@oneblink/apps'\nimport { SubmissionTypes, SubmissionEventTypes } from '@oneblink/types'\nimport clsx from 'clsx'\nimport React from 'react'\nimport OnLoading from '../renderer/OnLoading'\nimport OneBlinkAppsErrorOriginalMessage from '../renderer/OneBlinkAppsErrorOriginalMessage'\nimport Modal from '../renderer/Modal'\n\ninterface TrustedFrame {\n submitForm(\n callback: (\n errors:\n | Array<{\n fieldName: string\n messages: string[]\n }>\n | undefined,\n data: {\n singleUseToken: {\n singleUseTokenId: string\n }\n },\n ) => void,\n ): void\n}\n\ndeclare global {\n interface Window {\n QuickstreamAPI: {\n init(options: { publishableApiKey: string }): void\n creditCards: {\n createTrustedFrame(\n options: unknown,\n callback: (\n errors:\n | Array<{\n fieldName: string\n messages: string[]\n }>\n | undefined,\n data: {\n trustedFrame: TrustedFrame\n },\n ) => void,\n ): void\n }\n }\n }\n}\n\nfunction WestpacQuickStreamPaymentForm({\n formSubmissionResult,\n paymentSubmissionEvent,\n formSubmissionPaymentId,\n supplierBusinessCode,\n publishableApiKey,\n isTestMode,\n onCompleted,\n onCancelled,\n}: {\n formSubmissionResult: submissionService.FormSubmissionResult\n paymentSubmissionEvent: SubmissionEventTypes.WestpacQuickStreamSubmissionEvent\n formSubmissionPaymentId: string\n supplierBusinessCode: string\n publishableApiKey: string\n isTestMode: boolean\n onCompleted: (result: {\n formSubmissionPayment: SubmissionTypes.FormSubmissionPayment\n paymentReceiptUrl: string\n }) => void\n onCancelled: (result: { paymentReceiptUrl: string }) => void\n}) {\n const [\n { isCompletingTransaction, completeTransactionError },\n setCompleteTransactionState,\n ] = React.useState<{\n isCompletingTransaction: boolean\n completeTransactionError: Error | null\n }>({\n isCompletingTransaction: false,\n completeTransactionError: null,\n })\n\n const clearCompleteTransactionError = React.useCallback(() => {\n setCompleteTransactionState({\n isCompletingTransaction: false,\n completeTransactionError: null,\n })\n }, [])\n\n const [{ isLoading, loadError }, setLoadState] = React.useState<{\n isLoading: boolean\n loadError: Error | null\n }>({\n isLoading: true,\n loadError: null,\n })\n\n React.useEffect(() => {\n const abortController = new AbortController()\n const scriptEle = document.createElement('script')\n scriptEle.type = 'text/javascript'\n scriptEle.async = true\n\n const run = async () => {\n try {\n scriptEle.src = isTestMode\n ? 'https://api.quickstream.support.qvalent.com/rest/v1/quickstream-api-1.0.min.js'\n : 'https://api.quickstream.westpac.com.au/rest/v1/quickstream-api-1.0.min.js'\n\n await new Promise((resolve, reject) => {\n try {\n scriptEle.addEventListener(\n 'load',\n () => {\n resolve(undefined)\n },\n {\n signal: abortController.signal,\n },\n )\n\n scriptEle.addEventListener(\n 'error',\n () => {\n reject(new Error(`Failed to load the script ${scriptEle.src}`))\n },\n {\n signal: abortController.signal,\n },\n )\n\n document.body.appendChild(scriptEle)\n } catch (error) {\n console.warn('Failed to load script', error)\n reject(error)\n }\n })\n\n window.QuickstreamAPI.init({\n publishableApiKey,\n })\n const trustedFrame = await new Promise<TrustedFrame>(\n (resolve, reject) => {\n window.QuickstreamAPI.creditCards.createTrustedFrame(\n {\n config: {\n supplierBusinessCode,\n threeDS2: true,\n },\n iframe: {\n width: '100%',\n height: '100%',\n style: {\n border: '1px solid #dedede',\n 'border-radius': '2px',\n 'margin-bottom': '0.75rem',\n 'min-height': '400px',\n padding: '1.5rem',\n width: '100%',\n 'background-color': 'white',\n },\n },\n showAcceptedCards: true,\n showRequiredIndicators: true,\n },\n (errors, data) => {\n if (errors) {\n reject(errors)\n return\n }\n resolve(data.trustedFrame)\n },\n )\n },\n )\n const westpacQuickStreamForm = document.getElementById(\n 'westpac-quick-stream-form-id',\n )\n westpacQuickStreamForm?.addEventListener('submit', (event) => {\n event.preventDefault()\n\n setCompleteTransactionState({\n isCompletingTransaction: true,\n completeTransactionError: null,\n })\n\n trustedFrame.submitForm((errors, data) => {\n if (errors) {\n console.log('Invalid payment form submission', errors)\n setCompleteTransactionState({\n isCompletingTransaction: false,\n completeTransactionError: null,\n })\n return\n }\n\n paymentService.westpacQuickStream\n .completeTransaction({\n singleUseTokenId: data.singleUseToken.singleUseTokenId,\n formSubmissionResult,\n formSubmissionPaymentId,\n paymentSubmissionEvent,\n })\n .then(onCompleted)\n .catch((error) => {\n setCompleteTransactionState({\n isCompletingTransaction: false,\n completeTransactionError: error,\n })\n })\n })\n })\n\n if (!abortController.signal.aborted) {\n setLoadState({\n isLoading: false,\n loadError: null,\n })\n }\n } catch (error) {\n if (!abortController.signal.aborted) {\n setLoadState({\n isLoading: false,\n loadError: error as Error,\n })\n }\n }\n }\n\n run()\n\n return () => {\n abortController.abort()\n document.body.removeChild(scriptEle)\n }\n }, [\n formSubmissionPaymentId,\n formSubmissionResult,\n isTestMode,\n onCompleted,\n paymentSubmissionEvent,\n publishableApiKey,\n supplierBusinessCode,\n ])\n\n const [{ isCancellingTransaction, cancelError }, setCancelState] =\n React.useState<{\n isCancellingTransaction: boolean\n cancelError: Error | null\n }>({\n isCancellingTransaction: false,\n cancelError: null,\n })\n\n const clearCancelError = React.useCallback(() => {\n setCancelState({\n isCancellingTransaction: false,\n cancelError: null,\n })\n }, [])\n\n const handleCancel = React.useCallback(async () => {\n setCancelState({\n isCancellingTransaction: true,\n cancelError: null,\n })\n try {\n const result = await paymentService.westpacQuickStream.cancelPayment({\n formSubmissionPaymentId,\n formSubmissionResult,\n })\n onCancelled(result)\n } catch (error) {\n console.warn('Failed to cancel payment', error)\n setCancelState({\n isCancellingTransaction: false,\n cancelError: error as Error,\n })\n }\n }, [formSubmissionPaymentId, formSubmissionResult, onCancelled])\n\n return (\n <>\n {isLoading && (\n <section>\n <div className=\"cypress-loading has-text-centered\">\n <OnLoading className=\"has-text-centered\"></OnLoading>\n <span>Building payment form...</span>\n </div>\n </section>\n )}\n\n {loadError && (\n <section className=\"cypress-payment-receipt-loading-error-message\">\n <div className=\"ob-payment-receipt__error-icon-container has-text-centered has-margin-bottom-8\">\n <i className=\"ob-payment-receipt__error-icon material-icons has-text-danger icon-x-large\">\n error\n </i>\n </div>\n <p className=\"ob-payment-receipt__error-message has-text-centered has-margin-bottom-4\">\n {loadError.message}\n </p>\n </section>\n )}\n\n <section>\n <form id=\"westpac-quick-stream-form-id\">\n <div data-quickstream-api=\"creditCardContainer\"></div>\n\n {!isLoading && !loadError && (\n <>\n <button\n type=\"button\"\n disabled={isCompletingTransaction || isCancellingTransaction}\n onClick={handleCancel}\n className={clsx('button ob-button is-outlined', {\n 'is-loading': isCancellingTransaction,\n })}\n >\n Cancel\n </button>\n <button\n type=\"submit\"\n disabled={isCompletingTransaction || isCancellingTransaction}\n className={clsx('button ob-button is-success', {\n 'is-loading': isCompletingTransaction,\n })}\n >\n Make Payment\n </button>\n </>\n )}\n </form>\n </section>\n\n <Modal\n isOpen\n title=\"Payment Issue\"\n className=\"cypress-payment-error-close-button\"\n actions={\n <>\n <button\n type=\"button\"\n className=\"button ob-button cypress-payment-error-close-button is-light\"\n onClick={clearCompleteTransactionError}\n >\n Okay\n </button>\n </>\n }\n >\n <>\n <div>\n {completeTransactionError instanceof Error\n ? completeTransactionError.message\n : completeTransactionError}\n </div>\n {completeTransactionError instanceof OneBlinkAppsError && (\n <OneBlinkAppsErrorOriginalMessage\n error={completeTransactionError.originalError}\n />\n )}\n </>\n </Modal>\n\n <Modal\n isOpen\n title=\"Cancel Issue\"\n className=\"cypress-cancel-error-close-button\"\n actions={\n <>\n <button\n type=\"button\"\n className=\"button ob-button cypress-cancel-error-close-button is-light\"\n onClick={clearCancelError}\n >\n Okay\n </button>\n </>\n }\n >\n <>\n <div>\n {cancelError instanceof Error ? cancelError.message : cancelError}\n </div>\n {cancelError instanceof OneBlinkAppsError && (\n <OneBlinkAppsErrorOriginalMessage\n error={cancelError.originalError}\n />\n )}\n </>\n </Modal>\n </>\n )\n}\n\nexport default React.memo(WestpacQuickStreamPaymentForm)\n"]}
@@ -1,15 +1,28 @@
1
1
  import * as React from 'react';
2
2
  import clsx from 'clsx';
3
+ import { Fade, Modal as MuiModal } from '@mui/material';
3
4
  function Modal({ isOpen, title, children, className, cardClassName, titleClassName, bodyClassName, actions, }) {
4
- return (React.createElement("div", { className: clsx('modal ob-modal', className, {
5
+ const modalContentRef = React.useRef(null);
6
+ return (React.createElement(MuiModal, { className: clsx('modal ob-modal', className, {
5
7
  'is-active': isOpen,
6
- }) },
7
- React.createElement("div", { className: "modal-background-faded" }),
8
- React.createElement("div", { className: clsx('modal-card', cardClassName) },
9
- title && (React.createElement("header", { className: "modal-card-head" },
10
- React.createElement("p", { className: clsx('modal-card-title', titleClassName) }, title))),
11
- React.createElement("section", { className: clsx('modal-card-body', bodyClassName) }, children),
12
- actions && React.createElement("footer", { className: "modal-card-foot" }, actions))));
8
+ }), open: isOpen, slots: {
9
+ backdrop: () => React.createElement("div", { className: "modal-background-faded" }),
10
+ }, onTransitionEnter: () => {
11
+ // set the initial focused element
12
+ const modalContentElement = modalContentRef.current;
13
+ if (modalContentElement) {
14
+ const primaryControls = modalContentElement.querySelectorAll('.ob-button.is-primary');
15
+ if (primaryControls[0] instanceof HTMLElement) {
16
+ primaryControls[0].focus();
17
+ }
18
+ }
19
+ } },
20
+ React.createElement(Fade, { in: isOpen },
21
+ React.createElement("div", { className: clsx('modal-card', cardClassName), ref: modalContentRef },
22
+ title && (React.createElement("header", { className: "modal-card-head" },
23
+ React.createElement("p", { className: clsx('modal-card-title', titleClassName) }, title))),
24
+ React.createElement("section", { className: clsx('modal-card-body', bodyClassName) }, children),
25
+ actions && React.createElement("footer", { className: "modal-card-foot" }, actions)))));
13
26
  }
14
27
  export default React.memo(Modal);
15
28
  //# sourceMappingURL=Modal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/renderer/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AAavB,SAAS,KAAK,CAAC,EACb,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,aAAa,EACb,cAAc,EACd,aAAa,EACb,OAAO,GACD;IACN,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,SAAS,EAAE;YAC3C,WAAW,EAAE,MAAM;SACpB,CAAC;QAEF,6BAAK,SAAS,EAAC,wBAAwB,GAAO;QAC9C,6BAAK,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC;YAC9C,KAAK,IAAI,CACR,gCAAQ,SAAS,EAAC,iBAAiB;gBACjC,2BAAG,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAG,KAAK,CAAK,CAC5D,CACV;YACD,iCAAS,SAAS,EAAE,IAAI,CAAC,iBAAiB,EAAE,aAAa,CAAC,IACvD,QAAQ,CACD;YACT,OAAO,IAAI,gCAAQ,SAAS,EAAC,iBAAiB,IAAE,OAAO,CAAU,CAC9D,CACF,CACP,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\n\ntype Props = {\n isOpen: boolean\n title?: string\n children: React.ReactNode\n actions: React.ReactNode | null\n className?: string\n cardClassName?: string\n titleClassName?: string\n bodyClassName?: string\n}\n\nfunction Modal({\n isOpen,\n title,\n children,\n className,\n cardClassName,\n titleClassName,\n bodyClassName,\n actions,\n}: Props) {\n return (\n <div\n className={clsx('modal ob-modal', className, {\n 'is-active': isOpen,\n })}\n >\n <div className=\"modal-background-faded\"></div>\n <div className={clsx('modal-card', cardClassName)}>\n {title && (\n <header className=\"modal-card-head\">\n <p className={clsx('modal-card-title', titleClassName)}>{title}</p>\n </header>\n )}\n <section className={clsx('modal-card-body', bodyClassName)}>\n {children}\n </section>\n {actions && <footer className=\"modal-card-foot\">{actions}</footer>}\n </div>\n </div>\n )\n}\n\nexport default React.memo(Modal)\n"]}
1
+ {"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/renderer/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,IAAI,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAA;AAavD,SAAS,KAAK,CAAC,EACb,MAAM,EACN,KAAK,EACL,QAAQ,EACR,SAAS,EACT,aAAa,EACb,cAAc,EACd,aAAa,EACb,OAAO,GACD;IACN,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE1D,OAAO,CACL,oBAAC,QAAQ,IACP,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,SAAS,EAAE;YAC3C,WAAW,EAAE,MAAM;SACpB,CAAC,EACF,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE;YACL,QAAQ,EAAE,GAAG,EAAE,CAAC,6BAAK,SAAS,EAAC,wBAAwB,GAAO;SAC/D,EACD,iBAAiB,EAAE,GAAG,EAAE;YACtB,kCAAkC;YAClC,MAAM,mBAAmB,GAAG,eAAe,CAAC,OAAO,CAAA;YACnD,IAAI,mBAAmB,EAAE;gBACvB,MAAM,eAAe,GAAG,mBAAmB,CAAC,gBAAgB,CAC1D,uBAAuB,CACxB,CAAA;gBACD,IAAI,eAAe,CAAC,CAAC,CAAC,YAAY,WAAW,EAAE;oBAC7C,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAA;iBAC3B;aACF;QACH,CAAC;QAED,oBAAC,IAAI,IAAC,EAAE,EAAE,MAAM;YACd,6BACE,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC,EAC5C,GAAG,EAAE,eAAe;gBAEnB,KAAK,IAAI,CACR,gCAAQ,SAAS,EAAC,iBAAiB;oBACjC,2BAAG,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,cAAc,CAAC,IACnD,KAAK,CACJ,CACG,CACV;gBACD,iCAAS,SAAS,EAAE,IAAI,CAAC,iBAAiB,EAAE,aAAa,CAAC,IACvD,QAAQ,CACD;gBACT,OAAO,IAAI,gCAAQ,SAAS,EAAC,iBAAiB,IAAE,OAAO,CAAU,CAC9D,CACD,CACE,CACZ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Fade, Modal as MuiModal } from '@mui/material'\n\ntype Props = {\n isOpen: boolean\n title?: string\n children: React.ReactNode\n actions: React.ReactNode | null\n className?: string\n cardClassName?: string\n titleClassName?: string\n bodyClassName?: string\n}\n\nfunction Modal({\n isOpen,\n title,\n children,\n className,\n cardClassName,\n titleClassName,\n bodyClassName,\n actions,\n}: Props) {\n const modalContentRef = React.useRef<HTMLDivElement>(null)\n\n return (\n <MuiModal\n className={clsx('modal ob-modal', className, {\n 'is-active': isOpen,\n })}\n open={isOpen}\n slots={{\n backdrop: () => <div className=\"modal-background-faded\"></div>,\n }}\n onTransitionEnter={() => {\n // set the initial focused element\n const modalContentElement = modalContentRef.current\n if (modalContentElement) {\n const primaryControls = modalContentElement.querySelectorAll(\n '.ob-button.is-primary',\n )\n if (primaryControls[0] instanceof HTMLElement) {\n primaryControls[0].focus()\n }\n }\n }}\n >\n <Fade in={isOpen}>\n <div\n className={clsx('modal-card', cardClassName)}\n ref={modalContentRef}\n >\n {title && (\n <header className=\"modal-card-head\">\n <p className={clsx('modal-card-title', titleClassName)}>\n {title}\n </p>\n </header>\n )}\n <section className={clsx('modal-card-body', bodyClassName)}>\n {children}\n </section>\n {actions && <footer className=\"modal-card-foot\">{actions}</footer>}\n </div>\n </Fade>\n </MuiModal>\n )\n}\n\nexport default React.memo(Modal)\n"]}
package/dist/index.d.ts CHANGED
@@ -23,4 +23,5 @@ export { default as useFormSubmissionState } from './hooks/useFormSubmissionStat
23
23
  export { default as useFormSubmissionAutoSaveState } from './hooks/useFormSubmissionAutoSaveState';
24
24
  export { default as ProgressBar } from './components/renderer/ProgressBar';
25
25
  export { default as PaymentReceipt } from './PaymentReceipt';
26
+ export { default as PaymentForm } from './components/payments/PaymentForm';
26
27
  export * from './types/form';
package/dist/index.js CHANGED
@@ -23,5 +23,6 @@ export { default as useFormSubmissionState } from './hooks/useFormSubmissionStat
23
23
  export { default as useFormSubmissionAutoSaveState } from './hooks/useFormSubmissionAutoSaveState';
24
24
  export { default as ProgressBar } from './components/renderer/ProgressBar';
25
25
  export { default as PaymentReceipt } from './PaymentReceipt';
26
+ export { default as PaymentForm } from './components/payments/PaymentForm';
26
27
  export * from './types/form';
27
28
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,wBAAwB,IAAI,YAAY,EACxC,sBAAsB,GACvB,MAAM,gBAAgB,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAA;AAC5F,OAAO,EAAE,OAAO,IAAI,mCAAmC,EAAE,MAAM,4DAA4D,CAAA;AAC3H,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,uDAAuD,CAAA;AACjH,OAAO,EAAE,OAAO,IAAI,+BAA+B,EAAE,MAAM,wDAAwD,CAAA;AACnH,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,uDAAuD,CAAA;AACjH,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,+CAA+C,CAAA;AAEjG,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACpE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,gCAAgC,CAAA;AAClF,OAAO,EACL,OAAO,IAAI,YAAY,EACvB,wBAAwB,GACzB,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAiB,MAAM,kBAAkB,CAAA;AACrE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,EACL,OAAO,IAAI,OAAO,EAClB,mBAAmB,GAEpB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EACL,OAAO,IAAI,qBAAqB,EAChC,iCAAiC,GAElC,MAAM,+BAA+B,CAAA;AACtC,OAAO,EACL,OAAO,IAAI,SAAS,EACpB,qBAAqB,GAEtB,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EACL,OAAO,IAAI,gBAAgB,GAE5B,MAAM,0BAA0B,CAAA;AACjC,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,+BAA+B,CAAA;AAChF,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,gCAAgC,CAAA;AAClF,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,wCAAwC,CAAA;AAElG,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAE5D,cAAc,cAAc,CAAA","sourcesContent":["export {\n OneBlinkFormBaseProps,\n OneBlinkFormControlledProps,\n OneBlinkFormUncontrolled as OneBlinkForm,\n OneBlinkFormControlled,\n} from './OneBlinkForm'\nexport { default as OneBlinkAutoSaveForm } from './OneBlinkAutoSaveForm'\nexport { default as OneBlinkReadOnlyForm } from './OneBlinkReadOnlyForm'\nexport { OneBlinkFormStoreProvider } from './components/formStore/OneBlinkFormStoreProvider'\nexport { default as OneBlinkFormStoreClearFiltersButton } from './components/formStore/OneBlinkFormStoreClearFiltersButton'\nexport { default as OneBlinkFormStoreColumnsButton } from './components/formStore/OneBlinkFormStoreColumnsButton'\nexport { default as OneBlinkFormStoreDownloadButton } from './components/formStore/OneBlinkFormStoreDownloadButton'\nexport { default as OneBlinkFormStoreRefreshButton } from './components/formStore/OneBlinkFormStoreRefreshButton'\nexport { default as OneBlinkFormStoreTable } from './components/formStore/OneBlinkFormStoreTable'\n\nexport { default as useIsMounted } from './hooks/useIsMounted'\nexport { default as useBooleanState } from './hooks/useBooleanState'\nexport { default as useNullableState } from './hooks/useNullableState'\nexport { default as useClickOutsideElement } from './hooks/useClickOutsideElement'\nexport {\n default as useIsOffline,\n IsOfflineContextProvider,\n} from './hooks/useIsOffline'\nexport { default as useLogin, UseLoginValue } from './hooks/useLogin'\nexport { default as useSignUp } from './hooks/useSignUp'\nexport {\n default as useAuth,\n AuthContextProvider,\n AuthContextValue,\n} from './hooks/useAuth'\nexport {\n default as usePendingSubmissions,\n PendingSubmissionsContextProvider,\n PendingSubmissionsContextValue,\n} from './hooks/usePendingSubmissions'\nexport {\n default as useDrafts,\n DraftsContextProvider,\n DraftsContextValue,\n} from './hooks/useDrafts'\nexport {\n default as useLoadDataState,\n LoadDataState,\n} from './hooks/useLoadDataState'\nexport { default as useLoadResourcesState } from './hooks/useLoadResourcesState'\nexport { default as useFormSubmissionState } from './hooks/useFormSubmissionState'\nexport { default as useFormSubmissionAutoSaveState } from './hooks/useFormSubmissionAutoSaveState'\n\nexport { default as ProgressBar } from './components/renderer/ProgressBar'\nexport { default as PaymentReceipt } from './PaymentReceipt'\n\nexport * from './types/form'\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,wBAAwB,IAAI,YAAY,EACxC,sBAAsB,GACvB,MAAM,gBAAgB,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAA;AAC5F,OAAO,EAAE,OAAO,IAAI,mCAAmC,EAAE,MAAM,4DAA4D,CAAA;AAC3H,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,uDAAuD,CAAA;AACjH,OAAO,EAAE,OAAO,IAAI,+BAA+B,EAAE,MAAM,wDAAwD,CAAA;AACnH,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,uDAAuD,CAAA;AACjH,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,+CAA+C,CAAA;AAEjG,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAC9D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACpE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,gCAAgC,CAAA;AAClF,OAAO,EACL,OAAO,IAAI,YAAY,EACvB,wBAAwB,GACzB,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAiB,MAAM,kBAAkB,CAAA;AACrE,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,EACL,OAAO,IAAI,OAAO,EAClB,mBAAmB,GAEpB,MAAM,iBAAiB,CAAA;AACxB,OAAO,EACL,OAAO,IAAI,qBAAqB,EAChC,iCAAiC,GAElC,MAAM,+BAA+B,CAAA;AACtC,OAAO,EACL,OAAO,IAAI,SAAS,EACpB,qBAAqB,GAEtB,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EACL,OAAO,IAAI,gBAAgB,GAE5B,MAAM,0BAA0B,CAAA;AACjC,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,+BAA+B,CAAA;AAChF,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,gCAAgC,CAAA;AAClF,OAAO,EAAE,OAAO,IAAI,8BAA8B,EAAE,MAAM,wCAAwC,CAAA;AAElG,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mCAAmC,CAAA;AAE1E,cAAc,cAAc,CAAA","sourcesContent":["export {\n OneBlinkFormBaseProps,\n OneBlinkFormControlledProps,\n OneBlinkFormUncontrolled as OneBlinkForm,\n OneBlinkFormControlled,\n} from './OneBlinkForm'\nexport { default as OneBlinkAutoSaveForm } from './OneBlinkAutoSaveForm'\nexport { default as OneBlinkReadOnlyForm } from './OneBlinkReadOnlyForm'\nexport { OneBlinkFormStoreProvider } from './components/formStore/OneBlinkFormStoreProvider'\nexport { default as OneBlinkFormStoreClearFiltersButton } from './components/formStore/OneBlinkFormStoreClearFiltersButton'\nexport { default as OneBlinkFormStoreColumnsButton } from './components/formStore/OneBlinkFormStoreColumnsButton'\nexport { default as OneBlinkFormStoreDownloadButton } from './components/formStore/OneBlinkFormStoreDownloadButton'\nexport { default as OneBlinkFormStoreRefreshButton } from './components/formStore/OneBlinkFormStoreRefreshButton'\nexport { default as OneBlinkFormStoreTable } from './components/formStore/OneBlinkFormStoreTable'\n\nexport { default as useIsMounted } from './hooks/useIsMounted'\nexport { default as useBooleanState } from './hooks/useBooleanState'\nexport { default as useNullableState } from './hooks/useNullableState'\nexport { default as useClickOutsideElement } from './hooks/useClickOutsideElement'\nexport {\n default as useIsOffline,\n IsOfflineContextProvider,\n} from './hooks/useIsOffline'\nexport { default as useLogin, UseLoginValue } from './hooks/useLogin'\nexport { default as useSignUp } from './hooks/useSignUp'\nexport {\n default as useAuth,\n AuthContextProvider,\n AuthContextValue,\n} from './hooks/useAuth'\nexport {\n default as usePendingSubmissions,\n PendingSubmissionsContextProvider,\n PendingSubmissionsContextValue,\n} from './hooks/usePendingSubmissions'\nexport {\n default as useDrafts,\n DraftsContextProvider,\n DraftsContextValue,\n} from './hooks/useDrafts'\nexport {\n default as useLoadDataState,\n LoadDataState,\n} from './hooks/useLoadDataState'\nexport { default as useLoadResourcesState } from './hooks/useLoadResourcesState'\nexport { default as useFormSubmissionState } from './hooks/useFormSubmissionState'\nexport { default as useFormSubmissionAutoSaveState } from './hooks/useFormSubmissionAutoSaveState'\n\nexport { default as ProgressBar } from './components/renderer/ProgressBar'\nexport { default as PaymentReceipt } from './PaymentReceipt'\nexport { default as PaymentForm } from './components/payments/PaymentForm'\n\nexport * from './types/form'\n"]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@oneblink/apps-react",
3
3
  "description": "Helper functions for OneBlink apps in ReactJS.",
4
- "version": "5.6.1-beta.1",
4
+ "version": "5.7.0-beta.1",
5
5
  "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
6
6
  "bugs": {
7
7
  "url": "https://github.com/oneblink/apps-react/issues"
@@ -10,7 +10,7 @@
10
10
  "@emotion/react": "^11.11.1",
11
11
  "@emotion/styled": "^11.11.0",
12
12
  "@mui/icons-material": "^5.14.16",
13
- "@oneblink/sdk-core": "^5.2.0-beta.2",
13
+ "@oneblink/sdk-core": "^5.3.0-beta.1",
14
14
  "@react-google-maps/api": "2.19.2",
15
15
  "blueimp-load-image": "^5.16.0",
16
16
  "bulma": "^0.9.3",
@@ -46,7 +46,7 @@
46
46
  "@mui/lab": "^5.0.0-alpha.152",
47
47
  "@mui/material": "^5.14.17",
48
48
  "@mui/x-date-pickers": "^6.18.0",
49
- "@oneblink/apps": "^8.1.0-beta.1",
49
+ "@oneblink/apps": "^9.0.0-beta.3",
50
50
  "@oneblink/release-cli": "^3.0.0",
51
51
  "@oneblink/types": "github:oneblink/types",
52
52
  "@types/blueimp-load-image": "^5.16.4",