@bunnyapp/components 1.0.16 → 1.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +245 -297
- package/dist/cjs/src/components/BillingDetails/BillingDetails.d.ts +2 -7
- package/dist/cjs/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +2 -3
- package/dist/cjs/src/components/PaymentForm/PaymentForm.d.ts +2 -3
- package/dist/cjs/src/components/PaymentForm/Stripe/hooks/usePay.d.ts +2 -3
- package/dist/cjs/src/components/Quote/Quote.stories.d.ts +15 -16
- package/dist/cjs/src/components/Signup/PaymentForms.d.ts +3 -4
- package/dist/cjs/src/components/Signup/Signup.d.ts +3 -1
- package/dist/cjs/src/contexts/PaymentContext.d.ts +1 -2
- package/dist/cjs/src/hooks/usePaymentMethod.d.ts +1 -1
- package/dist/esm/index.js +245 -297
- package/dist/esm/src/components/BillingDetails/BillingDetails.d.ts +2 -7
- package/dist/esm/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +2 -3
- package/dist/esm/src/components/PaymentForm/PaymentForm.d.ts +2 -3
- package/dist/esm/src/components/PaymentForm/Stripe/hooks/usePay.d.ts +2 -3
- package/dist/esm/src/components/Quote/Quote.stories.d.ts +15 -16
- package/dist/esm/src/components/Signup/PaymentForms.d.ts +3 -4
- package/dist/esm/src/components/Signup/Signup.d.ts +3 -1
- package/dist/esm/src/contexts/PaymentContext.d.ts +1 -2
- package/dist/esm/src/hooks/usePaymentMethod.d.ts +1 -1
- package/dist/index.d.ts +6 -9
- package/package.json +1 -1
- package/dist/cjs/src/hooks/useToken.d.ts +0 -2
- package/dist/esm/src/hooks/useToken.d.ts +0 -2
package/dist/cjs/index.js
CHANGED
|
@@ -11,7 +11,7 @@ var common = require('@bunnyapp/common');
|
|
|
11
11
|
var reactQuery = require('@tanstack/react-query');
|
|
12
12
|
var theme = require('antd/lib/theme');
|
|
13
13
|
var recoil = require('recoil');
|
|
14
|
-
var request =
|
|
14
|
+
var request = require('graphql-request');
|
|
15
15
|
var reactHelmetAsync = require('react-helmet-async');
|
|
16
16
|
var reactStripeJs = require('@stripe/react-stripe-js');
|
|
17
17
|
var pure = require('@stripe/stripe-js/pure');
|
|
@@ -71,7 +71,7 @@ function styleInject(css, ref) {
|
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
-
var css_248z = ".ant-divider-horizontal {\n margin: 0;\n}\n.ant-tag {\n border: none;\n border-radius: 14px;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n font-weight: 500;\n white-space: nowrap;\n margin: 0;\n}\n.ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n}\n.plan-step-line {\n height: 1px;\n min-width: 128px;\n background: #717d94;\n}\n.plan-step-number {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid #717d94;\n background: white;\n width: 24px;\n height: 24px;\n color: #717d94;\n}\n.plan-step-number.active {\n border: none;\n color: white;\n background: #ff6e1c;\n}\n.hidden {\n display: none;\n}\n.cardElement {\n padding: 8px 11px;\n border: 1px solid #e5e7eb;\n background-color: white;\n font-family: Inter !important;\n}\n.tooltip {\n visibility: hidden;\n position: absolute !important;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\n}\n.show-on-hover {\n opacity: 0;\n}\n.show-on-hover-container:hover .show-on-hover {\n opacity: 1;\n}\n.pdf-only {\n display: none !important;\n}\n.notes p {\n margin: 0;\n padding: 0;\n padding-bottom: 0.25rem;\n}\n#form-element #finix-form-container .field-holder label {\n color: #717d94 !important;\n font-size: 12px !important;\n}\n#form-element #finix-form-container > *:first-child,\n#form-element #finix-form-container > *:last-child {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container > *:not(:first-child):not(:last-child) {\n margin-top: 12px !important;\n}\n#form-element #finix-form-container .field-array > * {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container .field-holder .field,\n#form-element #finix-form-container iframe {\n height: 34px !important;\n}\n#form-element #finix-form-container .field {\n margin-top: 0 !important;\n padding-top: 2px !important;\n}\n#form-element #finix-form-container .field-holder .validation {\n font-size: 11px !important;\n color: #ff4d4f !important;\n}\n.icon-path {\n transition: fill 0.3s;\n}\n.shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.shadow-padding-xb {\n padding-right: 1rem;\n padding-left: 1rem;\n padding-bottom: 0.5rem;\n}\n.content-container {\n width: 100%;\n margin: 0 auto;\n}\n@media (min-width: 1220px) {\n .content-container {\n width: 1220px !important;\n margin: 0 auto;\n }\n}\n@media (min-width: 768px) {\n .shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .shadow-padding-xb {\n padding-right: 2rem;\n padding-left: 2rem;\n padding-bottom: 0.5rem;\n }\n .sm\\:flex {\n display: flex !important;\n }\n .sm\\:hidden {\n display: none !important;\n }\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.border {\n border-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.font-light {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-medium {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-bold {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n line-height: 1.15;\n}\nbody {\n color: #232323;\n background-color: #f8fafc;\n}\nth {\n font-weight: normal;\n}\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\", monospace;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type=\"text\"],\n input[type=\"password\"],\n input[type=\"datetime\"],\n input[type=\"datetime-local\"],\n input[type=\"date\"],\n input[type=\"month\"],\n input[type=\"time\"],\n input[type=\"week\"],\n input[type=\"number\"],\n input[type=\"email\"],\n input[type=\"url\"],\n input[type=\"search\"],\n input[type=\"tel\"],\n input[type=\"color\"] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
|
|
74
|
+
var css_248z = ".ant-collapse-header {\n cursor: default !important;\n padding: 0 !important;\n}\n.ant-tag {\n border: none;\n border-radius: 14px;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n font-weight: 500;\n white-space: nowrap;\n margin: 0;\n}\n.ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-input-affix-wrapper .ant-input-prefix {\n transition: color 0.3s;\n}\n.ant-form-item-label {\n text-transform: none !important;\n font-size: 0.75rem;\n padding-bottom: 2px !important;\n}\n.ant-form-item-label > label {\n width: 100%;\n color: #4b5563 !important;\n}\n.ant-form-item-explain-error {\n font-size: 11px;\n min-height: 11px;\n line-height: 11px;\n padding-top: 2px;\n}\n.ant-form-item {\n margin-bottom: 0;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n.ant-drawer-title {\n font-weight: 400 !important;\n}\n.ant-drawer-header-title {\n flex-direction: row-reverse !important;\n align-items: start !important ;\n}\n.ant-drawer-close {\n margin-inline-end: 0 !important;\n}\n@media (min-width: 768px) {\n .ant-input,\n .ant-picker,\n .ant-select,\n .ant-input-affix-wrapper {\n font-size: 1rem !important;\n }\n .ant-drawer-header {\n padding-right: 1.5rem !important;\n padding-left: 1.5rem !important;\n }\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n}\n.plan-step-line {\n height: 1px;\n min-width: 128px;\n background: #717d94;\n}\n.plan-step-number {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid #717d94;\n background: white;\n width: 24px;\n height: 24px;\n color: #717d94;\n}\n.plan-step-number.active {\n border: none;\n color: white;\n background: #ff6e1c;\n}\n.hidden {\n display: none;\n}\n.cardElement {\n padding: 8px 11px;\n border: 1px solid #e5e7eb;\n background-color: white;\n font-family: Inter !important;\n}\n.tooltip {\n visibility: hidden;\n position: absolute !important;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\n}\n.show-on-hover {\n opacity: 0;\n}\n.show-on-hover-container:hover .show-on-hover {\n opacity: 1;\n}\n.pdf-only {\n display: none !important;\n}\n.notes p {\n margin: 0;\n padding: 0;\n padding-bottom: 0.25rem;\n}\n#form-element #finix-form-container .field-holder label {\n color: #717d94 !important;\n font-size: 12px !important;\n}\n#form-element #finix-form-container > *:first-child,\n#form-element #finix-form-container > *:last-child {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container > *:not(:first-child):not(:last-child) {\n margin-top: 12px !important;\n}\n#form-element #finix-form-container .field-array > * {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container .field-holder .field,\n#form-element #finix-form-container iframe {\n height: 34px !important;\n}\n#form-element #finix-form-container .field {\n margin-top: 0 !important;\n padding-top: 2px !important;\n}\n#form-element #finix-form-container .field-holder .validation {\n font-size: 11px !important;\n color: #ff4d4f !important;\n}\n.icon-path {\n transition: fill 0.3s;\n}\n.shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.shadow-padding-xb {\n padding-right: 1rem;\n padding-left: 1rem;\n padding-bottom: 0.5rem;\n}\n.content-container {\n width: 100%;\n margin: 0 auto;\n}\n@media (min-width: 1220px) {\n .content-container {\n width: 1220px !important;\n margin: 0 auto;\n }\n}\n@media (min-width: 768px) {\n .shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .shadow-padding-xb {\n padding-right: 2rem;\n padding-left: 2rem;\n padding-bottom: 0.5rem;\n }\n .sm\\:flex {\n display: flex !important;\n }\n .sm\\:hidden {\n display: none !important;\n }\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.border {\n border-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.font-light {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-medium {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-bold {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n line-height: 1.15;\n}\nbody {\n color: #232323;\n background-color: #f8fafc;\n}\nth {\n font-weight: normal;\n}\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\", monospace;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type=\"text\"],\n input[type=\"password\"],\n input[type=\"datetime\"],\n input[type=\"datetime-local\"],\n input[type=\"date\"],\n input[type=\"month\"],\n input[type=\"time\"],\n input[type=\"week\"],\n input[type=\"number\"],\n input[type=\"email\"],\n input[type=\"url\"],\n input[type=\"search\"],\n input[type=\"tel\"],\n input[type=\"color\"] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
|
|
75
75
|
styleInject(css_248z);
|
|
76
76
|
|
|
77
77
|
/******************************************************************************
|
|
@@ -1710,19 +1710,6 @@ function ContextualWrapper(_a) {
|
|
|
1710
1710
|
colorSplit: darkMode ? common.SLATE_400 : common.SLATE_200,
|
|
1711
1711
|
verticalMarginInline: 0,
|
|
1712
1712
|
},
|
|
1713
|
-
Form: {
|
|
1714
|
-
itemMarginBottom: 0,
|
|
1715
|
-
verticalLabelPadding: "4px",
|
|
1716
|
-
},
|
|
1717
|
-
Input: {
|
|
1718
|
-
fontSize: 16,
|
|
1719
|
-
},
|
|
1720
|
-
Select: {
|
|
1721
|
-
fontSize: 16,
|
|
1722
|
-
},
|
|
1723
|
-
DatePicker: {
|
|
1724
|
-
fontSize: 16,
|
|
1725
|
-
},
|
|
1726
1713
|
} }, configProviderProps) }, { children: children })) })) }));
|
|
1727
1714
|
}
|
|
1728
1715
|
|
|
@@ -1790,31 +1777,20 @@ var useDownloadFile = function (id, onError) {
|
|
|
1790
1777
|
|
|
1791
1778
|
var InvoiceQuoteContext = React.createContext({});
|
|
1792
1779
|
|
|
1793
|
-
var PaymentContext = React.createContext({});
|
|
1794
|
-
|
|
1795
|
-
// Use this hook instead of getting the token from BunnyContext directly
|
|
1796
|
-
// Because we have overrideToken as an option, this token ensures the correct token is used
|
|
1797
|
-
function useToken() {
|
|
1798
|
-
var tokenFromContext = React.useContext(BunnyContext).token;
|
|
1799
|
-
var overrideToken = React.useContext(PaymentContext).overrideToken;
|
|
1800
|
-
return overrideToken || tokenFromContext;
|
|
1801
|
-
}
|
|
1802
|
-
|
|
1803
1780
|
var MarkupContainer = styled__default["default"].div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
1804
1781
|
var InvoiceQuoteView = function (_a) {
|
|
1805
1782
|
var children = _a.children, formattedInvoice = _a.formattedInvoice, html = _a.html, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onDownloadError = _a.onDownloadError;
|
|
1806
1783
|
var downloadFile = useDownloadFile(formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.id, onDownloadError);
|
|
1807
1784
|
var secondaryColor = React.useContext(BrandContext).secondaryColor;
|
|
1808
|
-
var
|
|
1809
|
-
var
|
|
1810
|
-
var _b = React.useContext(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
|
|
1785
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
1786
|
+
var _c = React.useContext(InvoiceQuoteContext), shadow = _c.shadow, hideDownloadButton = _c.hideDownloadButton;
|
|
1811
1787
|
var isMobile = common.useIsMobile();
|
|
1812
1788
|
var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
|
|
1813
1789
|
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxRuntime.jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "shadow-padding-x" : ""), id: "acceptance" }, { children: [jsxRuntime.jsx("div", { children: onBackButtonClick ? (jsxRuntime.jsx(antd.Button, __assign({ className: "text-xs pl-0", onClick: onBackButtonClick, style: {
|
|
1814
1790
|
color: secondaryColor,
|
|
1815
1791
|
}, type: "link" }, { children: backButtonName || "Back" }))) : null }), !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(DownloadOutlined$1, {}), onClick: function () {
|
|
1816
1792
|
return downloadFile(apiHost + "/api/pdf/invoice/" + formattedInvoice.id, token);
|
|
1817
|
-
} }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 grow w-full shadow-padding-xb overflow-auto" }, { children: [jsxRuntime.jsx(interweave.Markup, { content: html }), children] }))) : (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 p-
|
|
1793
|
+
} }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 grow w-full shadow-padding-xb overflow-auto" }, { children: [jsxRuntime.jsx(interweave.Markup, { content: html }), children] }))) : (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 p-4 w-full bg-white ".concat(shadow ? shadow : "shadow-md", " rounded-md"), style: {
|
|
1818
1794
|
minWidth: "750px",
|
|
1819
1795
|
} }, { children: [jsxRuntime.jsx(interweave.Markup, { content: html }), children] })))] })));
|
|
1820
1796
|
};
|
|
@@ -1870,15 +1846,17 @@ function InvoicePDF(_a) {
|
|
|
1870
1846
|
}, title: "Invoice PDF", width: "100%" }));
|
|
1871
1847
|
}
|
|
1872
1848
|
|
|
1849
|
+
var PaymentContext = React.createContext({});
|
|
1850
|
+
|
|
1873
1851
|
var paymentMethodsQuery = "query paymentMethods ($filter: String, $first: Int, $sort: String) {\n paymentMethods (filter: $filter, first: $first, sort: $sort) {\n nodes {\n id\n disabled\n pluginId\n accountId\n expirationDate\n plugin {\n guid\n id\n }\n state\n metadata {\n issuer\n identifier\n kind\n description\n icon\n }\n }\n }\n}";
|
|
1874
|
-
var usePaymentMethod = function (graphQLClient) {
|
|
1852
|
+
var usePaymentMethod = function (graphQLClient, accountId) {
|
|
1875
1853
|
var result = reactQuery.useQuery({
|
|
1876
1854
|
queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey,
|
|
1877
1855
|
queryFn: function () {
|
|
1878
1856
|
return graphQLClient
|
|
1879
1857
|
.request(paymentMethodsQuery, {
|
|
1880
1858
|
first: 1,
|
|
1881
|
-
filter: "disabled is false",
|
|
1859
|
+
filter: "disabled is false".concat(accountId ? " and accountId is ".concat(accountId) : ""),
|
|
1882
1860
|
})
|
|
1883
1861
|
.then(function (data) {
|
|
1884
1862
|
var _a, _b;
|
|
@@ -1939,34 +1917,6 @@ var getQuoteAmountDue = function (quote) {
|
|
|
1939
1917
|
return quote.amountDue;
|
|
1940
1918
|
};
|
|
1941
1919
|
|
|
1942
|
-
var DEFAULT_HEADERS = {
|
|
1943
|
-
"Content-type": "application/json; charset=utf-8",
|
|
1944
|
-
};
|
|
1945
|
-
// !!! Duplicated from @bunnyapp/common due to bug in signup. Uses BunnyProvider token instead of apiToken.
|
|
1946
|
-
var gqlRequest = function (_a) {
|
|
1947
|
-
var query = _a.query, _b = _a.vars, vars = _b === void 0 ? {} : _b, headers = _a.headers, token = _a.token, isInPreviewMode = _a.isInPreviewMode, apiHost = _a.apiHost;
|
|
1948
|
-
return __awaiter(void 0, void 0, void 0, function () {
|
|
1949
|
-
var graphqlEndpoint, requestHeaders, authorizationHeader, error_1;
|
|
1950
|
-
return __generator(this, function (_c) {
|
|
1951
|
-
switch (_c.label) {
|
|
1952
|
-
case 0:
|
|
1953
|
-
_c.trys.push([0, 2, , 3]);
|
|
1954
|
-
graphqlEndpoint = common.DEFAULT_CONFIG.graphqlEndpoint;
|
|
1955
|
-
requestHeaders = headers || DEFAULT_HEADERS;
|
|
1956
|
-
authorizationHeader = "Bearer ".concat(token);
|
|
1957
|
-
if (!requestHeaders.Authorization && !isInPreviewMode)
|
|
1958
|
-
requestHeaders.Authorization = authorizationHeader;
|
|
1959
|
-
return [4 /*yield*/, request__default["default"]("".concat(apiHost).concat(graphqlEndpoint), query, vars, requestHeaders)];
|
|
1960
|
-
case 1: return [2 /*return*/, _c.sent()];
|
|
1961
|
-
case 2:
|
|
1962
|
-
error_1 = _c.sent();
|
|
1963
|
-
throw error_1;
|
|
1964
|
-
case 3: return [2 /*return*/];
|
|
1965
|
-
}
|
|
1966
|
-
});
|
|
1967
|
-
});
|
|
1968
|
-
};
|
|
1969
|
-
|
|
1970
1920
|
var MUTATION$8 = "\n mutation checkout(\n $invoiceId: ID,\n $quoteId: ID,\n $paymentMethodId: ID,\n $paymentMethodData: CheckoutPaymentMethodAttributes\n ) {\n checkout(\n invoiceId: $invoiceId,\n quoteId: $quoteId,\n paymentMethodId: $paymentMethodId,\n paymentMethodData: $paymentMethodData\n ) {\n invoice {\n id\n state\n amount\n amountDue\n }\n payment {\n id\n state\n amount\n }\n paymentApplication {\n id\n invoiceId\n paymentId\n }\n transaction {\n id\n amount\n }\n }\n }\n";
|
|
1971
1921
|
var checkout = function (_a) {
|
|
1972
1922
|
var quoteId = _a.quoteId, invoiceId = _a.invoiceId, paymentMethodId = _a.paymentMethodId, paymentMethodData = _a.paymentMethodData, token = _a.token, apiHost = _a.apiHost;
|
|
@@ -1983,7 +1933,7 @@ var checkout = function (_a) {
|
|
|
1983
1933
|
if (paymentMethodData) {
|
|
1984
1934
|
mutationVars.paymentMethodData = __assign(__assign({}, paymentMethodData), { metadata: paymentMethodData.metadata });
|
|
1985
1935
|
}
|
|
1986
|
-
return [4 /*yield*/, gqlRequest({
|
|
1936
|
+
return [4 /*yield*/, common.gqlRequest({
|
|
1987
1937
|
query: MUTATION$8,
|
|
1988
1938
|
token: token,
|
|
1989
1939
|
vars: mutationVars,
|
|
@@ -2004,12 +1954,10 @@ var checkout = function (_a) {
|
|
|
2004
1954
|
|
|
2005
1955
|
function usePay$1(_a) {
|
|
2006
1956
|
var _this = this;
|
|
2007
|
-
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod
|
|
2008
|
-
var
|
|
2009
|
-
var customCheckoutFunction = React.useContext(PaymentContext).customCheckoutFunction;
|
|
2010
|
-
var token = useToken();
|
|
1957
|
+
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod;
|
|
1958
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
2011
1959
|
var pay = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
2012
|
-
var amountDue, currencyId, response,
|
|
1960
|
+
var amountDue, currencyId, response, error_1;
|
|
2013
1961
|
return __generator(this, function (_a) {
|
|
2014
1962
|
switch (_a.label) {
|
|
2015
1963
|
case 0:
|
|
@@ -2020,30 +1968,23 @@ function usePay$1(_a) {
|
|
|
2020
1968
|
}
|
|
2021
1969
|
_a.label = 1;
|
|
2022
1970
|
case 1:
|
|
2023
|
-
_a.trys.push([1,
|
|
2024
|
-
|
|
2025
|
-
|
|
1971
|
+
_a.trys.push([1, 3, , 4]);
|
|
1972
|
+
return [4 /*yield*/, checkout({
|
|
1973
|
+
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
1974
|
+
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
1975
|
+
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
1976
|
+
token: token,
|
|
1977
|
+
apiHost: apiHost,
|
|
1978
|
+
})];
|
|
2026
1979
|
case 2:
|
|
2027
1980
|
response = _a.sent();
|
|
2028
1981
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2029
|
-
return [3 /*break*/,
|
|
2030
|
-
case 3:
|
|
2031
|
-
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
2032
|
-
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
2033
|
-
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
2034
|
-
token: token,
|
|
2035
|
-
apiHost: apiHost,
|
|
2036
|
-
})];
|
|
2037
|
-
case 4:
|
|
2038
|
-
response = _a.sent();
|
|
2039
|
-
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2040
|
-
_a.label = 5;
|
|
2041
|
-
case 5: return [3 /*break*/, 7];
|
|
2042
|
-
case 6:
|
|
1982
|
+
return [3 /*break*/, 4];
|
|
1983
|
+
case 3:
|
|
2043
1984
|
error_1 = _a.sent();
|
|
2044
1985
|
onPaymentError === null || onPaymentError === void 0 ? void 0 : onPaymentError(error_1);
|
|
2045
|
-
return [3 /*break*/,
|
|
2046
|
-
case
|
|
1986
|
+
return [3 /*break*/, 4];
|
|
1987
|
+
case 4: return [2 /*return*/];
|
|
2047
1988
|
}
|
|
2048
1989
|
});
|
|
2049
1990
|
}); };
|
|
@@ -2052,40 +1993,31 @@ function usePay$1(_a) {
|
|
|
2052
1993
|
|
|
2053
1994
|
function usePay(_a) {
|
|
2054
1995
|
var _this = this;
|
|
2055
|
-
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod
|
|
1996
|
+
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod;
|
|
2056
1997
|
// Hooks
|
|
2057
|
-
var
|
|
2058
|
-
var customCheckoutFunction = React.useContext(PaymentContext).customCheckoutFunction;
|
|
2059
|
-
var token = useToken();
|
|
1998
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
2060
1999
|
var pay = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
2061
|
-
var response,
|
|
2000
|
+
var response, error_1;
|
|
2062
2001
|
return __generator(this, function (_a) {
|
|
2063
2002
|
switch (_a.label) {
|
|
2064
2003
|
case 0:
|
|
2065
|
-
_a.trys.push([0,
|
|
2066
|
-
|
|
2067
|
-
|
|
2004
|
+
_a.trys.push([0, 2, , 3]);
|
|
2005
|
+
return [4 /*yield*/, checkout({
|
|
2006
|
+
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
2007
|
+
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
2008
|
+
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
2009
|
+
token: token,
|
|
2010
|
+
apiHost: apiHost,
|
|
2011
|
+
})];
|
|
2068
2012
|
case 1:
|
|
2069
2013
|
response = _a.sent();
|
|
2070
2014
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2071
|
-
return [3 /*break*/,
|
|
2072
|
-
case 2:
|
|
2073
|
-
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
2074
|
-
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
2075
|
-
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
2076
|
-
token: token,
|
|
2077
|
-
apiHost: apiHost,
|
|
2078
|
-
})];
|
|
2079
|
-
case 3:
|
|
2080
|
-
response = _a.sent();
|
|
2081
|
-
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2082
|
-
_a.label = 4;
|
|
2083
|
-
case 4: return [3 /*break*/, 6];
|
|
2084
|
-
case 5:
|
|
2015
|
+
return [3 /*break*/, 3];
|
|
2016
|
+
case 2:
|
|
2085
2017
|
error_1 = _a.sent();
|
|
2086
2018
|
onPaymentError === null || onPaymentError === void 0 ? void 0 : onPaymentError(error_1);
|
|
2087
|
-
return [3 /*break*/,
|
|
2088
|
-
case
|
|
2019
|
+
return [3 /*break*/, 3];
|
|
2020
|
+
case 3: return [2 /*return*/];
|
|
2089
2021
|
}
|
|
2090
2022
|
});
|
|
2091
2023
|
}); };
|
|
@@ -2110,7 +2042,6 @@ var ActualCheckoutFooter = function (_a) {
|
|
|
2110
2042
|
quote: quote,
|
|
2111
2043
|
invoice: invoice,
|
|
2112
2044
|
storedPaymentMethod: storedPaymentMethod,
|
|
2113
|
-
plugin: plugin,
|
|
2114
2045
|
}).pay;
|
|
2115
2046
|
var payStripe = usePay({
|
|
2116
2047
|
onPaymentSuccess: onPaymentSuccess,
|
|
@@ -2121,7 +2052,6 @@ var ActualCheckoutFooter = function (_a) {
|
|
|
2121
2052
|
quote: quote,
|
|
2122
2053
|
invoice: invoice,
|
|
2123
2054
|
storedPaymentMethod: storedPaymentMethod,
|
|
2124
|
-
plugin: plugin,
|
|
2125
2055
|
}).pay;
|
|
2126
2056
|
var handlePaymentSubmit = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
2127
2057
|
var _a;
|
|
@@ -2187,13 +2117,13 @@ var PlusIcon = function (_a) {
|
|
|
2187
2117
|
return (jsxRuntime.jsxs("svg", __assign({ width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsx("path", { d: "M2.9165 7.5H11.0832", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M7 3.41663V11.5833", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] })));
|
|
2188
2118
|
};
|
|
2189
2119
|
|
|
2190
|
-
var Text$
|
|
2120
|
+
var Text$f = antd.Typography.Text;
|
|
2191
2121
|
var CreditCard = function (_a) {
|
|
2192
2122
|
var _b;
|
|
2193
2123
|
var onClickRemove = _a.onClickRemove, onClickUpdate = _a.onClickUpdate, paymentMethodData = _a.paymentMethodData, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, _d = _a.cardEnabled, cardEnabled = _d === void 0 ? true : _d;
|
|
2194
2124
|
var isMobile = common.useIsMobile();
|
|
2195
2125
|
var Wrapper = cardEnabled ? Card : "div";
|
|
2196
|
-
return (jsxRuntime.jsxs(Wrapper, __assign({ className: "".concat(cardEnabled ? shadow : "", " m-0") }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between gap-4 p-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Text$
|
|
2126
|
+
return (jsxRuntime.jsxs(Wrapper, __assign({ className: "".concat(cardEnabled ? shadow : "", " m-0") }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between gap-4 p-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Text$f, { children: (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.identifier })] })), jsxRuntime.jsx(antd.Tag, __assign({ color: isExpired(paymentMethodData) ? "red" : "green" }, { children: isExpired(paymentMethodData) ? "Expired" : "Valid" }))] })), !isMobile && (jsxRuntime.jsx(CardActions, { onClickRemove: onClickRemove, onClickUpdate: onClickUpdate }))] })), dayjs(paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.expirationDate).isValid() && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(antd.Divider, {}), jsxRuntime.jsxs("div", __assign({ className: "flex flex-col p-4" }, { children: [jsxRuntime.jsx(CardAttribute, { title: "EXPIRATION", value: expirationDate(paymentMethodData) }), isMobile && (jsxRuntime.jsx(CardActions, { onClickRemove: onClickRemove, onClickUpdate: onClickUpdate }))] }))] }))] })));
|
|
2197
2127
|
};
|
|
2198
2128
|
var MiniCreditCard = function (_a) {
|
|
2199
2129
|
var _b;
|
|
@@ -2205,7 +2135,7 @@ var MiniCreditCard = function (_a) {
|
|
|
2205
2135
|
var backgroundColor = React.useMemo(function () {
|
|
2206
2136
|
return darkMode ? "var(--row-background-alternate)" : "bg-slate-50";
|
|
2207
2137
|
}, [darkMode]);
|
|
2208
|
-
return (jsxRuntime.jsx("div", __assign({ className: "flex flex-row justify-between items-center p-1 px-3 border-solid ".concat(backgroundColor, " ").concat(borderColor, " rounded-md border") }, { children: paymentMethodData ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-row gap-4" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-4 space-between w-full" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Text$
|
|
2138
|
+
return (jsxRuntime.jsx("div", __assign({ className: "flex flex-row justify-between items-center p-1 px-3 border-solid ".concat(backgroundColor, " ").concat(borderColor, " rounded-md border") }, { children: paymentMethodData ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-row gap-4" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-4 space-between w-full" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Text$f, { children: (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.identifier }), jsxRuntime.jsx(antd.Tag, __assign({ color: isExpired(paymentMethodData) ? "red" : "green" }, { children: isExpired(paymentMethodData) ? "Expired" : "Valid" }))] })) })), !hideRemoveButton && (jsxRuntime.jsx(antd.Popconfirm, __assign({ title: "Remove card?", onConfirm: onClickRemove }, { children: jsxRuntime.jsx(antd.Button, __assign({ className: "font-normal p-0", type: "link" }, { children: "Remove" })) })))] })) : (jsxRuntime.jsxs("div", __assign({ className: "flex flex-row gap-2 items-center" }, { children: [jsxRuntime.jsx(CreditCardOutlined$1, {}), jsxRuntime.jsx(Text$f, __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: "No payment method selected" })), jsxRuntime.jsx(antd.Button, { disabled: true, type: "link" })] }))) })));
|
|
2209
2139
|
};
|
|
2210
2140
|
var CardImage = function (_a) {
|
|
2211
2141
|
var _b, _c;
|
|
@@ -2224,7 +2154,7 @@ var CardImage = function (_a) {
|
|
|
2224
2154
|
};
|
|
2225
2155
|
var CardAttribute = function (_a) {
|
|
2226
2156
|
var title = _a.title, value = _a.value;
|
|
2227
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsx("div", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: title })), jsxRuntime.jsx(Text$
|
|
2157
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsx("div", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: title })), jsxRuntime.jsx(Text$f, { children: value })] })));
|
|
2228
2158
|
};
|
|
2229
2159
|
var CardActions = function (_a) {
|
|
2230
2160
|
var onClickRemove = _a.onClickRemove, onClickUpdate = _a.onClickUpdate;
|
|
@@ -2405,7 +2335,7 @@ function useSave$1(_a) {
|
|
|
2405
2335
|
return { save: save, isSaving: isSaving };
|
|
2406
2336
|
}
|
|
2407
2337
|
|
|
2408
|
-
var Text$
|
|
2338
|
+
var Text$e = antd.Typography.Text;
|
|
2409
2339
|
var TEST_CARD = "4242424242424242";
|
|
2410
2340
|
var DemoPayForm = function (_a) {
|
|
2411
2341
|
var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
|
|
@@ -2466,7 +2396,7 @@ var DemoPayForm = function (_a) {
|
|
|
2466
2396
|
var onCardCvcChange = function (cvc) {
|
|
2467
2397
|
setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
|
|
2468
2398
|
};
|
|
2469
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsxs(StyledInputs, __assign({ className: "flex flex-col gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsxRuntime.jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxRuntime.jsxs("div", __assign({ className: "flex gap-2" }, { children: [jsxRuntime.jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsxRuntime.jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsxRuntime.jsx(Text$
|
|
2399
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsxs(StyledInputs, __assign({ className: "flex flex-col gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsxRuntime.jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxRuntime.jsxs("div", __assign({ className: "flex gap-2" }, { children: [jsxRuntime.jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsxRuntime.jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsxRuntime.jsx(Text$e, __assign({ className: "text-xs" }, { children: "DemoPay is for testing only." })), jsxRuntime.jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
|
|
2470
2400
|
};
|
|
2471
2401
|
var StyledInputs = styled__default["default"].div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n .ant-input {\n background-color: ", " !important;\n }\n .ant-input:not(:focus) {\n border-color: ", " !important;\n }\n"], ["\n .ant-input {\n background-color: ", " !important;\n }\n .ant-input:not(:focus) {\n border-color: ", " !important;\n }\n"])), function (_a) {
|
|
2472
2402
|
var darkMode = _a.darkMode;
|
|
@@ -2569,8 +2499,7 @@ function useSave(_a) {
|
|
|
2569
2499
|
var _b = React.useState(false), isSaving = _b[0], setIsSaving = _b[1];
|
|
2570
2500
|
var elements = reactStripeJs.useElements();
|
|
2571
2501
|
var stripe = reactStripeJs.useStripe();
|
|
2572
|
-
var
|
|
2573
|
-
var token = useToken();
|
|
2502
|
+
var _c = React.useContext(BunnyContext), token = _c.token, apiHost = _c.apiHost;
|
|
2574
2503
|
var accountId = React.useContext(PaymentContext).accountId;
|
|
2575
2504
|
var save = function (_a) {
|
|
2576
2505
|
var plugin = _a.plugin;
|
|
@@ -2704,7 +2633,7 @@ var CardIcon = function () {
|
|
|
2704
2633
|
return (jsxRuntime.jsxs("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsx("path", { d: "M15 3.75H3C2.17157 3.75 1.5 4.42157 1.5 5.25V12.75C1.5 13.5784 2.17157 14.25 3 14.25H15C15.8284 14.25 16.5 13.5784 16.5 12.75V5.25C16.5 4.42157 15.8284 3.75 15 3.75Z", stroke: common.SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), jsxRuntime.jsx("path", { d: "M1.5 7.5H16.5", stroke: common.SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] })));
|
|
2705
2634
|
};
|
|
2706
2635
|
|
|
2707
|
-
var Text$
|
|
2636
|
+
var Text$d = antd.Typography.Text;
|
|
2708
2637
|
var PaymentMethodSelector = function (_a) {
|
|
2709
2638
|
var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
|
|
2710
2639
|
return (jsxRuntime.jsx("div", __assign({ className: "flex flex-col gap-2" }, { children: paymentMethodAllowedPlugins === null || paymentMethodAllowedPlugins === void 0 ? void 0 : paymentMethodAllowedPlugins.map(function (plugin, index) { return (jsxRuntime.jsx(PaymentOption, { name: plugin.name, onClick: onSelect, paymentPlugin: plugin, selected: (value === null || value === void 0 ? void 0 : value.id) === plugin.id }, index)); }) })));
|
|
@@ -2717,7 +2646,7 @@ var PaymentOption = function (_a) {
|
|
|
2717
2646
|
var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes("card");
|
|
2718
2647
|
return (jsxRuntime.jsxs(PaymentOptionContainer, __assign({ "$brandColor": brandColor, "$selected": selected, className: "flex justify-between items-center w-full cursor-pointer py-2 px-4 rounded border-solid ".concat(darkMode
|
|
2719
2648
|
? "var(--row-background-dark) border-gray-500"
|
|
2720
|
-
: "bg-slate-50 border-slate-200", " border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex gap-2 items-center" }, { children: [jsxRuntime.jsx(antd.Checkbox, { checked: selected, className: darkMode ? "border-gray-400" : "" }), jsxRuntime.jsx(Text$
|
|
2649
|
+
: "bg-slate-50 border-slate-200", " border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex gap-2 items-center" }, { children: [jsxRuntime.jsx(antd.Checkbox, { checked: selected, className: darkMode ? "border-gray-400" : "" }), jsxRuntime.jsx(Text$d, { children: name })] })), isAch ? (jsxRuntime.jsx(BankOutlined$1, { className: "text-slate-400" })) : isCard ? (jsxRuntime.jsx(CardIcon, {})) : (jsxRuntime.jsx(CardIcon, {}))] })));
|
|
2721
2650
|
};
|
|
2722
2651
|
var PaymentOptionContainer = styled__default["default"].div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n transition: border 0.3s ease;\n\n ", "\n\n &:hover {\n border-color: ", ";\n }\n"], ["\n transition: border 0.3s ease;\n\n ", "\n\n &:hover {\n border-color: ", ";\n }\n"])), function (_a) {
|
|
2723
2652
|
var $brandColor = _a.$brandColor, $selected = _a.$selected;
|
|
@@ -2760,17 +2689,16 @@ function useRemovePaymentMethod(paymentPlugins, token, apiHost, accountId) {
|
|
|
2760
2689
|
|
|
2761
2690
|
var Panel = antd.Collapse.Panel;
|
|
2762
2691
|
var PaymentForm = function (_a) {
|
|
2763
|
-
var entityId = _a.entityId, invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, overrideToken = _a.overrideToken, graphQLClient = _a.graphQLClient
|
|
2692
|
+
var entityId = _a.entityId, invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, overrideToken = _a.overrideToken, graphQLClient = _a.graphQLClient;
|
|
2764
2693
|
// Local state
|
|
2765
2694
|
var _b = React.useState(), selectedPaymentMethod = _b[0], setSelectedPaymentMethod = _b[1];
|
|
2766
2695
|
var _c = React.useState(false), showPaymentMethodForm = _c[0], setShowPaymentMethodForm = _c[1];
|
|
2767
2696
|
var paying = !!(quote || invoice);
|
|
2768
2697
|
// Hooks
|
|
2769
|
-
var
|
|
2770
|
-
var
|
|
2771
|
-
var storedPaymentMethod = usePaymentMethod(graphQLClient).data;
|
|
2698
|
+
var _d = React.useContext(BunnyContext), token = _d.token, apiHost = _d.apiHost;
|
|
2699
|
+
var storedPaymentMethod = usePaymentMethod(graphQLClient, accountId).data;
|
|
2772
2700
|
var isPaymentMethodFetched = storedPaymentMethod !== undefined;
|
|
2773
|
-
var
|
|
2701
|
+
var _e = usePaymentPlugins({ entityId: entityId, apiHost: apiHost, token: overrideToken || token }), paymentMethodAllowedPlugins = _e.paymentMethodAllowedPlugins, arePluginsFetched = _e.isFetched;
|
|
2774
2702
|
var onClickRemove = useRemovePaymentMethod(paymentMethodAllowedPlugins || [], overrideToken || token, apiHost, accountId);
|
|
2775
2703
|
var queryClient = reactQuery.useQueryClient();
|
|
2776
2704
|
// Set default plugin
|
|
@@ -2816,10 +2744,9 @@ var PaymentForm = function (_a) {
|
|
|
2816
2744
|
accountId: accountId,
|
|
2817
2745
|
overrideToken: overrideToken,
|
|
2818
2746
|
storedPaymentMethod: storedPaymentMethod,
|
|
2819
|
-
customCheckoutFunction: customCheckoutFunction,
|
|
2820
2747
|
} }, { children: jsxRuntime.jsx(StripeWrapper, __assign({ plugin: selectedPaymentMethod, token: token, apiHost: apiHost, accountId: accountId }, { children: jsxRuntime.jsx("div", __assign({ className: "flex flex-col gap-0 w-full" }, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "px-4" }, { children: jsxRuntime.jsx(MiniCreditCard, { onClickRemove: function () { return onClickRemove(storedPaymentMethod); }, paymentMethodData: storedPaymentMethod }) })), paying && storedPaymentMethod ? (jsxRuntime.jsx("div", __assign({ className: "px-4" }, { children: jsxRuntime.jsx(CheckoutFooter, { quote: quote, invoice: invoice, onPaymentSuccess: handlePaymentSuccess, plugin: selectedPaymentMethod }) }))) : (
|
|
2821
2748
|
//if not paying and payment method is saved, show Collapse
|
|
2822
|
-
jsxRuntime.jsx(antd.Collapse, __assign({ bordered: false, activeKey: showPaymentMethodForm ? "1" : undefined, ghost: true, collapsible: "disabled", destroyInactivePanel: true }, { children: jsxRuntime.jsx(Panel, __assign({ header: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !showPaymentMethodForm ? (jsxRuntime.jsx("div", __assign({ className: "pt-
|
|
2749
|
+
jsxRuntime.jsx(antd.Collapse, __assign({ bordered: false, activeKey: showPaymentMethodForm ? "1" : undefined, ghost: true, collapsible: "disabled", destroyInactivePanel: true }, { children: jsxRuntime.jsx(Panel, __assign({ header: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !showPaymentMethodForm ? (jsxRuntime.jsx("div", __assign({ className: "pt-4 px-4" }, { children: jsxRuntime.jsxs(antd.Button, __assign({ onClick: function () {
|
|
2823
2750
|
setShowPaymentMethodForm(true);
|
|
2824
2751
|
}, type: "default", className: "w-full" }, { children: [storedPaymentMethod ? "Update" : "Add", " payment method"] })) }))) : null }), showArrow: false }, { children: jsxRuntime.jsx("div", { children: selectedPaymentMethod ? (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2 mt-2" }, { children: [showPaymentMethodSelector && (jsxRuntime.jsx(PaymentMethodSelector, { onSelect: setSelectedPaymentMethod, paymentMethodAllowedPlugins: paymentMethodAllowedPlugins, value: selectedPaymentMethod })), jsxRuntime.jsx("div", __assign({ className: "flex flex-col" }, { children: jsxRuntime.jsx(PaymentMethodDetails, { onFail: onFail, onSavePaymentMethod: handleSavePaymentMethod, paymentMethod: selectedPaymentMethod }) }))] }))) : (jsxRuntime.jsx("div", { children: "No payment method selected" })) }) }), "1") })))] }) })) })) })));
|
|
2825
2752
|
};
|
|
@@ -2850,8 +2777,7 @@ function ActualInvoice() {
|
|
|
2850
2777
|
var _a = React.useContext(InvoiceQuoteContext), id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick,
|
|
2851
2778
|
// onPaymentSuccess,
|
|
2852
2779
|
entityId = _a.entityId, className = _a.className;
|
|
2853
|
-
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired, graphQLClient = _b.graphQLClient;
|
|
2854
|
-
var token = useToken();
|
|
2780
|
+
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, token = _b.token, onTokenExpired = _b.onTokenExpired, graphQLClient = _b.graphQLClient;
|
|
2855
2781
|
// Local state
|
|
2856
2782
|
var isMobile = common.useIsMobile(common.BreakpointNumbers.lg);
|
|
2857
2783
|
// Hooks
|
|
@@ -3055,8 +2981,7 @@ var useIsExpired = function (expiresAt) {
|
|
|
3055
2981
|
|
|
3056
2982
|
var PandadocPollingModal = function (_a) {
|
|
3057
2983
|
var isVisible = _a.isVisible, setVisible = _a.setVisible, id = _a.id;
|
|
3058
|
-
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
3059
|
-
var token = useToken();
|
|
2984
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
3060
2985
|
var graphQLMutation = common.useGraphQLmutation(function () {
|
|
3061
2986
|
console.log("graphQLMutation navigateOnTokenExpired not yet implemented");
|
|
3062
2987
|
}, apiHost || "", function () {
|
|
@@ -3142,7 +3067,7 @@ var DOCUMENT_NAME;
|
|
|
3142
3067
|
DOCUMENT_NAME["QUOTE"] = "quote";
|
|
3143
3068
|
})(DOCUMENT_NAME || (DOCUMENT_NAME = {}));
|
|
3144
3069
|
|
|
3145
|
-
var Text$
|
|
3070
|
+
var Text$c = antd.Typography.Text;
|
|
3146
3071
|
var documentName = DOCUMENT_NAME.QUOTE;
|
|
3147
3072
|
styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
3148
3073
|
function Quote(_a) {
|
|
@@ -3163,8 +3088,7 @@ function ActualQuote(_a) {
|
|
|
3163
3088
|
var _b, _c;
|
|
3164
3089
|
var entityId = _a.entityId;
|
|
3165
3090
|
// Context
|
|
3166
|
-
var _d = React.useContext(BunnyContext), apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired;
|
|
3167
|
-
var token = useToken();
|
|
3091
|
+
var _d = React.useContext(BunnyContext), token = _d.token, apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired;
|
|
3168
3092
|
var entityBranding = React.useContext(BrandContext);
|
|
3169
3093
|
var _e = React.useContext(InvoiceQuoteContext), className = _e.className, id = _e.id, hideDownloadButton = _e.hideDownloadButton;
|
|
3170
3094
|
// Queries
|
|
@@ -3212,7 +3136,7 @@ function ActualQuote(_a) {
|
|
|
3212
3136
|
documentName: documentName,
|
|
3213
3137
|
}) }), jsxRuntime.jsx("meta", { property: "og:description", content: quoteMetaDescription(formattedQuote.vendorName) })] }), jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-4 ".concat(className) }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex flex-row justify-end items-center gap-4", id: "acceptance", style: {
|
|
3214
3138
|
color: entityBranding.secondaryColor,
|
|
3215
|
-
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$
|
|
3139
|
+
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$c, { children: "Quote was accepted by ".concat(formattedQuote.acceptedByName, " on ").concat(common.formatDate(formattedQuote.acceptedAt)) })) : null, (!isMobile || !isAccepted) && (jsxRuntime.jsxs("div", __assign({ className: isMobile
|
|
3216
3140
|
? "flex w-full justify-end gap-2"
|
|
3217
3141
|
: "flex items-center justify-end gap-2" }, { children: [!isMobile && !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(DownloadOutlined$1, {}), onClick: function () {
|
|
3218
3142
|
return downloadFile(apiHost + "/api/pdf/quote", token);
|
|
@@ -3307,10 +3231,10 @@ var getColor = function (state) {
|
|
|
3307
3231
|
}
|
|
3308
3232
|
};
|
|
3309
3233
|
|
|
3310
|
-
var Text$
|
|
3234
|
+
var Text$b = antd.Typography.Text;
|
|
3311
3235
|
var TransactionDate = function (_a) {
|
|
3312
3236
|
var date = _a.date;
|
|
3313
|
-
return jsxRuntime.jsx(Text$
|
|
3237
|
+
return jsxRuntime.jsx(Text$b, __assign({ className: "text-sm" }, { children: common.formatDate(date) }));
|
|
3314
3238
|
};
|
|
3315
3239
|
|
|
3316
3240
|
// TODO: delete
|
|
@@ -3344,10 +3268,10 @@ var TransactionGridCell = styled__default["default"].div.withConfig({
|
|
|
3344
3268
|
})(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n ", "\n\n display: flex;\n align-items: center;\n justify-content: ", ";\n\n text-align: ", ";\n white-space: nowrap;\n font-size: 14px;\n color: ", ";\n\n background-color: inherit;\n\n padding: 1rem;\n min-width: 48px;\n"], ["\n ", "\n\n display: flex;\n align-items: center;\n justify-content: ", ";\n\n text-align: ", ";\n white-space: nowrap;\n font-size: 14px;\n color: ", ";\n\n background-color: inherit;\n\n padding: 1rem;\n min-width: 48px;\n"])), function (props) { return props.gridColumn && "grid-column: ".concat(props.gridColumn, ";"); }, function (props) { return (props.right ? "flex-end" : "flex-start"); }, function (props) { return (props.right ? "right" : "left"); }, common.SLATE_600);
|
|
3345
3269
|
var templateObject_1$3;
|
|
3346
3270
|
|
|
3347
|
-
var Text$
|
|
3271
|
+
var Text$a = antd.Typography.Text;
|
|
3348
3272
|
var TransactionsEmptyState = function () {
|
|
3349
3273
|
var noTransactionsMessage = React.useContext(TransactionsListContext).noTransactionsMessage;
|
|
3350
|
-
return (jsxRuntime.jsx(Text$
|
|
3274
|
+
return (jsxRuntime.jsx(Text$a, __assign({ className: "flex justify-center p-4 text-base" }, { children: noTransactionsMessage || "There are no transactions" })));
|
|
3351
3275
|
};
|
|
3352
3276
|
|
|
3353
3277
|
var isInvoice = function (transaction) {
|
|
@@ -3364,12 +3288,11 @@ var TransactionRowTitle = function (_a) {
|
|
|
3364
3288
|
return (jsxRuntime.jsx("span", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: transaction.transactionable.number })));
|
|
3365
3289
|
};
|
|
3366
3290
|
|
|
3367
|
-
var Text$
|
|
3291
|
+
var Text$9 = antd.Typography.Text;
|
|
3368
3292
|
var TransactionsListDesktop = function (_a) {
|
|
3369
3293
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
3370
3294
|
var columns = React.useContext(TransactionsListContext).columns;
|
|
3371
|
-
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3372
|
-
var token = useToken();
|
|
3295
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3373
3296
|
var showAmount = columns.includes("amount");
|
|
3374
3297
|
var showDateAndTitle = columns.includes("date-and-title");
|
|
3375
3298
|
var showDownload = columns.includes("download");
|
|
@@ -3385,16 +3308,15 @@ var TransactionsListDesktop = function (_a) {
|
|
|
3385
3308
|
backgroundColor: index % 2 === 0
|
|
3386
3309
|
? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
|
|
3387
3310
|
: "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
|
|
3388
|
-
} }, { children: [!showDateAndTitle && !showState && !showAmount && !showDownload && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$
|
|
3311
|
+
} }, { children: [!showDateAndTitle && !showState && !showAmount && !showDownload && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$9, { children: "No columns selected" }) })), showDateAndTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TransactionGridCell, __assign({ right: false }, { children: jsxRuntime.jsx(TransactionDate, { date: transaction.createdAt }) })), jsxRuntime.jsxs(TransactionGridCell, __assign({ right: false, className: "flex items-center gap-2" }, { children: [jsxRuntime.jsx(Text$9, { children: lodash.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] }))] })), showDownload && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })), showState ? (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(StateTag, { state: transaction.state }) }))) : null, showAmount && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(Text$9, { children: common.formatCurrency(((_a = transaction === null || transaction === void 0 ? void 0 : transaction.transactionable) === null || _a === void 0 ? void 0 : _a.amount) || transaction.amount, transaction.currencyId) }) })))] }), index));
|
|
3389
3312
|
});
|
|
3390
3313
|
};
|
|
3391
3314
|
|
|
3392
|
-
var Text$
|
|
3315
|
+
var Text$8 = antd.Typography.Text;
|
|
3393
3316
|
var TransactionsListMobile = function (_a) {
|
|
3394
3317
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
3395
3318
|
var columns = React.useContext(TransactionsListContext).columns;
|
|
3396
|
-
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3397
|
-
var token = useToken();
|
|
3319
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3398
3320
|
var showAmount = columns.includes("amount");
|
|
3399
3321
|
var showDateAndTitle = columns.includes("date-and-title");
|
|
3400
3322
|
var showDownload = columns.includes("download");
|
|
@@ -3409,11 +3331,11 @@ var TransactionsListMobile = function (_a) {
|
|
|
3409
3331
|
backgroundColor: index % 2 === 0
|
|
3410
3332
|
? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
|
|
3411
3333
|
: "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
|
|
3412
|
-
} }, { children: [jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$
|
|
3334
|
+
} }, { children: [jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$8, { children: lodash.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] })), showState && jsxRuntime.jsx(StateTag, { state: transaction.state })] })), jsxRuntime.jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsxRuntime.jsx(TransactionDate, { date: transaction.createdAt })), showAmount && showDateAndTitle && jsxRuntime.jsx(Text$8, { children: "\u00B7" }), showAmount && (jsxRuntime.jsx(Text$8, { children: common.formatCurrency(transaction.transactionable.amount || transaction.amount, transaction.currencyId) }))] }))] })) }), showDownload && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })))] }), index));
|
|
3413
3335
|
});
|
|
3414
3336
|
};
|
|
3415
3337
|
|
|
3416
|
-
var Text$
|
|
3338
|
+
var Text$7 = antd.Typography.Text;
|
|
3417
3339
|
var DISPLAY_WIDTH = 1200;
|
|
3418
3340
|
function Transactions(_a) {
|
|
3419
3341
|
var transactionComponent = _a.transactionComponent, _b = _a.showSearchBar, showSearchBar = _b === void 0 ? true : _b, _c = _a.showTitle, showTitle = _c === void 0 ? true : _c, _d = _a.title, title = _d === void 0 ? "Past transactions" : _d, _e = _a.columns, columns = _e === void 0 ? ["date-and-title", "state", "amount", "download"] : _e, className = _a.className, _f = _a.shadow, shadow = _f === void 0 ? "shadow-md" : _f, searchBarClassName = _a.searchBarClassName, _g = _a.useModal, useModal = _g === void 0 ? false : _g, onTransactionClick = _a.onTransactionClick, _h = _a.suppressTransactionDisplay, suppressTransactionDisplay = _h === void 0 ? false : _h, _j = _a.kindsToShow, kindsToShow = _j === void 0 ? [
|
|
@@ -3444,10 +3366,9 @@ function Transactions(_a) {
|
|
|
3444
3366
|
filterTransactions: filterTransactions,
|
|
3445
3367
|
sortTransactions: sortTransactions,
|
|
3446
3368
|
};
|
|
3447
|
-
var
|
|
3448
|
-
var token = useToken();
|
|
3369
|
+
var _l = React.useContext(BunnyContext), token = _l.token, apiHost = _l.apiHost;
|
|
3449
3370
|
// Local state
|
|
3450
|
-
var
|
|
3371
|
+
var _m = React.useState(""), search = _m[0], setSearch = _m[1];
|
|
3451
3372
|
var filterValue = filter ||
|
|
3452
3373
|
(search ? "filter: \"transaction.transactionableId is ".concat(search, "\"") : "");
|
|
3453
3374
|
// Queries
|
|
@@ -3522,7 +3443,7 @@ function TransactionsDisplay(_a) {
|
|
|
3522
3443
|
onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
|
|
3523
3444
|
setDrawerOpen(false);
|
|
3524
3445
|
}
|
|
3525
|
-
return (jsxRuntime.jsxs("div", __assign({ style: style }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex flex-col w-full shadow-padding-xb gap-2 ".concat(isMobile ? "overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col gap-1" : "flex-row items-center", " justify-between") }, { children: [showTitle ? (jsxRuntime.jsx(Text$
|
|
3446
|
+
return (jsxRuntime.jsxs("div", __assign({ style: style }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex flex-col w-full shadow-padding-xb gap-2 ".concat(isMobile ? "overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col gap-1" : "flex-row items-center", " justify-between") }, { children: [showTitle ? (jsxRuntime.jsx(Text$7, __assign({ className: "shrink-0 font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsxRuntime.jsx("div", {}) // Empty div so justify-between works
|
|
3526
3447
|
), showSearchBar && (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "") }, { children: jsxRuntime.jsx(antd.Input, { className: searchBarClassName
|
|
3527
3448
|
? searchBarClassName
|
|
3528
3449
|
: "border border-slate-200", onChange: function (e) {
|
|
@@ -3541,7 +3462,7 @@ function TransactionsDisplay(_a) {
|
|
|
3541
3462
|
}) })) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: TransactionsListDesktop({
|
|
3542
3463
|
transactions: updatedTransactions,
|
|
3543
3464
|
onTransactionClick: handleTransactionClick,
|
|
3544
|
-
}) })) }))] })), useModal ? (jsxRuntime.jsx(antd.Modal, __assign({ title:
|
|
3465
|
+
}) })) }))] })), useModal ? (jsxRuntime.jsx(antd.Modal, __assign({ title: "Basic Modal", open: drawerOpen, onOk: handleDisplayClose, onCancel: handleDisplayClose, width: DISPLAY_WIDTH, footer: null }, { children: jsxRuntime.jsx(Invoice, { id: (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.transactionableId) || "", entityId: entityId }) }))) : (jsxRuntime.jsx(antd.Drawer, __assign({ title: drawerTitle(), onClose: handleDisplayClose, open: drawerOpen, width: DISPLAY_WIDTH }, { children: transactionComponent ? (transactionComponent) : (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind) === "INVOICE" ? (jsxRuntime.jsx(Invoice, { id: selectedTransaction.transactionableId, entityId: entityId })) : (jsxRuntime.jsxs(antd.Card, __assign({ className: "shadow-md" }, { children: [jsxRuntime.jsx(antd.Typography.Title, __assign({ level: 2, className: "mb-4" }, { children: "Transaction Details" })), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Amount:" }), " ", jsxRuntime.jsx(antd.Typography.Text, { children: common.formatCurrency((selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.amount) || 0, (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.currencyId) || "USD") })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Description:" }), " ", jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.description })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Kind:" }), " ", jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "State:" }), " ", jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.state })] })] }))) })))] })));
|
|
3545
3466
|
}
|
|
3546
3467
|
|
|
3547
3468
|
function Quotes(_a) {
|
|
@@ -3607,11 +3528,10 @@ function Quotes(_a) {
|
|
|
3607
3528
|
return (jsxRuntime.jsx(TransactionsListContext.Provider, __assign({ value: contextValues }, { children: jsxRuntime.jsx(QuotesWrapper, {}) })));
|
|
3608
3529
|
}
|
|
3609
3530
|
function QuotesWrapper() {
|
|
3610
|
-
var
|
|
3611
|
-
var token = useToken();
|
|
3531
|
+
var _a = React.useContext(BunnyContext), token = _a.token, apiHost = _a.apiHost;
|
|
3612
3532
|
var filterFromContext = React.useContext(TransactionsListContext).filter;
|
|
3613
3533
|
// Local state
|
|
3614
|
-
var
|
|
3534
|
+
var _b = React.useState(""), search = _b[0], setSearch = _b[1];
|
|
3615
3535
|
var filter = filterFromContext || (search ? "filter: \"quote.id is ".concat(search, "\"") : "");
|
|
3616
3536
|
// Queries
|
|
3617
3537
|
var data = reactQuery.useQuery({
|
|
@@ -3639,16 +3559,14 @@ function QuotesWrapper() {
|
|
|
3639
3559
|
return (jsxRuntime.jsx(TransactionsDisplay, { transactions: quotesAsTransactions, onSearchValueChanged: setSearch, search: search }));
|
|
3640
3560
|
}
|
|
3641
3561
|
|
|
3642
|
-
var Text$7 = antd.Typography.Text;
|
|
3643
3562
|
var DrawerHeader = function (_a) {
|
|
3644
3563
|
var description = _a.description, onClose = _a.onClose, title = _a.title;
|
|
3645
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between gap-2" }, { children: [jsxRuntime.jsx(
|
|
3564
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex items-center justify-between gap-2" }, { children: [jsxRuntime.jsx("div", __assign({ className: "text-xl" }, { children: title })), jsxRuntime.jsx("button", __assign({ onClick: onClose, className: "ant-drawer-close" }, { children: jsxRuntime.jsx(CloseOutlined$1, {}) }))] })), description && jsxRuntime.jsx("div", __assign({ className: "text-xs" }, { children: description }))] })));
|
|
3646
3565
|
};
|
|
3647
3566
|
|
|
3648
3567
|
var PaymentMethod = function (_a) {
|
|
3649
3568
|
var entityId = _a.entityId, className = _a.className, _b = _a.shadow, shadow = _b === void 0 ? "shadow-md" : _b, _c = _a.cardEnabled, cardEnabled = _c === void 0 ? true : _c;
|
|
3650
|
-
var _d = React.useContext(BunnyContext), apiHost = _d.apiHost, graphQLClient = _d.graphQLClient, onTokenExpired = _d.onTokenExpired;
|
|
3651
|
-
var token = useToken();
|
|
3569
|
+
var _d = React.useContext(BunnyContext), token = _d.token, apiHost = _d.apiHost, graphQLClient = _d.graphQLClient, onTokenExpired = _d.onTokenExpired;
|
|
3652
3570
|
// Hooks
|
|
3653
3571
|
var queryClient = reactQuery.useQueryClient();
|
|
3654
3572
|
var paymentPlugins = usePaymentPlugins({ entityId: entityId, apiHost: apiHost, token: token }).paymentPlugins;
|
|
@@ -3780,11 +3698,10 @@ var TaxationForm = function (_a) {
|
|
|
3780
3698
|
var account = _a.account, quote = _a.quote;
|
|
3781
3699
|
// Hooks
|
|
3782
3700
|
var queryClient = reactQuery.useQueryClient();
|
|
3783
|
-
var
|
|
3784
|
-
var token = useToken();
|
|
3701
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
3785
3702
|
var form = antd.Form.useForm()[0];
|
|
3786
3703
|
// Mutations
|
|
3787
|
-
var
|
|
3704
|
+
var _c = reactQuery.useMutation({
|
|
3788
3705
|
mutationFn: function (changedFormData) { return __awaiter(void 0, void 0, void 0, function () {
|
|
3789
3706
|
var account;
|
|
3790
3707
|
return __generator(this, function (_a) {
|
|
@@ -3806,7 +3723,7 @@ var TaxationForm = function (_a) {
|
|
|
3806
3723
|
queryKey: ["getTaxationRequiredAccountFields", token],
|
|
3807
3724
|
});
|
|
3808
3725
|
},
|
|
3809
|
-
}), updateAccount =
|
|
3726
|
+
}), updateAccount = _c.mutate, isUpdatingAccount = _c.isPending;
|
|
3810
3727
|
return (jsxRuntime.jsxs(antd.Form, __assign({ className: "flex flex-col gap-4", form: form, initialValues: account, layout: "vertical", onFinish: updateAccount }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing street", name: "billingStreet" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Street" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing city", name: "billingCity" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "City" }) })), jsxRuntime.jsx(FormBillingState, { form: form }), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing country", name: "billingCountry", rules: [{ required: true }] }, { children: jsxRuntime.jsx(antd.Select, { options: common.Lists.COUNTRY_LIST, placeholder: "Select a country", showSearch: true, filterOption: function (input, option) {
|
|
3811
3728
|
var _a, _b;
|
|
3812
3729
|
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : "").toLowerCase().includes(input.toLowerCase()) ||
|
|
@@ -3822,8 +3739,7 @@ var FormBillingState = function (_a) {
|
|
|
3822
3739
|
|
|
3823
3740
|
var QuoteCheckout = function (_a) {
|
|
3824
3741
|
var account = _a.account, onSuccess = _a.onSuccess, onFail = _a.onFail, quote = _a.quote, taxationRequiredAccountFields = _a.taxationRequiredAccountFields, entityId = _a.entityId;
|
|
3825
|
-
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, graphQLClient = _b.graphQLClient;
|
|
3826
|
-
var token = useToken();
|
|
3742
|
+
var _b = React.useContext(BunnyContext), apiHost = _b.apiHost, token = _b.token, graphQLClient = _b.graphQLClient;
|
|
3827
3743
|
var isMobile = common.useIsMobile();
|
|
3828
3744
|
var _c = React.useState(false), isSaving = _c[0], setIsSaving = _c[1];
|
|
3829
3745
|
var paymentRequired = getQuoteAmountDue(quote) > 0;
|
|
@@ -3940,6 +3856,37 @@ var Checkout = function (_a) {
|
|
|
3940
3856
|
}, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] }))] })) })));
|
|
3941
3857
|
};
|
|
3942
3858
|
|
|
3859
|
+
var DEFAULT_HEADERS = {
|
|
3860
|
+
"Content-type": "application/json; charset=utf-8",
|
|
3861
|
+
};
|
|
3862
|
+
// !!! Duplicated from @bunnyapp/common due to bug in signup. Uses BunnyProvider token instead of apiToken.
|
|
3863
|
+
var gqlRequest = function (_a) {
|
|
3864
|
+
var query = _a.query, _b = _a.vars, vars = _b === void 0 ? {} : _b, headers = _a.headers, token = _a.token, isInPreviewMode = _a.isInPreviewMode, apiHost = _a.apiHost;
|
|
3865
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
3866
|
+
var graphqlEndpoint, requestHeaders, authorizationHeader, error_1;
|
|
3867
|
+
return __generator(this, function (_c) {
|
|
3868
|
+
switch (_c.label) {
|
|
3869
|
+
case 0:
|
|
3870
|
+
console.log("token in gqlRequest", token);
|
|
3871
|
+
_c.label = 1;
|
|
3872
|
+
case 1:
|
|
3873
|
+
_c.trys.push([1, 3, , 4]);
|
|
3874
|
+
graphqlEndpoint = common.DEFAULT_CONFIG.graphqlEndpoint;
|
|
3875
|
+
requestHeaders = headers || DEFAULT_HEADERS;
|
|
3876
|
+
authorizationHeader = "Bearer ".concat(token);
|
|
3877
|
+
if (!requestHeaders.Authorization && !isInPreviewMode)
|
|
3878
|
+
requestHeaders.Authorization = authorizationHeader;
|
|
3879
|
+
return [4 /*yield*/, request__default["default"]("".concat(apiHost).concat(graphqlEndpoint), query, vars, requestHeaders)];
|
|
3880
|
+
case 2: return [2 /*return*/, _c.sent()];
|
|
3881
|
+
case 3:
|
|
3882
|
+
error_1 = _c.sent();
|
|
3883
|
+
throw error_1;
|
|
3884
|
+
case 4: return [2 /*return*/];
|
|
3885
|
+
}
|
|
3886
|
+
});
|
|
3887
|
+
});
|
|
3888
|
+
};
|
|
3889
|
+
|
|
3943
3890
|
var MUTATION$4 = function () { return "\nmutation AccountSignup (\n $entityId: ID!,\n $pluginId: String!,\n $paymentMethodId: String,\n $priceListCode: String!,\n $accountId: ID!,\n $quoteId: ID!\n) {\n accountSignup(\n entityId: $entityId,\n pluginId: $pluginId,\n paymentMethodId: $paymentMethodId,\n priceListCode: $priceListCode,\n accountId: $accountId,\n quoteId: $quoteId\n ) {\n errors\n quote {\n acceptedByName\n acceptedByTitle\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n }\n}"; };
|
|
3944
3891
|
var accountSignup = function (_a) {
|
|
3945
3892
|
var token = _a.token, apiHost = _a.apiHost, entityId = _a.entityId, accountId = _a.accountId, quoteId = _a.quoteId, paymentToken = _a.paymentToken, paymentMethodId = _a.paymentMethodId, pluginId = _a.pluginId, priceListCode = _a.priceListCode;
|
|
@@ -3983,12 +3930,14 @@ var portalSessionCreate = function (_a) {
|
|
|
3983
3930
|
var _b;
|
|
3984
3931
|
return __generator(this, function (_c) {
|
|
3985
3932
|
switch (_c.label) {
|
|
3986
|
-
case 0:
|
|
3987
|
-
|
|
3988
|
-
|
|
3989
|
-
|
|
3990
|
-
|
|
3991
|
-
|
|
3933
|
+
case 0:
|
|
3934
|
+
console.log("token in portalSessionCreate", token);
|
|
3935
|
+
return [4 /*yield*/, gqlRequest({
|
|
3936
|
+
query: MUTATION$3,
|
|
3937
|
+
token: token,
|
|
3938
|
+
vars: { tenantCode: tenantCode, expiry: expiry, returnUrl: returnUrl },
|
|
3939
|
+
apiHost: apiHost,
|
|
3940
|
+
})];
|
|
3992
3941
|
case 1:
|
|
3993
3942
|
response = _c.sent();
|
|
3994
3943
|
errors = (response === null || response === void 0 ? void 0 : response.portalSessionCreate).errors;
|
|
@@ -4054,24 +4003,41 @@ var getPriceList = function (_a) {
|
|
|
4054
4003
|
};
|
|
4055
4004
|
|
|
4056
4005
|
function PaymentForms(_a) {
|
|
4057
|
-
var quote = _a.quote,
|
|
4006
|
+
var quote = _a.quote, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, entityId = _a.entityId, accountId = _a.accountId, overrideToken = _a.overrideToken;
|
|
4058
4007
|
var apiHost = React.useContext(BunnyContext).apiHost;
|
|
4059
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: overrideToken ? (jsxRuntime.jsx(PaymentForm, { entityId: entityId, onFail: handlePaymentFail, onPaymentSuccess:
|
|
4008
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: overrideToken ? (jsxRuntime.jsx(PaymentForm, { entityId: entityId, onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSaveSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, graphQLClient: createGraphQLClient(overrideToken, apiHost) })) : null })) : (jsxRuntime.jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
|
|
4060
4009
|
}
|
|
4061
4010
|
function InitialSignupForm(_a) {
|
|
4062
4011
|
var onSubmit = _a.onSubmit, submitting = _a.submitting;
|
|
4063
|
-
var
|
|
4064
|
-
|
|
4065
|
-
|
|
4066
|
-
|
|
4067
|
-
|
|
4068
|
-
}
|
|
4069
|
-
|
|
4012
|
+
var _b = React.useState({
|
|
4013
|
+
firstName: "",
|
|
4014
|
+
lastName: "",
|
|
4015
|
+
email: "",
|
|
4016
|
+
accountName: "",
|
|
4017
|
+
}), formData = _b[0], setFormData = _b[1];
|
|
4018
|
+
var handleInputChange = function (e) {
|
|
4019
|
+
var _a;
|
|
4020
|
+
var _b = e.target, name = _b.name, value = _b.value;
|
|
4021
|
+
setFormData(__assign(__assign({}, formData), (_a = {}, _a[name] = value, _a)));
|
|
4022
|
+
};
|
|
4023
|
+
return (jsxRuntime.jsxs(antd.Form, __assign({ className: "flex flex-col justify-between h-full w-full", onFinish: function () { return onSubmit(formData); } }, { children: [jsxRuntime.jsxs("div", __assign({ className: "flex flex-col space-y-2" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ rules: [{ required: true, message: "Please input your first name!" }], initialValue: formData.firstName }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "First name", value: formData.firstName, onChange: function (e) {
|
|
4024
|
+
handleInputChange(e);
|
|
4025
|
+
setFormData(__assign(__assign({}, formData), { firstName: e.target.value }));
|
|
4026
|
+
} }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ rules: [{ required: true, message: "Please input your last name!" }], initialValue: formData.lastName }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Last name", value: formData.lastName, onChange: function (e) {
|
|
4027
|
+
handleInputChange(e);
|
|
4028
|
+
setFormData(__assign(__assign({}, formData), { lastName: e.target.value }));
|
|
4029
|
+
} }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ rules: [
|
|
4070
4030
|
{ required: true, message: "Please input your email!" },
|
|
4071
4031
|
{ type: "email", message: "Please enter a valid email!" },
|
|
4072
|
-
] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Email"
|
|
4032
|
+
], initialValue: formData.email }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Email", value: formData.email, onChange: function (e) {
|
|
4033
|
+
handleInputChange(e);
|
|
4034
|
+
setFormData(__assign(__assign({}, formData), { email: e.target.value }));
|
|
4035
|
+
} }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ rules: [
|
|
4073
4036
|
{ required: true, message: "Please input your account name!" },
|
|
4074
|
-
] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Account name"
|
|
4037
|
+
], initialValue: formData.accountName }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Account name", value: formData.accountName, onChange: function (e) {
|
|
4038
|
+
handleInputChange(e);
|
|
4039
|
+
setFormData(__assign(__assign({}, formData), { accountName: e.target.value }));
|
|
4040
|
+
} }) }))] })), jsxRuntime.jsx(antd.Form.Item, { children: jsxRuntime.jsx(antd.Button, __assign({ type: "primary", htmlType: "submit", loading: submitting, className: "w-full mt-4" }, { children: "Proceed to payment" })) })] })));
|
|
4075
4041
|
}
|
|
4076
4042
|
|
|
4077
4043
|
var Title = antd.Typography.Title, Text$6 = antd.Typography.Text;
|
|
@@ -4085,31 +4051,32 @@ function PriceListDisplay(_a) {
|
|
|
4085
4051
|
var priceListData = _a.priceListData, topNavImageUrl = _a.topNavImageUrl;
|
|
4086
4052
|
if (!priceListData)
|
|
4087
4053
|
return null;
|
|
4088
|
-
|
|
4089
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", __assign({ className: "flex flex-col justify-between h-full my-12" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex flex-col space-y-8" }, { children: [jsxRuntime.jsx(antd.Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false }), jsxRuntime.jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxRuntime.jsx(Text$5, __assign({ className: "text-slate-500 font-bold text-lg" }, { children: priceListData.name })), jsxRuntime.jsxs(Text$5, __assign({ className: "font-bold text-xl" }, { children: [common.formatCurrency(priceListData.basePrice, priceListData.currencyId), " ", "/ month"] }))] })), priceListData.trialAllowed ? (jsxRuntime.jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxRuntime.jsxs(Text$5, __assign({ style: { fontSize: "16px" }, className: "text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$5, __assign({ className: "text-slate-500", style: { fontSize: "12px" } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })) })) }));
|
|
4054
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", __assign({ className: "flex flex-col justify-between h-full my-12" }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex flex-col space-y-8" }, { children: [jsxRuntime.jsx(antd.Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false }), jsxRuntime.jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxRuntime.jsx(Text$5, __assign({ className: "text-slate-500 font-bold text-lg" }, { children: priceListData.name })), jsxRuntime.jsxs(Text$5, __assign({ className: "font-bold text-xl" }, { children: [common.formatCurrency(priceListData.basePrice, priceListData.currencyId), " ", "/ month"] }))] })), jsxRuntime.jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxRuntime.jsxs(Text$5, __assign({ style: { fontSize: "16px" }, className: "text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$5, __assign({ className: "text-slate-500", style: { fontSize: "12px" } }, { children: "You will not be charged until the last day of the trial." }))] }))] })) })) }));
|
|
4090
4055
|
}
|
|
4091
4056
|
|
|
4092
4057
|
var showErrorNotification = common.useErrorNotification();
|
|
4093
4058
|
function Signup(_a) {
|
|
4094
|
-
var companyName = _a.companyName, entityId = _a.entityId, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, className = _a.className, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, style = _a.style;
|
|
4059
|
+
var apiToken = _a.apiToken, companyName = _a.companyName, entityId = _a.entityId, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, className = _a.className, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, style = _a.style;
|
|
4095
4060
|
// Hooks
|
|
4096
4061
|
var _d = React.useContext(BunnyContext), apiHost = _d.apiHost, graphQLClient = _d.graphQLClient;
|
|
4097
|
-
var token = useToken();
|
|
4098
4062
|
var isMobile = common.useIsMobile();
|
|
4099
4063
|
var topNavImageUrl = React.useContext(BrandContext).topNavImageUrl;
|
|
4100
|
-
console.log("topNavImageUrl in signup", topNavImageUrl);
|
|
4101
4064
|
var _e = React.useState(undefined), quote = _e[0], setQuote = _e[1];
|
|
4102
4065
|
var _f = React.useState(undefined), accountId = _f[0], setAccountId = _f[1];
|
|
4103
|
-
var _g = React.useState(undefined),
|
|
4104
|
-
var _h = React.useState(
|
|
4105
|
-
var _j = React.useState(
|
|
4106
|
-
var _k = React.useState(
|
|
4107
|
-
var
|
|
4066
|
+
var _g = React.useState(undefined), quoteId = _g[0], setQuoteId = _g[1];
|
|
4067
|
+
var _h = React.useState(undefined), portalSessionToken = _h[0], setPortalSessionToken = _h[1];
|
|
4068
|
+
var _j = React.useState(undefined), formData = _j[0], setFormData = _j[1];
|
|
4069
|
+
var _k = React.useState(false), proceedingToPayment = _k[0], setProceedingToPayment = _k[1];
|
|
4070
|
+
var _l = React.useState(false), purchaseSucceeded = _l[0], setPurchaseSucceeded = _l[1];
|
|
4071
|
+
var _m = React.useState(undefined), paymentMethodGraphQLClient = _m[0], setPaymentMethodGraphQLClient = _m[1];
|
|
4072
|
+
var paymentMethod = usePaymentMethod(paymentMethodGraphQLClient || graphQLClient, accountId).data;
|
|
4108
4073
|
var queryClient = reactQuery.useQueryClient();
|
|
4109
4074
|
// Queries
|
|
4110
4075
|
var priceListData = reactQuery.useQuery({
|
|
4111
4076
|
queryKey: ["priceList", priceListCode],
|
|
4112
|
-
queryFn: function () {
|
|
4077
|
+
queryFn: function () {
|
|
4078
|
+
return getPriceList({ token: apiToken, apiHost: apiHost, code: priceListCode });
|
|
4079
|
+
},
|
|
4113
4080
|
}).data;
|
|
4114
4081
|
function handleSubmit(formData) {
|
|
4115
4082
|
return __awaiter(this, void 0, void 0, function () {
|
|
@@ -4119,8 +4086,9 @@ function Signup(_a) {
|
|
|
4119
4086
|
case 0:
|
|
4120
4087
|
_a.trys.push([0, 3, , 4]);
|
|
4121
4088
|
setProceedingToPayment(true);
|
|
4089
|
+
setFormData(formData);
|
|
4122
4090
|
return [4 /*yield*/, quoteAccountSignup({
|
|
4123
|
-
token:
|
|
4091
|
+
token: apiToken,
|
|
4124
4092
|
apiHost: apiHost,
|
|
4125
4093
|
entityId: entityId,
|
|
4126
4094
|
priceListCode: priceListCode,
|
|
@@ -4134,8 +4102,9 @@ function Signup(_a) {
|
|
|
4134
4102
|
case 1:
|
|
4135
4103
|
data = _a.sent();
|
|
4136
4104
|
setAccountId(data.account.id);
|
|
4105
|
+
console.log("apiToken", apiToken);
|
|
4137
4106
|
return [4 /*yield*/, portalSessionCreate({
|
|
4138
|
-
token:
|
|
4107
|
+
token: apiToken,
|
|
4139
4108
|
apiHost: apiHost,
|
|
4140
4109
|
tenantCode: data.tenant.code,
|
|
4141
4110
|
expiry: 24,
|
|
@@ -4150,8 +4119,12 @@ function Signup(_a) {
|
|
|
4150
4119
|
queryClient.invalidateQueries({
|
|
4151
4120
|
queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey,
|
|
4152
4121
|
});
|
|
4122
|
+
setQuoteId(data.quote.id);
|
|
4153
4123
|
setProceedingToPayment(false);
|
|
4154
|
-
setQuote(
|
|
4124
|
+
setQuote({
|
|
4125
|
+
amountDue: data.quote.amountDue,
|
|
4126
|
+
currencyId: data.quote.currencyId,
|
|
4127
|
+
});
|
|
4155
4128
|
return [3 /*break*/, 4];
|
|
4156
4129
|
case 3:
|
|
4157
4130
|
error_1 = _a.sent();
|
|
@@ -4163,39 +4136,39 @@ function Signup(_a) {
|
|
|
4163
4136
|
});
|
|
4164
4137
|
});
|
|
4165
4138
|
}
|
|
4166
|
-
function
|
|
4167
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
4168
|
-
return __generator(this, function (_a) {
|
|
4169
|
-
setPurchaseSucceeded(true);
|
|
4170
|
-
return [2 /*return*/];
|
|
4171
|
-
});
|
|
4172
|
-
});
|
|
4173
|
-
}
|
|
4174
|
-
function accountSignupFunction(plugin) {
|
|
4139
|
+
function handlePaymentSaveSuccess() {
|
|
4175
4140
|
return __awaiter(this, void 0, void 0, function () {
|
|
4141
|
+
var plugin;
|
|
4176
4142
|
return __generator(this, function (_a) {
|
|
4177
4143
|
switch (_a.label) {
|
|
4178
4144
|
case 0:
|
|
4179
|
-
if (!
|
|
4180
|
-
throw new Error("
|
|
4145
|
+
if (!formData) {
|
|
4146
|
+
throw new Error("Form data is required");
|
|
4147
|
+
}
|
|
4148
|
+
plugin = { id: "" };
|
|
4149
|
+
if (!(plugin === null || plugin === void 0 ? void 0 : plugin.id)) {
|
|
4150
|
+
throw new Error("Plugin ID is required");
|
|
4181
4151
|
}
|
|
4182
4152
|
if (!accountId) {
|
|
4183
4153
|
throw new Error("Account ID is required");
|
|
4184
4154
|
}
|
|
4185
|
-
if (!
|
|
4186
|
-
throw new Error("
|
|
4155
|
+
if (!portalSessionToken) {
|
|
4156
|
+
throw new Error("Portal session token is required");
|
|
4187
4157
|
}
|
|
4188
4158
|
return [4 /*yield*/, accountSignup({
|
|
4189
4159
|
token: portalSessionToken,
|
|
4190
4160
|
apiHost: apiHost,
|
|
4191
4161
|
entityId: entityId,
|
|
4192
|
-
quoteId:
|
|
4162
|
+
quoteId: quoteId,
|
|
4193
4163
|
paymentMethodId: paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id,
|
|
4194
|
-
pluginId: plugin
|
|
4164
|
+
pluginId: plugin.id.toString(),
|
|
4195
4165
|
priceListCode: priceListCode,
|
|
4196
4166
|
accountId: accountId,
|
|
4197
4167
|
})];
|
|
4198
|
-
case 1:
|
|
4168
|
+
case 1:
|
|
4169
|
+
_a.sent();
|
|
4170
|
+
setPurchaseSucceeded(true);
|
|
4171
|
+
return [2 /*return*/];
|
|
4199
4172
|
}
|
|
4200
4173
|
});
|
|
4201
4174
|
});
|
|
@@ -4209,7 +4182,7 @@ function Signup(_a) {
|
|
|
4209
4182
|
};
|
|
4210
4183
|
return (jsxRuntime.jsx(WrapperComponent, __assign({ className: "p-4 flex flex-col ".concat(shadow, " ").concat(className), style: style }, { children: purchaseSucceeded ? (jsxRuntime.jsx(PaymentSuccessDisplay, { amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, className: "w-full", companyName: companyName, returnUrl: returnUrl })) : (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex flex-col ".concat(isMobile ? "items-center" : "w-1/2 items-center") }, { children: jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "h-full" : "my-4") }, { children: jsxRuntime.jsx(antd.Divider, { className: "h-full", type: isMobile ? undefined : "vertical" }) })), jsxRuntime.jsx("div", __assign({ className: "flex ".concat(isMobile
|
|
4211
4184
|
? "items-center justify-center my-12"
|
|
4212
|
-
: "w-1/2 items-center justify-center my-12") }, { children: jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2") }, { children: jsxRuntime.jsx(PaymentForms, { entityId: entityId, quote: quote,
|
|
4185
|
+
: "w-1/2 items-center justify-center my-12") }, { children: jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2") }, { children: jsxRuntime.jsx(PaymentForms, { entityId: entityId, quote: quote, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId, overrideToken: portalSessionToken }) })) }))] }))) })));
|
|
4213
4186
|
}
|
|
4214
4187
|
|
|
4215
4188
|
// WARNING: There is a preview button on APP that will need to be changed if this query is changed
|
|
@@ -4638,9 +4611,8 @@ var SubscriptionCardActions = function (_a) {
|
|
|
4638
4611
|
var _b, _c;
|
|
4639
4612
|
var planChangeOptions = _a.planChangeOptions, subscription = _a.subscription, setEditingQuoteData = _a.setEditingQuoteData, setPayModalVisible = _a.setPayModalVisible;
|
|
4640
4613
|
// Context
|
|
4641
|
-
var
|
|
4642
|
-
var
|
|
4643
|
-
var _d = React.useContext(SubscriptionsContext), onChangePlanClick = _d.onChangePlanClick, onClickUpgrade = _d.onClickUpgrade, isTempViewOnly = _d.isTempViewOnly;
|
|
4614
|
+
var _d = React.useContext(BunnyContext), token = _d.token, apiHost = _d.apiHost;
|
|
4615
|
+
var _e = React.useContext(SubscriptionsContext), onChangePlanClick = _e.onChangePlanClick, onClickUpgrade = _e.onClickUpgrade, isTempViewOnly = _e.isTempViewOnly;
|
|
4644
4616
|
// Hooks
|
|
4645
4617
|
common.useSuccessNotification();
|
|
4646
4618
|
// const cancelSubscription = useCancelSubscription();
|
|
@@ -4828,8 +4800,7 @@ var SubscriptionCardDesktop = function (_a) {
|
|
|
4828
4800
|
var SubscriptionCardDesktopRow = function (_a) {
|
|
4829
4801
|
var charge = _a.charge, chargeIndex = _a.chargeIndex, subscription = _a.subscription;
|
|
4830
4802
|
// Context
|
|
4831
|
-
var
|
|
4832
|
-
var token = useToken();
|
|
4803
|
+
var _b = React.useContext(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
4833
4804
|
// Derived state
|
|
4834
4805
|
var isRamp = charge.isRamp;
|
|
4835
4806
|
var prevCharge = subscription.charges[chargeIndex - 1];
|
|
@@ -4950,8 +4921,7 @@ var SubscriptionsNavigation = function (_a) {
|
|
|
4950
4921
|
var Subscriptions = function (_a) {
|
|
4951
4922
|
var companyName = _a.companyName, entityId = _a.entityId, gap = _a.gap, shadow = _a.shadow, _b = _a.showTitle, showTitle = _b === void 0 ? true : _b, className = _a.className;
|
|
4952
4923
|
// Context
|
|
4953
|
-
var _c = React.useContext(BunnyContext), apiHost = _c.apiHost, onTokenExpired = _c.onTokenExpired;
|
|
4954
|
-
var token = useToken();
|
|
4924
|
+
var _c = React.useContext(BunnyContext), token = _c.token, apiHost = _c.apiHost, onTokenExpired = _c.onTokenExpired;
|
|
4955
4925
|
// Recoil state
|
|
4956
4926
|
// const [updatingChargeQuantityId, setUpdatingChargeQuantityId] =
|
|
4957
4927
|
// useRecoilState(updatingChargeQuantityIdState);
|
|
@@ -8229,53 +8199,39 @@ var getAccount = function (_a) {
|
|
|
8229
8199
|
};
|
|
8230
8200
|
|
|
8231
8201
|
var BillingDetails = function (_a) {
|
|
8232
|
-
var entityId = _a.entityId, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, className = _a.className
|
|
8233
|
-
var _d = React.useContext(BunnyContext), apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired, graphQLClient = _d.graphQLClient;
|
|
8234
|
-
var token = useToken();
|
|
8202
|
+
var entityId = _a.entityId, accountId = _a.accountId, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, className = _a.className;
|
|
8203
|
+
var _d = React.useContext(BunnyContext), token = _d.token, apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired, graphQLClient = _d.graphQLClient;
|
|
8235
8204
|
// Hooks
|
|
8236
8205
|
var isMobile = common.useIsMobile();
|
|
8237
8206
|
var queryClient = reactQuery.useQueryClient();
|
|
8207
|
+
var form = antd.Form.useForm()[0];
|
|
8208
|
+
var _e = React.useState(false), isFormEdited = _e[0], setIsFormEdited = _e[1];
|
|
8238
8209
|
var showSuccessNotification = common.useSuccessNotification();
|
|
8239
8210
|
var showErrorNotification = common.useErrorNotification();
|
|
8240
8211
|
var handleAllErrorFormats = common.useAllErrorFormats(onTokenExpired);
|
|
8241
|
-
var paymentMethod = usePaymentMethod(graphQLClient).data;
|
|
8242
|
-
// State
|
|
8243
|
-
var form = antd.Form.useForm()[0];
|
|
8244
|
-
var _e = React.useState(false), isFormEdited = _e[0], setIsFormEdited = _e[1];
|
|
8245
|
-
var _f = React.useState(accountIdProp), accountId = _f[0], setAccountId = _f[1];
|
|
8246
|
-
var filteredCountryList = React.useMemo(function () {
|
|
8247
|
-
return countryListFilter
|
|
8248
|
-
? common.Lists.COUNTRY_LIST.filter(countryListFilter)
|
|
8249
|
-
: common.Lists.COUNTRY_LIST;
|
|
8250
|
-
}, [countryListFilter]);
|
|
8251
8212
|
// Queries
|
|
8252
|
-
var
|
|
8213
|
+
var _f = reactQuery.useQuery({
|
|
8253
8214
|
queryKey: ["account", accountId],
|
|
8254
8215
|
queryFn: function () { return getAccount({ token: token, apiHost: apiHost, id: accountId }); },
|
|
8255
|
-
|
|
8256
|
-
|
|
8257
|
-
var _h = reactQuery.useMutation({
|
|
8216
|
+
}), account = _f.data, isLoadingAccount = _f.isLoading;
|
|
8217
|
+
var _g = reactQuery.useMutation({
|
|
8258
8218
|
mutationFn: function (changedFormData) { return __awaiter(void 0, void 0, void 0, function () {
|
|
8259
8219
|
var account;
|
|
8260
8220
|
return __generator(this, function (_a) {
|
|
8261
8221
|
switch (_a.label) {
|
|
8262
|
-
case 0:
|
|
8263
|
-
|
|
8264
|
-
|
|
8265
|
-
|
|
8266
|
-
|
|
8267
|
-
|
|
8268
|
-
|
|
8269
|
-
|
|
8270
|
-
|
|
8271
|
-
|
|
8272
|
-
|
|
8273
|
-
|
|
8274
|
-
|
|
8275
|
-
},
|
|
8276
|
-
token: token,
|
|
8277
|
-
apiHost: apiHost,
|
|
8278
|
-
})];
|
|
8222
|
+
case 0: return [4 /*yield*/, accountUpdate({
|
|
8223
|
+
accountId: accountId,
|
|
8224
|
+
attributes: {
|
|
8225
|
+
name: changedFormData.name,
|
|
8226
|
+
billingStreet: changedFormData.billingStreet,
|
|
8227
|
+
billingCity: changedFormData.billingCity,
|
|
8228
|
+
billingZip: changedFormData.billingZip,
|
|
8229
|
+
billingState: changedFormData.billingState,
|
|
8230
|
+
billingCountry: changedFormData.billingCountry,
|
|
8231
|
+
},
|
|
8232
|
+
token: token,
|
|
8233
|
+
apiHost: apiHost,
|
|
8234
|
+
})];
|
|
8279
8235
|
case 1:
|
|
8280
8236
|
account = _a.sent();
|
|
8281
8237
|
queryClient.setQueryData(["account", accountId], function (old) {
|
|
@@ -8286,17 +8242,11 @@ var BillingDetails = function (_a) {
|
|
|
8286
8242
|
});
|
|
8287
8243
|
}); },
|
|
8288
8244
|
onSuccess: function () {
|
|
8289
|
-
showSuccessNotification("Your account details have been saved");
|
|
8290
8245
|
queryClient.invalidateQueries({
|
|
8291
8246
|
queryKey: ["getTaxationRequiredAccountFields", token],
|
|
8292
8247
|
});
|
|
8293
8248
|
},
|
|
8294
|
-
}), updateAccount =
|
|
8295
|
-
React.useEffect(function () {
|
|
8296
|
-
if (paymentMethod) {
|
|
8297
|
-
setAccountId(paymentMethod.accountId);
|
|
8298
|
-
}
|
|
8299
|
-
}, [paymentMethod]);
|
|
8249
|
+
}), updateAccount = _g.mutate, isUpdatingAccount = _g.isPending;
|
|
8300
8250
|
React.useEffect(function () {
|
|
8301
8251
|
if (account) {
|
|
8302
8252
|
form.setFieldsValue({
|
|
@@ -8313,35 +8263,33 @@ var BillingDetails = function (_a) {
|
|
|
8313
8263
|
showSuccessNotification("Your payment method has been saved");
|
|
8314
8264
|
}, [queryClient]);
|
|
8315
8265
|
var savePaymentPreCondition = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
8266
|
+
var error_1;
|
|
8316
8267
|
return __generator(this, function (_a) {
|
|
8317
|
-
|
|
8318
|
-
|
|
8319
|
-
|
|
8320
|
-
|
|
8321
|
-
|
|
8322
|
-
|
|
8323
|
-
|
|
8324
|
-
|
|
8325
|
-
|
|
8326
|
-
|
|
8327
|
-
|
|
8328
|
-
|
|
8329
|
-
|
|
8330
|
-
|
|
8331
|
-
showErrorNotification("Failed to update account", error_1.message);
|
|
8332
|
-
}
|
|
8333
|
-
else {
|
|
8334
|
-
showErrorNotification("Please fill out all required fields");
|
|
8335
|
-
}
|
|
8336
|
-
return [2 /*return*/, false];
|
|
8337
|
-
case 3:
|
|
8338
|
-
setIsFormEdited(false);
|
|
8339
|
-
return [7 /*endfinally*/];
|
|
8340
|
-
case 4: return [2 /*return*/];
|
|
8268
|
+
switch (_a.label) {
|
|
8269
|
+
case 0:
|
|
8270
|
+
_a.trys.push([0, 3, 4, 5]);
|
|
8271
|
+
return [4 /*yield*/, form.validateFields()];
|
|
8272
|
+
case 1:
|
|
8273
|
+
_a.sent();
|
|
8274
|
+
return [4 /*yield*/, updateAccount(form.getFieldsValue())];
|
|
8275
|
+
case 2:
|
|
8276
|
+
_a.sent();
|
|
8277
|
+
return [2 /*return*/, true];
|
|
8278
|
+
case 3:
|
|
8279
|
+
error_1 = _a.sent();
|
|
8280
|
+
if (error_1 instanceof Error) {
|
|
8281
|
+
showErrorNotification("Failed to update account", error_1.message);
|
|
8341
8282
|
}
|
|
8342
|
-
|
|
8343
|
-
|
|
8344
|
-
|
|
8283
|
+
else {
|
|
8284
|
+
showErrorNotification("Please fill out all required fields");
|
|
8285
|
+
}
|
|
8286
|
+
return [2 /*return*/, false];
|
|
8287
|
+
case 4:
|
|
8288
|
+
setIsFormEdited(false);
|
|
8289
|
+
showSuccessNotification("Your account details have been saved");
|
|
8290
|
+
return [7 /*endfinally*/];
|
|
8291
|
+
case 5: return [2 /*return*/];
|
|
8292
|
+
}
|
|
8345
8293
|
});
|
|
8346
8294
|
}); };
|
|
8347
8295
|
function handleValuesChange(changedValues) {
|
|
@@ -8356,13 +8304,13 @@ var BillingDetails = function (_a) {
|
|
|
8356
8304
|
};
|
|
8357
8305
|
setIsFormEdited(isFormEdited());
|
|
8358
8306
|
}
|
|
8359
|
-
return (jsxRuntime.jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex p-2 my-2 ".concat(isMobile ? "flex-col space-y-4" : "flex-row", " gap-4") }, { children: [jsxRuntime.jsxs("div", __assign({ className: "".concat(isMobile
|
|
8307
|
+
return (jsxRuntime.jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxRuntime.jsxs("div", __assign({ className: "flex p-2 my-2 ".concat(isMobile ? "flex-col space-y-4" : "flex-row", " gap-4") }, { children: [jsxRuntime.jsxs("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2", " px-4") }, { children: [jsxRuntime.jsx(ReactQueryDevtools2, {}), jsxRuntime.jsx(antd.Skeleton, __assign({ loading: isLoadingAccount }, { children: jsxRuntime.jsxs(antd.Form, __assign({ className: "flex flex-col gap-2", form: form, layout: "vertical", disabled: isUpdatingAccount, onValuesChange: function (changedValues) {
|
|
8360
8308
|
handleValuesChange(changedValues);
|
|
8361
8309
|
} }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Account name", name: "name", rules: [
|
|
8362
8310
|
{ required: true, message: "Account name is required" },
|
|
8363
8311
|
] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Street address", name: "billingStreet", rules: [
|
|
8364
8312
|
{ required: true, message: "Street address is required" },
|
|
8365
|
-
] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsxs("div", __assign({ className: "flex gap-4" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: "City is required" }], className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: "Zipcode is required" }], className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) }))] })), jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col pb-2" : "flex-row", " gap-4") }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "State", name: "billingState", className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Country", name: "billingCountry", className: "flex-1", rules: [{ required: true, message: "Country is required" }] }, { children: jsxRuntime.jsx(antd.Select, { options:
|
|
8313
|
+
] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsxs("div", __assign({ className: "flex gap-4" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: "City is required" }], className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: "Zipcode is required" }], className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) }))] })), jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col pb-2" : "flex-row", " gap-4") }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "State", name: "billingState", className: "flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Country", name: "billingCountry", className: "flex-1", rules: [{ required: true, message: "Country is required" }] }, { children: jsxRuntime.jsx(antd.Select, { options: common.Lists.COUNTRY_LIST, placeholder: "Select a country", showSearch: true, filterOption: function (input, option) {
|
|
8366
8314
|
var _a, _b;
|
|
8367
8315
|
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : "")
|
|
8368
8316
|
.toLowerCase()
|
|
@@ -8370,13 +8318,13 @@ var BillingDetails = function (_a) {
|
|
|
8370
8318
|
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b : "")
|
|
8371
8319
|
.toLowerCase()
|
|
8372
8320
|
.includes(input.toLowerCase());
|
|
8373
|
-
} }) }))] })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Email", name: "email" }, { children: jsxRuntime.jsx(antd.Input, { disabled: true
|
|
8321
|
+
} }) }))] })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Email", name: "email" }, { children: jsxRuntime.jsx(antd.Input, { disabled: true }) }))] })) })), jsxRuntime.jsx(antd.Button, __assign({ disabled: !isFormEdited || isUpdatingAccount, className: "w-full mt-4", type: "primary", onClick: function () {
|
|
8374
8322
|
savePaymentPreCondition();
|
|
8375
|
-
} }, { children: "Save" }))] })),
|
|
8376
|
-
|
|
8377
|
-
|
|
8378
|
-
|
|
8379
|
-
|
|
8323
|
+
} }, { children: "Save" }))] })), isMobile ? (jsxRuntime.jsx("div", __assign({ className: "mx-4" }, { children: jsxRuntime.jsx(antd.Divider, {}) }))) : (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(antd.Divider, { className: "h-full", type: "vertical" }) })), jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2 pt-4", " flex justify-center") }, { children: jsxRuntime.jsx(PaymentForm, { entityId: entityId, onFail: function (error) {
|
|
8324
|
+
handleAllErrorFormats(error);
|
|
8325
|
+
}, onSavePaymentMethod: function () {
|
|
8326
|
+
onSuccess();
|
|
8327
|
+
}, graphQLClient: graphQLClient }) }))] })) })));
|
|
8380
8328
|
};
|
|
8381
8329
|
var WrapperComponent = function (_a) {
|
|
8382
8330
|
var children = _a.children, isCardEnabled = _a.isCardEnabled, shadow = _a.shadow, className = _a.className;
|