@bunnyapp/components 1.0.58-beta.0.3 → 1.0.58-beta.0.4
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 +410 -305
- package/dist/cjs/src/components/Checkout/Checkout.d.ts +2 -2
- package/dist/cjs/src/components/Checkout/QuoteCheckout.d.ts +2 -2
- package/dist/cjs/src/components/Invoice/Invoice.d.ts +2 -2
- package/dist/cjs/src/components/LegacyInvoicePDF.d.ts +3 -4
- package/dist/cjs/src/components/PaymentForm/CouponEditor.d.ts +8 -0
- package/dist/cjs/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +1 -1
- package/dist/cjs/src/components/PaymentForm/PaymentMethodSelector.d.ts +1 -1
- package/dist/cjs/src/components/Signup/PriceListDisplay.d.ts +3 -4
- package/dist/cjs/src/components/Signup/Signup.d.ts +5 -5
- package/dist/cjs/src/components/Signup/Signup.stories.d.ts +2 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanManager.d.ts +1 -1
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/PlanPickerCheckoutBar.d.ts +1 -1
- package/dist/cjs/src/components/Subscriptions/Subscriptions.d.ts +3 -5
- package/dist/cjs/src/components/Subscriptions/SubscriptionsContext.d.ts +2 -3
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/HideExpiredToggle.d.ts +2 -1
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/SubscriptionsNavigation.d.ts +1 -1
- package/dist/cjs/src/components/icons/CardIcon.d.ts +3 -1
- package/dist/cjs/src/graphql/mutations/quoteAddCoupon.d.ts +1 -1
- package/dist/cjs/src/graphql/mutations/quoteCompose.d.ts +1 -1
- package/dist/cjs/src/graphql/queries/getFormattedQuote.d.ts +1 -1
- package/dist/cjs/src/graphql/queries/getPriceList.d.ts +1 -1
- package/dist/cjs/src/graphql/queries/getQuote.d.ts +1 -1
- package/dist/esm/index.js +411 -306
- package/dist/esm/src/components/Checkout/Checkout.d.ts +2 -2
- package/dist/esm/src/components/Checkout/QuoteCheckout.d.ts +2 -2
- package/dist/esm/src/components/Invoice/Invoice.d.ts +2 -2
- package/dist/esm/src/components/LegacyInvoicePDF.d.ts +3 -4
- package/dist/esm/src/components/PaymentForm/CouponEditor.d.ts +8 -0
- package/dist/esm/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +1 -1
- package/dist/esm/src/components/PaymentForm/PaymentMethodSelector.d.ts +1 -1
- package/dist/esm/src/components/Signup/PriceListDisplay.d.ts +3 -4
- package/dist/esm/src/components/Signup/Signup.d.ts +5 -5
- package/dist/esm/src/components/Signup/Signup.stories.d.ts +2 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanManager.d.ts +1 -1
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/PlanPickerCheckoutBar.d.ts +1 -1
- package/dist/esm/src/components/Subscriptions/Subscriptions.d.ts +3 -5
- package/dist/esm/src/components/Subscriptions/SubscriptionsContext.d.ts +2 -3
- package/dist/esm/src/components/Subscriptions/subscriptionsList/HideExpiredToggle.d.ts +2 -1
- package/dist/esm/src/components/Subscriptions/subscriptionsList/SubscriptionsNavigation.d.ts +1 -1
- package/dist/esm/src/components/icons/CardIcon.d.ts +3 -1
- package/dist/esm/src/graphql/mutations/quoteAddCoupon.d.ts +1 -1
- package/dist/esm/src/graphql/mutations/quoteCompose.d.ts +1 -1
- package/dist/esm/src/graphql/queries/getFormattedQuote.d.ts +1 -1
- package/dist/esm/src/graphql/queries/getPriceList.d.ts +1 -1
- package/dist/esm/src/graphql/queries/getQuote.d.ts +1 -1
- package/dist/index.d.ts +5 -7
- package/package.json +2 -2
- package/dist/cjs/src/components/Checkout/CouponComponent.d.ts +0 -7
- package/dist/esm/src/components/Checkout/CouponComponent.d.ts +0 -7
package/dist/cjs/index.js
CHANGED
|
@@ -73,7 +73,7 @@ function styleInject(css, ref) {
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
var css_248z = ".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-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-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 --bunny-blue-500: #3b82f6;\n --bunny-blue-200: #bfdbfe;\n --bunny-green-600: #059669;\n --bunny-green-200: #a7f3d0;\n --bunny-red-500: #ef4444;\n --bunny-red-200: #fecaca;\n --bunny-orange-500: #f97316;\n --bunny-orange-200: #fed7aa;\n --bunny-yellow-500: #f59e0b;\n --bunny-yellow-200: #fde68a;\n --bunny-purple-500: #8b5cf6;\n --bunny-purple-200: #ddd6fe;\n --bunny-black: #000000;\n}\n.hidden {\n display: none;\n}\n.bunny-show-on-hover {\n opacity: 0;\n}\n.bunny-show-on-hover-container:hover .bunny-show-on-hover {\n opacity: 1;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\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.bunny-icon-path {\n transition: fill 0.3s;\n}\n.bunny-shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.bunny-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 .bunny-shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .bunny-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.bunny-shadow,\n.bunny-shadow-md {\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.bunny-fixed {\n position: fixed;\n}\n.bunny-absolute {\n position: absolute;\n}\n.bunny-relative {\n position: relative;\n}\n.bunny-sticky {\n position: sticky;\n}\n.bunny-bottom-0 {\n bottom: 0px;\n}\n.bunny-bottom-4 {\n bottom: 1rem;\n}\n.bunny-left-0 {\n left: 0px;\n}\n.bunny-right-0 {\n right: 0px;\n}\n.bunny-top-0 {\n top: 0px;\n}\n.bunny-col-span-full {\n grid-column: 1 / -1;\n}\n.bunny-m-0 {\n margin: 0px;\n}\n.bunny-mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.bunny-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.bunny-my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.bunny-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.bunny-my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.bunny-mb-2 {\n margin-bottom: 0.5rem;\n}\n.bunny-mb-4 {\n margin-bottom: 1rem;\n}\n.bunny-mb-8 {\n margin-bottom: 2rem;\n}\n.bunny-mt-2 {\n margin-top: 0.5rem;\n}\n.bunny-mt-4 {\n margin-top: 1rem;\n}\n.bunny-flex {\n display: flex;\n}\n.bunny-grid {\n display: grid;\n}\n.bunny-contents {\n display: contents;\n}\n.bunny-h-5 {\n height: 1.25rem;\n}\n.bunny-h-8 {\n height: 2rem;\n}\n.bunny-h-full {\n height: 100%;\n}\n.bunny-w-1\\/2 {\n width: 50%;\n}\n.bunny-w-full {\n width: 100%;\n}\n.bunny-flex-1 {\n flex: 1 1 0%;\n}\n.bunny-shrink {\n flex-shrink: 1;\n}\n.bunny-shrink-0 {\n flex-shrink: 0;\n}\n.bunny-grow {\n flex-grow: 1;\n}\n.bunny-cursor-pointer {\n cursor: pointer;\n}\n.bunny-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-items-end {\n align-items: flex-end;\n}\n.bunny-items-center {\n align-items: center;\n}\n.bunny-justify-end {\n justify-content: flex-end;\n}\n.bunny-justify-center {\n justify-content: center;\n}\n.bunny-justify-between {\n justify-content: space-between;\n}\n.bunny-gap-0 {\n gap: 0px;\n}\n.bunny-gap-1 {\n gap: 0.25rem;\n}\n.bunny-gap-2 {\n gap: 0.5rem;\n}\n.bunny-gap-3 {\n gap: 0.75rem;\n}\n.bunny-gap-4 {\n gap: 1rem;\n}\n.bunny-gap-6 {\n gap: 1.5rem;\n}\n.bunny-gap-8 {\n gap: 2rem;\n}\n.bunny-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.bunny-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.bunny-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.bunny-overflow-auto {\n overflow: auto;\n}\n.bunny-overflow-hidden {\n overflow: hidden;\n}\n.bunny-overflow-visible {\n overflow: visible;\n}\n.bunny-whitespace-nowrap {\n white-space: nowrap;\n}\n.bunny-rounded {\n border-radius: 0.25rem;\n}\n.bunny-rounded-full {\n border-radius: 9999px;\n}\n.bunny-rounded-lg {\n border-radius: 0.5rem;\n}\n.bunny-rounded-md {\n border-radius: 0.375rem;\n}\n.bunny-border {\n border-width: 1px;\n}\n.bunny-border-2 {\n border-width: 2px;\n}\n.bunny-border-solid {\n border-style: solid;\n}\n.bunny-border-none {\n border-style: none;\n}\n.bunny-border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.bunny-bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bunny-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bunny-p-0 {\n padding: 0px;\n}\n.bunny-p-1 {\n padding: 0.25rem;\n}\n.bunny-p-2 {\n padding: 0.5rem;\n}\n.bunny-p-4 {\n padding: 1rem;\n}\n.bunny-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.bunny-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.bunny-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.bunny-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.bunny-py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.bunny-py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.bunny-pb-2 {\n padding-bottom: 0.5rem;\n}\n.bunny-pb-4 {\n padding-bottom: 1rem;\n}\n.bunny-pb-6 {\n padding-bottom: 1.5rem;\n}\n.bunny-pb-8 {\n padding-bottom: 2rem;\n}\n.bunny-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pt-12 {\n padding-top: 3rem;\n}\n.bunny-pt-2 {\n padding-top: 0.5rem;\n}\n.bunny-pt-4 {\n padding-top: 1rem;\n}\n.bunny-pt-5 {\n padding-top: 1.25rem;\n}\n.bunny-pt-6 {\n padding-top: 1.5rem;\n}\n.bunny-text-left {\n text-align: left;\n}\n.bunny-text-center {\n text-align: center;\n}\n.bunny-text-right {\n text-align: right;\n}\n.bunny-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.bunny-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.bunny-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.bunny-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.bunny-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.bunny-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.bunny-font-bold {\n font-weight: 700;\n}\n.bunny-font-medium {\n font-weight: 500;\n}\n.bunny-font-normal {\n font-weight: 400;\n}\n.bunny-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.bunny-text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.bunny-text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.bunny-underline {\n text-decoration-line: underline;\n}\n.bunny-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.bunny-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.bunny-transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.bunny-duration-300 {\n transition-duration: 300ms;\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.sticky {\n position: sticky;\n}\n.-top-0\\.5 {\n top: -0.125rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.bottom-4 {\n bottom: 1rem;\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.col-span-full {\n grid-column: 1 / -1;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-0 {\n margin-left: 0px;\n margin-right: 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-2 {\n margin-bottom: 0.5rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.mb-8 {\n margin-bottom: 2rem;\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-12 {\n width: 3rem;\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 {\n flex-shrink: 1;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.flex-grow {\n flex-grow: 1;\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-3 {\n gap: 0.75rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.gap-8 {\n gap: 2rem;\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-lg {\n border-radius: 0.5rem;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-sm {\n border-radius: 0.125rem;\n}\n.border {\n border-width: 1px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-none {\n border-style: none;\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-transparent {\n background-color: transparent;\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.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\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-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / 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-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / 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.transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-200 {\n transition-duration: 200ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.hover\\:bg-gray-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-gray-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n.bunny-invoice-container {\n padding: 0;\n box-sizing: border-box !important;\n line-height: 1.15;\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";
|
|
76
|
+
var css_248z = ".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-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-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 --bunny-blue-500: #3b82f6;\n --bunny-blue-200: #bfdbfe;\n --bunny-green-600: #059669;\n --bunny-green-200: #a7f3d0;\n --bunny-red-500: #ef4444;\n --bunny-red-200: #fecaca;\n --bunny-orange-500: #f97316;\n --bunny-orange-200: #fed7aa;\n --bunny-yellow-500: #f59e0b;\n --bunny-yellow-200: #fde68a;\n --bunny-purple-500: #8b5cf6;\n --bunny-purple-200: #ddd6fe;\n --bunny-black: #000000;\n}\n.hidden {\n display: none;\n}\n.bunny-show-on-hover {\n opacity: 0;\n}\n.bunny-show-on-hover-container:hover .bunny-show-on-hover {\n opacity: 1;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\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.bunny-icon-path {\n transition: fill 0.3s;\n}\n.bunny-shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.bunny-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 .bunny-shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .bunny-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.bunny-shadow,\n.bunny-shadow-md {\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.bunny-fixed {\n position: fixed;\n}\n.bunny-absolute {\n position: absolute;\n}\n.bunny-relative {\n position: relative;\n}\n.bunny-sticky {\n position: sticky;\n}\n.bunny-bottom-0 {\n bottom: 0px;\n}\n.bunny-bottom-4 {\n bottom: 1rem;\n}\n.bunny-left-0 {\n left: 0px;\n}\n.bunny-right-0 {\n right: 0px;\n}\n.bunny-top-0 {\n top: 0px;\n}\n.bunny-col-span-full {\n grid-column: 1 / -1;\n}\n.bunny-m-0 {\n margin: 0px;\n}\n.bunny-mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.bunny-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.bunny-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.bunny-my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.bunny-my-24 {\n margin-top: 6rem;\n margin-bottom: 6rem;\n}\n.bunny-mb-10 {\n margin-bottom: 2.5rem;\n}\n.bunny-mb-2 {\n margin-bottom: 0.5rem;\n}\n.bunny-mb-4 {\n margin-bottom: 1rem;\n}\n.bunny-mb-8 {\n margin-bottom: 2rem;\n}\n.bunny-mt-16 {\n margin-top: 4rem;\n}\n.bunny-mt-2 {\n margin-top: 0.5rem;\n}\n.bunny-mt-4 {\n margin-top: 1rem;\n}\n.bunny-mt-24 {\n margin-top: 6rem;\n}\n.bunny-mb-24 {\n margin-bottom: 6rem;\n}\n.bunny-flex {\n display: flex;\n}\n.bunny-grid {\n display: grid;\n}\n.bunny-contents {\n display: contents;\n}\n.bunny-h-1\\/2 {\n height: 50%;\n}\n.bunny-h-4\\/5 {\n height: 80%;\n}\n.bunny-h-5 {\n height: 1.25rem;\n}\n.bunny-h-8 {\n height: 2rem;\n}\n.bunny-h-full {\n height: 100%;\n}\n.bunny-h-screen {\n height: 100vh;\n}\n.bunny-h-12 {\n height: 3rem;\n}\n.bunny-h-4 {\n height: 1rem;\n}\n.bunny-h-3 {\n height: 0.75rem;\n}\n.bunny-h-3\\/5 {\n height: 60%;\n}\n.bunny-w-1\\/2 {\n width: 50%;\n}\n.bunny-w-3\\/4 {\n width: 75%;\n}\n.bunny-w-3\\/5 {\n width: 60%;\n}\n.bunny-w-full {\n width: 100%;\n}\n.bunny-w-screen {\n width: 100vw;\n}\n.bunny-w-12 {\n width: 3rem;\n}\n.bunny-w-4 {\n width: 1rem;\n}\n.bunny-w-3 {\n width: 0.75rem;\n}\n.bunny-flex-1 {\n flex: 1 1 0%;\n}\n.bunny-shrink {\n flex-shrink: 1;\n}\n.bunny-shrink-0 {\n flex-shrink: 0;\n}\n.bunny-grow {\n flex-grow: 1;\n}\n.bunny-cursor-pointer {\n cursor: pointer;\n}\n.bunny-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-items-start {\n align-items: flex-start;\n}\n.bunny-items-end {\n align-items: flex-end;\n}\n.bunny-items-center {\n align-items: center;\n}\n.bunny-justify-start {\n justify-content: flex-start;\n}\n.bunny-justify-end {\n justify-content: flex-end;\n}\n.bunny-justify-center {\n justify-content: center;\n}\n.bunny-justify-between {\n justify-content: space-between;\n}\n.bunny-gap-0 {\n gap: 0px;\n}\n.bunny-gap-1 {\n gap: 0.25rem;\n}\n.bunny-gap-2 {\n gap: 0.5rem;\n}\n.bunny-gap-3 {\n gap: 0.75rem;\n}\n.bunny-gap-4 {\n gap: 1rem;\n}\n.bunny-gap-6 {\n gap: 1.5rem;\n}\n.bunny-gap-8 {\n gap: 2rem;\n}\n.bunny-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.bunny-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.bunny-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.bunny-overflow-auto {\n overflow: auto;\n}\n.bunny-overflow-hidden {\n overflow: hidden;\n}\n.bunny-overflow-visible {\n overflow: visible;\n}\n.bunny-whitespace-nowrap {\n white-space: nowrap;\n}\n.bunny-rounded {\n border-radius: 0.25rem;\n}\n.bunny-rounded-full {\n border-radius: 9999px;\n}\n.bunny-rounded-lg {\n border-radius: 0.5rem;\n}\n.bunny-rounded-md {\n border-radius: 0.375rem;\n}\n.bunny-border {\n border-width: 1px;\n}\n.bunny-border-2 {\n border-width: 2px;\n}\n.bunny-border-solid {\n border-style: solid;\n}\n.bunny-border-none {\n border-style: none;\n}\n.bunny-border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.bunny-bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bunny-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bunny-p-0 {\n padding: 0px;\n}\n.bunny-p-1 {\n padding: 0.25rem;\n}\n.bunny-p-2 {\n padding: 0.5rem;\n}\n.bunny-p-4 {\n padding: 1rem;\n}\n.bunny-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.bunny-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.bunny-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.bunny-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.bunny-py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.bunny-py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.bunny-pb-2 {\n padding-bottom: 0.5rem;\n}\n.bunny-pb-4 {\n padding-bottom: 1rem;\n}\n.bunny-pb-6 {\n padding-bottom: 1.5rem;\n}\n.bunny-pb-8 {\n padding-bottom: 2rem;\n}\n.bunny-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pr-4 {\n padding-right: 1rem;\n}\n.bunny-pt-12 {\n padding-top: 3rem;\n}\n.bunny-pt-2 {\n padding-top: 0.5rem;\n}\n.bunny-pt-4 {\n padding-top: 1rem;\n}\n.bunny-pt-5 {\n padding-top: 1.25rem;\n}\n.bunny-pt-6 {\n padding-top: 1.5rem;\n}\n.bunny-pt-\\[25vh\\] {\n padding-top: 25vh;\n}\n.bunny-text-left {\n text-align: left;\n}\n.bunny-text-center {\n text-align: center;\n}\n.bunny-text-right {\n text-align: right;\n}\n.bunny-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.bunny-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.bunny-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.bunny-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.bunny-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.bunny-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.bunny-font-bold {\n font-weight: 700;\n}\n.bunny-font-medium {\n font-weight: 500;\n}\n.bunny-font-normal {\n font-weight: 400;\n}\n.bunny-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.bunny-text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.bunny-text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.bunny-underline {\n text-decoration-line: underline;\n}\n.bunny-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.bunny-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.bunny-transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.bunny-duration-300 {\n transition-duration: 300ms;\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.sticky {\n position: sticky;\n}\n.-top-0\\.5 {\n top: -0.125rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.bottom-4 {\n bottom: 1rem;\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.col-span-full {\n grid-column: 1 / -1;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-0 {\n margin-left: 0px;\n margin-right: 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-2 {\n margin-bottom: 0.5rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.mb-8 {\n margin-bottom: 2rem;\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-12 {\n width: 3rem;\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 {\n flex-shrink: 1;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.flex-grow {\n flex-grow: 1;\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-3 {\n gap: 0.75rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.gap-8 {\n gap: 2rem;\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-lg {\n border-radius: 0.5rem;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-sm {\n border-radius: 0.125rem;\n}\n.border {\n border-width: 1px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-none {\n border-style: none;\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-transparent {\n background-color: transparent;\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.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\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-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / 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-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / 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.transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-200 {\n transition-duration: 200ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.hover\\:bg-gray-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-gray-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n.bunny-invoice-container {\n padding: 0;\n box-sizing: border-box !important;\n line-height: 1.15;\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";
|
|
77
77
|
styleInject(css_248z);
|
|
78
78
|
|
|
79
79
|
/******************************************************************************
|
|
@@ -170,7 +170,7 @@ var BrandContext = react.createContext({
|
|
|
170
170
|
topNavImageUrl: common.DEFAULT_TOP_NAV_IMAGE_URL,
|
|
171
171
|
});
|
|
172
172
|
|
|
173
|
-
var MUTATION$
|
|
173
|
+
var MUTATION$a = "\n query entityBranding {\n entityBranding {\n accentColor\n brandColor\n topNavImageUrl\n }\n }\n";
|
|
174
174
|
var getBranding = function (_a) {
|
|
175
175
|
var token = _a.token, apiHost = _a.apiHost;
|
|
176
176
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -178,7 +178,7 @@ var getBranding = function (_a) {
|
|
|
178
178
|
return __generator(this, function (_b) {
|
|
179
179
|
switch (_b.label) {
|
|
180
180
|
case 0: return [4 /*yield*/, common.gqlRequest({
|
|
181
|
-
query: MUTATION$
|
|
181
|
+
query: MUTATION$a,
|
|
182
182
|
token: token,
|
|
183
183
|
apiHost: apiHost,
|
|
184
184
|
})];
|
|
@@ -229,6 +229,7 @@ function ContextualWrapper(_a) {
|
|
|
229
229
|
var branding = reactQuery.useQuery({
|
|
230
230
|
queryKey: common.QueryKeyFactory.default.brandingKey(token),
|
|
231
231
|
queryFn: function () { return getBranding({ token: token, apiHost: apiHost }); },
|
|
232
|
+
staleTime: 1000 * 60 * 5, // 5 minutes
|
|
232
233
|
}).data;
|
|
233
234
|
var isMobile = common.useIsMobile();
|
|
234
235
|
var entityBranding = react.useMemo(function () {
|
|
@@ -375,39 +376,36 @@ var InvoiceQuoteView = function (_a) {
|
|
|
375
376
|
};
|
|
376
377
|
var templateObject_1$b;
|
|
377
378
|
|
|
378
|
-
var fetchPDF = function (
|
|
379
|
+
var fetchPDF = function (apiHost, documentUuid, documentType, token) { return __awaiter(void 0, void 0, void 0, function () {
|
|
379
380
|
var response;
|
|
380
381
|
return __generator(this, function (_a) {
|
|
381
382
|
switch (_a.label) {
|
|
382
383
|
case 0:
|
|
383
|
-
if (!
|
|
384
|
-
throw new Error(
|
|
384
|
+
if (!documentUuid) {
|
|
385
|
+
throw new Error('Invoice ID is required to fetch PDF');
|
|
385
386
|
}
|
|
386
|
-
return [4 /*yield*/, fetch("".concat(
|
|
387
|
-
method: "GET",
|
|
387
|
+
return [4 /*yield*/, fetch("".concat(apiHost, "/api/legacy_documents/").concat(documentUuid, "?type=").concat(documentType), {
|
|
388
388
|
headers: {
|
|
389
|
-
"Content-type": "application/json; charset=utf-8",
|
|
390
389
|
Authorization: "Bearer ".concat(token),
|
|
391
390
|
},
|
|
392
|
-
// body: JSON.stringify({
|
|
393
|
-
// query: transactionMutation(filter),
|
|
394
|
-
// }),
|
|
395
391
|
})];
|
|
396
392
|
case 1:
|
|
397
393
|
response = _a.sent();
|
|
398
394
|
if (!response.ok)
|
|
399
|
-
throw new Error(
|
|
395
|
+
throw new Error('Failed to fetch PDF');
|
|
400
396
|
return [2 /*return*/, response.blob()]; // Return the PDF as a blob
|
|
401
397
|
}
|
|
402
398
|
});
|
|
403
399
|
}); };
|
|
404
|
-
function
|
|
405
|
-
var
|
|
400
|
+
function LegacyDocument(_a) {
|
|
401
|
+
var documentUuid = _a.documentUuid, documentType = _a.documentType;
|
|
402
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
406
403
|
var _b = react.useState(undefined), pdfUrl = _b[0], setPdfUrl = _b[1];
|
|
404
|
+
var token = useToken();
|
|
407
405
|
var _c = reactQuery.useQuery({
|
|
408
|
-
queryKey: [
|
|
409
|
-
queryFn: function () { return fetchPDF(apiHost
|
|
410
|
-
enabled: Boolean(
|
|
406
|
+
queryKey: ['documentPDF', documentUuid],
|
|
407
|
+
queryFn: function () { return fetchPDF(apiHost, documentUuid, documentType, token); },
|
|
408
|
+
enabled: Boolean(documentUuid),
|
|
411
409
|
}), pdfBlob = _c.data, isLoading = _c.isLoading;
|
|
412
410
|
react.useEffect(function () {
|
|
413
411
|
if (pdfBlob) {
|
|
@@ -419,10 +417,10 @@ function InvoicePDF(_a) {
|
|
|
419
417
|
if (isLoading || !pdfUrl)
|
|
420
418
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
421
419
|
return (jsxRuntime.jsx("iframe", { src: pdfUrl, style: {
|
|
422
|
-
border:
|
|
423
|
-
gridColumn:
|
|
424
|
-
minHeight:
|
|
425
|
-
minWidth:
|
|
420
|
+
border: 'none',
|
|
421
|
+
gridColumn: '1/-1',
|
|
422
|
+
minHeight: '1000px',
|
|
423
|
+
minWidth: '780px',
|
|
426
424
|
}, title: "Invoice PDF", width: "100%" }));
|
|
427
425
|
}
|
|
428
426
|
|
|
@@ -455,6 +453,7 @@ var usePaymentMethod = function (_a) {
|
|
|
455
453
|
token: token,
|
|
456
454
|
}),
|
|
457
455
|
queryFn: function () { return getPaymentMethods({ apiHost: apiHost, token: token, accountId: accountId }); },
|
|
456
|
+
staleTime: 5 * 60 * 1000, // Consider data fresh for 5 minutes
|
|
458
457
|
}), data = _b.data, isLoading = _b.isLoading;
|
|
459
458
|
return {
|
|
460
459
|
paymentMethods: data,
|
|
@@ -471,7 +470,7 @@ var filterPaymentPlugins = function (plugins) {
|
|
|
471
470
|
((_d = (_c = plugin.components) === null || _c === void 0 ? void 0 : _c.frontend) === null || _d === void 0 ? void 0 : _d.length);
|
|
472
471
|
});
|
|
473
472
|
};
|
|
474
|
-
var MUTATION$
|
|
473
|
+
var MUTATION$9 = "{\n paymentPlugins {\n enabled\n entities\n guid\n hidden\n id\n name\n status\n type\n webhookEnabled\n components\n }\n}";
|
|
475
474
|
var getPaymentPlugins = function (_a) {
|
|
476
475
|
var apiHost = _a.apiHost, token = _a.token;
|
|
477
476
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -481,7 +480,7 @@ var getPaymentPlugins = function (_a) {
|
|
|
481
480
|
case 0:
|
|
482
481
|
_b.trys.push([0, 2, , 3]);
|
|
483
482
|
return [4 /*yield*/, common.gqlRequest({
|
|
484
|
-
query: MUTATION$
|
|
483
|
+
query: MUTATION$9,
|
|
485
484
|
token: token,
|
|
486
485
|
apiHost: apiHost,
|
|
487
486
|
})];
|
|
@@ -501,6 +500,7 @@ var usePaymentPlugins = function (_a) {
|
|
|
501
500
|
var _b = reactQuery.useQuery({
|
|
502
501
|
queryKey: ['paymentPlugins', token],
|
|
503
502
|
queryFn: function () { return getPaymentPlugins({ apiHost: apiHost, token: token }); },
|
|
503
|
+
staleTime: 5 * 60 * 1000, // Consider data fresh for 5 minutes
|
|
504
504
|
}), paymentPlugins = _b.data, isFetched = _b.isFetched;
|
|
505
505
|
var filteredPaymentPlugins = filterPaymentPlugins(paymentPlugins);
|
|
506
506
|
var paymentMethodAllowedPlugins = filteredPaymentPlugins === null || filteredPaymentPlugins === void 0 ? void 0 : filteredPaymentPlugins.filter(function (plugin) {
|
|
@@ -517,7 +517,7 @@ var getQuoteAmountDue = function (quote) {
|
|
|
517
517
|
return quote.amountDue;
|
|
518
518
|
};
|
|
519
519
|
|
|
520
|
-
var MUTATION$
|
|
520
|
+
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";
|
|
521
521
|
var checkout = function (_a) {
|
|
522
522
|
var quoteId = _a.quoteId, invoiceId = _a.invoiceId, paymentMethodId = _a.paymentMethodId, paymentMethodData = _a.paymentMethodData, token = _a.token, apiHost = _a.apiHost;
|
|
523
523
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -534,7 +534,7 @@ var checkout = function (_a) {
|
|
|
534
534
|
mutationVars.paymentMethodData = __assign(__assign({}, paymentMethodData), { metadata: paymentMethodData.metadata });
|
|
535
535
|
}
|
|
536
536
|
return [4 /*yield*/, common.gqlRequest({
|
|
537
|
-
query: MUTATION$
|
|
537
|
+
query: MUTATION$8,
|
|
538
538
|
token: token,
|
|
539
539
|
vars: mutationVars,
|
|
540
540
|
apiHost: apiHost,
|
|
@@ -559,14 +559,13 @@ function usePay$1(_a) {
|
|
|
559
559
|
var customCheckoutFunction = react.useContext(PaymentContext).customCheckoutFunction;
|
|
560
560
|
var token = useToken();
|
|
561
561
|
var pay = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
562
|
-
var
|
|
562
|
+
var currencyId, response, response, error_1;
|
|
563
563
|
return __generator(this, function (_a) {
|
|
564
564
|
switch (_a.label) {
|
|
565
565
|
case 0:
|
|
566
|
-
amountDue = quote ? getQuoteAmountDue(quote) : invoice === null || invoice === void 0 ? void 0 : invoice.amountDue;
|
|
567
566
|
currencyId = (quote === null || quote === void 0 ? void 0 : quote.currencyId) || (invoice === null || invoice === void 0 ? void 0 : invoice.currencyId);
|
|
568
|
-
if (!
|
|
569
|
-
throw new Error(
|
|
567
|
+
if (!currencyId) {
|
|
568
|
+
throw new Error('No currencyId');
|
|
570
569
|
}
|
|
571
570
|
_a.label = 1;
|
|
572
571
|
case 1:
|
|
@@ -713,75 +712,6 @@ var CheckoutFooter = function (_a) {
|
|
|
713
712
|
return (jsxRuntime.jsx(ActualCheckoutFooter, { plugin: plugin, invoice: invoice, quote: quote, onPaymentSuccess: onPaymentSuccess, noPadding: noPadding }));
|
|
714
713
|
};
|
|
715
714
|
|
|
716
|
-
// Automatically sets the default payment method if there is none currently set
|
|
717
|
-
var useAutoSetDefaultPaymentMethod = function (_a) {
|
|
718
|
-
var accountId = _a.accountId, token = _a.token, handleSetDefault = _a.handleSetDefault, setDefaultPaymentMethodLoading = _a.setDefaultPaymentMethodLoading, _b = _a.enabled, enabled = _b === void 0 ? true : _b;
|
|
719
|
-
var queryClient = reactQuery.useQueryClient();
|
|
720
|
-
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
721
|
-
var _c = usePaymentMethod({
|
|
722
|
-
accountId: accountId,
|
|
723
|
-
token: token,
|
|
724
|
-
apiHost: apiHost,
|
|
725
|
-
}), storedPaymentMethods = _c.paymentMethods, defaultPaymentMethod = _c.defaultPaymentMethod;
|
|
726
|
-
// Set the default payment method on the cache. Prevents 'handleSetDefault' from being called too many times.
|
|
727
|
-
function setDefaultPaymentMethodOnCache(targetPaymentMethod) {
|
|
728
|
-
var cachedPaymentMethods = queryClient.getQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey({
|
|
729
|
-
accountId: accountId,
|
|
730
|
-
token: token,
|
|
731
|
-
}));
|
|
732
|
-
if (cachedPaymentMethods) {
|
|
733
|
-
for (var _i = 0, _a = cachedPaymentMethods; _i < _a.length; _i++) {
|
|
734
|
-
var paymentMethod = _a[_i];
|
|
735
|
-
paymentMethod.isDefault = paymentMethod.id === targetPaymentMethod.id;
|
|
736
|
-
}
|
|
737
|
-
queryClient.setQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey({
|
|
738
|
-
accountId: accountId,
|
|
739
|
-
token: token,
|
|
740
|
-
}), cachedPaymentMethods);
|
|
741
|
-
}
|
|
742
|
-
}
|
|
743
|
-
react.useEffect(function () {
|
|
744
|
-
if (setDefaultPaymentMethodLoading || !enabled)
|
|
745
|
-
return;
|
|
746
|
-
if ((storedPaymentMethods === null || storedPaymentMethods === void 0 ? void 0 : storedPaymentMethods.length) > 0 && !defaultPaymentMethod) {
|
|
747
|
-
handleSetDefault(storedPaymentMethods[0]);
|
|
748
|
-
setDefaultPaymentMethodOnCache(storedPaymentMethods[0]);
|
|
749
|
-
}
|
|
750
|
-
}, [
|
|
751
|
-
storedPaymentMethods,
|
|
752
|
-
defaultPaymentMethod,
|
|
753
|
-
handleSetDefault,
|
|
754
|
-
setDefaultPaymentMethodLoading,
|
|
755
|
-
queryClient,
|
|
756
|
-
accountId,
|
|
757
|
-
token,
|
|
758
|
-
]);
|
|
759
|
-
};
|
|
760
|
-
|
|
761
|
-
var usePaymentMethodSelectorPlugin = function (_a) {
|
|
762
|
-
var defaultPaymentMethod = _a.defaultPaymentMethod, defaultPaymentMethodPlugin = _a.defaultPaymentMethodPlugin, paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins;
|
|
763
|
-
var _b = react.useState(), selectorPaymentMethodPlugin = _b[0], setSelectorPaymentMethodPlugin = _b[1];
|
|
764
|
-
react.useEffect(function () {
|
|
765
|
-
if (selectorPaymentMethodPlugin) {
|
|
766
|
-
return;
|
|
767
|
-
}
|
|
768
|
-
if (defaultPaymentMethod) {
|
|
769
|
-
setSelectorPaymentMethodPlugin(defaultPaymentMethodPlugin);
|
|
770
|
-
}
|
|
771
|
-
else {
|
|
772
|
-
setSelectorPaymentMethodPlugin(paymentMethodAllowedPlugins === null || paymentMethodAllowedPlugins === void 0 ? void 0 : paymentMethodAllowedPlugins[0]);
|
|
773
|
-
}
|
|
774
|
-
}, [
|
|
775
|
-
defaultPaymentMethod,
|
|
776
|
-
defaultPaymentMethodPlugin,
|
|
777
|
-
paymentMethodAllowedPlugins,
|
|
778
|
-
]);
|
|
779
|
-
return {
|
|
780
|
-
selectorPaymentMethodPlugin: selectorPaymentMethodPlugin,
|
|
781
|
-
setSelectorPaymentMethodPlugin: setSelectorPaymentMethodPlugin,
|
|
782
|
-
};
|
|
783
|
-
};
|
|
784
|
-
|
|
785
715
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
786
716
|
|
|
787
717
|
function getDefaultExportFromCjs (x) {
|
|
@@ -18103,7 +18033,7 @@ var Visa = function (_a) {
|
|
|
18103
18033
|
return (jsxRuntime.jsxs("svg", __assign({ className: className, width: "70", height: "48", viewBox: "0 0 70 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsx("rect", { x: "0.5", y: "0.5", width: "69", height: "47", rx: "5.5", fill: "white", stroke: "#D9D9D9" }), jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21.2505 32.5165H17.0099L13.8299 20.3847C13.679 19.8267 13.3585 19.3333 12.8871 19.1008C11.7106 18.5165 10.4142 18.0514 9 17.8169V17.3498H15.8313C16.7742 17.3498 17.4813 18.0514 17.5991 18.8663L19.2491 27.6173L23.4877 17.3498H27.6104L21.2505 32.5165ZM29.9675 32.5165H25.9626L29.2604 17.3498H33.2653L29.9675 32.5165ZM38.4467 21.5514C38.5646 20.7346 39.2717 20.2675 40.0967 20.2675C41.3931 20.1502 42.8052 20.3848 43.9838 20.9671L44.6909 17.7016C43.5123 17.2345 42.216 17 41.0395 17C37.1524 17 34.3239 19.1008 34.3239 22.0165C34.3239 24.2346 36.3274 25.3992 37.7417 26.1008C39.2717 26.8004 39.861 27.2675 39.7431 27.9671C39.7431 29.0165 38.5646 29.4836 37.3881 29.4836C35.9739 29.4836 34.5596 29.1338 33.2653 28.5494L32.5582 31.8169C33.9724 32.3992 35.5025 32.6338 36.9167 32.6338C41.2752 32.749 43.9838 30.6502 43.9838 27.5C43.9838 23.5329 38.4467 23.3004 38.4467 21.5514ZM58 32.5165L54.82 17.3498H51.4044C50.6972 17.3498 49.9901 17.8169 49.7544 18.5165L43.8659 32.5165H47.9887L48.8116 30.3004H53.8772L54.3486 32.5165H58ZM51.9936 21.4342L53.1701 27.1502H49.8723L51.9936 21.4342Z", fill: "#172B85" })] })));
|
|
18104
18034
|
};
|
|
18105
18035
|
|
|
18106
|
-
var Text$
|
|
18036
|
+
var Text$r = antd.Typography.Text;
|
|
18107
18037
|
var MiniCreditCard = function (_a) {
|
|
18108
18038
|
var className = _a.className, buttons = _a.buttons, _b = _a.hideDropdownMenu, hideDropdownMenu = _b === void 0 ? false : _b, _c = _a.hideDefaultTag, hideDefaultTag = _c === void 0 ? false : _c, onClickRemove = _a.onClickRemove, paymentMethodData = _a.paymentMethodData, onClickSetDefault = _a.onClickSetDefault, id = _a.id;
|
|
18109
18039
|
var darkMode = react.useContext(BunnyContext).darkMode;
|
|
@@ -18114,7 +18044,7 @@ var MiniCreditCard = function (_a) {
|
|
|
18114
18044
|
return darkMode ? 'var(--row-background-alternate)' : 'bg-slate-50';
|
|
18115
18045
|
}, [darkMode]);
|
|
18116
18046
|
var isDefault = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.isDefault;
|
|
18117
|
-
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-justify-between bunny-items-center bunny-p-1 bunny-px-3 bunny-border-solid ".concat(backgroundColor, " bunny-").concat(borderColor, " bunny-rounded-md bunny-border ").concat(className), id: id }, { children: paymentMethodData ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-4" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 bunny-space-between bunny-w-full" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Issuer, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Identifier, { paymentMethodData: paymentMethodData }), !hideDefaultTag && (jsxRuntime.jsx("div", { children: isDefault ? (jsxRuntime.jsx(antd.Tag, __assign({ bordered: false, color: "blue" }, { children: "Default" }))) : null }))] })) })), buttons ? (buttons) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: !hideDropdownMenu && (jsxRuntime.jsx(DropdownMenu, { setDefault: onClickSetDefault, remove: onClickRemove, isDefault: isDefault !== null && isDefault !== void 0 ? isDefault : false, id: "credit-card-dropdown-".concat(paymentMethodData.id) })) }))] })) : (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center justify-between w-full" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center" }, { children: [jsxRuntime.jsx(icons.CreditCardOutlined, {}), jsxRuntime.jsx(Text$
|
|
18047
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-justify-between bunny-items-center bunny-p-1 bunny-px-3 bunny-border-solid ".concat(backgroundColor, " bunny-").concat(borderColor, " bunny-rounded-md bunny-border ").concat(className), id: id }, { children: paymentMethodData ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-4" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 bunny-space-between bunny-w-full" }, { children: [jsxRuntime.jsx(CardImage, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Issuer, { paymentMethodData: paymentMethodData }), jsxRuntime.jsx(Identifier, { paymentMethodData: paymentMethodData }), !hideDefaultTag && (jsxRuntime.jsx("div", { children: isDefault ? (jsxRuntime.jsx(antd.Tag, __assign({ bordered: false, color: "blue" }, { children: "Default" }))) : null }))] })) })), buttons ? (buttons) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: !hideDropdownMenu && (jsxRuntime.jsx(DropdownMenu, { setDefault: onClickSetDefault, remove: onClickRemove, isDefault: isDefault !== null && isDefault !== void 0 ? isDefault : false, id: "credit-card-dropdown-".concat(paymentMethodData.id) })) }))] })) : (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center justify-between w-full" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center" }, { children: [jsxRuntime.jsx(icons.CreditCardOutlined, {}), jsxRuntime.jsx(Text$r, __assign({ className: "bunny-text-slate-400", style: { fontSize: '12px' } }, { children: "No payment methods" }))] })), jsxRuntime.jsx(antd.Button, { disabled: true, type: "link" }), buttons] }))) })));
|
|
18118
18048
|
};
|
|
18119
18049
|
var Identifier = function (_a) {
|
|
18120
18050
|
var _b, _c, _d;
|
|
@@ -18123,9 +18053,9 @@ var Identifier = function (_a) {
|
|
|
18123
18053
|
return null;
|
|
18124
18054
|
}
|
|
18125
18055
|
if (((_c = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _c === void 0 ? void 0 : _c.type) === 'cashapp') {
|
|
18126
|
-
return jsxRuntime.jsx(Text$
|
|
18056
|
+
return jsxRuntime.jsx(Text$r, { children: "Cashapp" });
|
|
18127
18057
|
}
|
|
18128
|
-
return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Text$
|
|
18058
|
+
return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Text$r, __assign({ className: "relative -top-0.5" }, { children: "****" })), jsxRuntime.jsx(Text$r, { children: (_d = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _d === void 0 ? void 0 : _d.identifier })] }));
|
|
18129
18059
|
};
|
|
18130
18060
|
var Issuer = function (_a) {
|
|
18131
18061
|
var _b;
|
|
@@ -18134,7 +18064,7 @@ var Issuer = function (_a) {
|
|
|
18134
18064
|
var issuer = (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.issuer;
|
|
18135
18065
|
if (issuer.length == 0 || list.includes(issuer.toLowerCase()))
|
|
18136
18066
|
return null;
|
|
18137
|
-
return jsxRuntime.jsx(Text$
|
|
18067
|
+
return jsxRuntime.jsx(Text$r, { children: lodashExports.capitalize(issuer) });
|
|
18138
18068
|
};
|
|
18139
18069
|
var DropdownMenu = function (_a) {
|
|
18140
18070
|
var setDefault = _a.setDefault, remove = _a.remove, isDefault = _a.isDefault, id = _a.id;
|
|
@@ -18195,6 +18125,75 @@ var CardImage = function (_a) {
|
|
|
18195
18125
|
}
|
|
18196
18126
|
};
|
|
18197
18127
|
|
|
18128
|
+
// Automatically sets the default payment method if there is none currently set
|
|
18129
|
+
var useAutoSetDefaultPaymentMethod = function (_a) {
|
|
18130
|
+
var accountId = _a.accountId, token = _a.token, handleSetDefault = _a.handleSetDefault, setDefaultPaymentMethodLoading = _a.setDefaultPaymentMethodLoading, _b = _a.enabled, enabled = _b === void 0 ? true : _b;
|
|
18131
|
+
var queryClient = reactQuery.useQueryClient();
|
|
18132
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
18133
|
+
var _c = usePaymentMethod({
|
|
18134
|
+
accountId: accountId,
|
|
18135
|
+
token: token,
|
|
18136
|
+
apiHost: apiHost,
|
|
18137
|
+
}), storedPaymentMethods = _c.paymentMethods, defaultPaymentMethod = _c.defaultPaymentMethod;
|
|
18138
|
+
// Set the default payment method on the cache. Prevents 'handleSetDefault' from being called too many times.
|
|
18139
|
+
function setDefaultPaymentMethodOnCache(targetPaymentMethod) {
|
|
18140
|
+
var cachedPaymentMethods = queryClient.getQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey({
|
|
18141
|
+
accountId: accountId,
|
|
18142
|
+
token: token,
|
|
18143
|
+
}));
|
|
18144
|
+
if (cachedPaymentMethods) {
|
|
18145
|
+
for (var _i = 0, _a = cachedPaymentMethods; _i < _a.length; _i++) {
|
|
18146
|
+
var paymentMethod = _a[_i];
|
|
18147
|
+
paymentMethod.isDefault = paymentMethod.id === targetPaymentMethod.id;
|
|
18148
|
+
}
|
|
18149
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.accountPaymentMethodKey({
|
|
18150
|
+
accountId: accountId,
|
|
18151
|
+
token: token,
|
|
18152
|
+
}), cachedPaymentMethods);
|
|
18153
|
+
}
|
|
18154
|
+
}
|
|
18155
|
+
react.useEffect(function () {
|
|
18156
|
+
if (setDefaultPaymentMethodLoading || !enabled)
|
|
18157
|
+
return;
|
|
18158
|
+
if ((storedPaymentMethods === null || storedPaymentMethods === void 0 ? void 0 : storedPaymentMethods.length) > 0 && !defaultPaymentMethod) {
|
|
18159
|
+
handleSetDefault(storedPaymentMethods[0]);
|
|
18160
|
+
setDefaultPaymentMethodOnCache(storedPaymentMethods[0]);
|
|
18161
|
+
}
|
|
18162
|
+
}, [
|
|
18163
|
+
storedPaymentMethods,
|
|
18164
|
+
defaultPaymentMethod,
|
|
18165
|
+
handleSetDefault,
|
|
18166
|
+
setDefaultPaymentMethodLoading,
|
|
18167
|
+
queryClient,
|
|
18168
|
+
accountId,
|
|
18169
|
+
token,
|
|
18170
|
+
]);
|
|
18171
|
+
};
|
|
18172
|
+
|
|
18173
|
+
var usePaymentMethodSelectorPlugin = function (_a) {
|
|
18174
|
+
var defaultPaymentMethod = _a.defaultPaymentMethod, defaultPaymentMethodPlugin = _a.defaultPaymentMethodPlugin, paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins;
|
|
18175
|
+
var _b = react.useState(), selectorPaymentMethodPlugin = _b[0], setSelectorPaymentMethodPlugin = _b[1];
|
|
18176
|
+
react.useEffect(function () {
|
|
18177
|
+
if (selectorPaymentMethodPlugin) {
|
|
18178
|
+
return;
|
|
18179
|
+
}
|
|
18180
|
+
if (defaultPaymentMethod) {
|
|
18181
|
+
setSelectorPaymentMethodPlugin(defaultPaymentMethodPlugin);
|
|
18182
|
+
}
|
|
18183
|
+
else {
|
|
18184
|
+
setSelectorPaymentMethodPlugin(paymentMethodAllowedPlugins === null || paymentMethodAllowedPlugins === void 0 ? void 0 : paymentMethodAllowedPlugins[0]);
|
|
18185
|
+
}
|
|
18186
|
+
}, [
|
|
18187
|
+
defaultPaymentMethod,
|
|
18188
|
+
defaultPaymentMethodPlugin,
|
|
18189
|
+
paymentMethodAllowedPlugins,
|
|
18190
|
+
]);
|
|
18191
|
+
return {
|
|
18192
|
+
selectorPaymentMethodPlugin: selectorPaymentMethodPlugin,
|
|
18193
|
+
setSelectorPaymentMethodPlugin: setSelectorPaymentMethodPlugin,
|
|
18194
|
+
};
|
|
18195
|
+
};
|
|
18196
|
+
|
|
18198
18197
|
var SavePaymentMethodFooter = function (_a) {
|
|
18199
18198
|
var isSaving = _a.isSaving, onSave = _a.onSave, noPadding = _a.noPadding;
|
|
18200
18199
|
var isMobile = common.useIsMobile();
|
|
@@ -18356,7 +18355,7 @@ function useSave$1(_a) {
|
|
|
18356
18355
|
return { save: save, isSaving: isSaving };
|
|
18357
18356
|
}
|
|
18358
18357
|
|
|
18359
|
-
var Text$
|
|
18358
|
+
var Text$q = antd.Typography.Text;
|
|
18360
18359
|
var TEST_CARD = '4242424242424242';
|
|
18361
18360
|
var DemoPayForm = function (_a) {
|
|
18362
18361
|
var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
|
|
@@ -18418,7 +18417,7 @@ var DemoPayForm = function (_a) {
|
|
|
18418
18417
|
var onCardCvcChange = function (cvc) {
|
|
18419
18418
|
setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
|
|
18420
18419
|
};
|
|
18421
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsxs(StyledInputs, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsxRuntime.jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-2" }, { children: [jsxRuntime.jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsxRuntime.jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsxRuntime.jsx(Text$
|
|
18420
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsxs(StyledInputs, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsxRuntime.jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-2" }, { children: [jsxRuntime.jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsxRuntime.jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsxRuntime.jsx(Text$q, { children: "DemoPay is for testing only." }), jsxRuntime.jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
|
|
18422
18421
|
};
|
|
18423
18422
|
var StyledInputs = defaultStyled.div(templateObject_1$a || (templateObject_1$a = __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) {
|
|
18424
18423
|
var darkMode = _a.darkMode;
|
|
@@ -18649,11 +18648,12 @@ var PaymentMethodDetails = function (_a) {
|
|
|
18649
18648
|
}
|
|
18650
18649
|
};
|
|
18651
18650
|
|
|
18652
|
-
var CardIcon = function () {
|
|
18653
|
-
|
|
18651
|
+
var CardIcon = function (_a) {
|
|
18652
|
+
var className = _a.className;
|
|
18653
|
+
return (jsxRuntime.jsxs("svg", __assign({ className: className, 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" })] })));
|
|
18654
18654
|
};
|
|
18655
18655
|
|
|
18656
|
-
var Text$
|
|
18656
|
+
var Text$p = antd.Typography.Text;
|
|
18657
18657
|
var PaymentMethodSelector = function (_a) {
|
|
18658
18658
|
var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
|
|
18659
18659
|
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-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)); }) })));
|
|
@@ -18662,11 +18662,11 @@ var PaymentOption = function (_a) {
|
|
|
18662
18662
|
var selected = _a.selected, paymentPlugin = _a.paymentPlugin, onClick = _a.onClick, name = _a.name;
|
|
18663
18663
|
var brandColor = react.useContext(BrandContext).brandColor;
|
|
18664
18664
|
var darkMode = react.useContext(BunnyContext).darkMode;
|
|
18665
|
-
var isAch = name === null || name === void 0 ? void 0 : name.toLowerCase().includes(
|
|
18666
|
-
var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes(
|
|
18667
|
-
return (jsxRuntime.jsxs(PaymentOptionContainer, __assign({ "$brandColor": brandColor, "$selected": selected, className: "bunny-flex bunny-justify-between bunny-items-center bunny-
|
|
18665
|
+
var isAch = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('ach');
|
|
18666
|
+
var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('card');
|
|
18667
|
+
return (jsxRuntime.jsxs(PaymentOptionContainer, __assign({ "$brandColor": brandColor, "$selected": selected, className: "bunny-flex bunny-justify-between bunny-items-center bunny-cursor-pointer bunny-py-2 bunny-rounded bunny-border-solid ".concat(darkMode
|
|
18668
18668
|
? "var(--row-background-dark) border-gray-500"
|
|
18669
|
-
:
|
|
18669
|
+
: 'bunny-bg-slate-50 bunny-border-slate-200', " bunny-border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-2 bunny-items-center bunny-pl-4" }, { children: [jsxRuntime.jsx(antd.Checkbox, { checked: selected, className: darkMode ? 'border-gray-400' : '' }), jsxRuntime.jsx(Text$p, { children: name })] })), isAch ? (jsxRuntime.jsx(icons.BankOutlined, { className: "bunny-pr-4" })) : isCard ? (jsxRuntime.jsx(CardIcon, { className: "bunny-pr-4" })) : (jsxRuntime.jsx(CardIcon, { className: "bunny-pr-4" }))] })));
|
|
18670
18670
|
};
|
|
18671
18671
|
var PaymentOptionContainer = defaultStyled.div(templateObject_1$9 || (templateObject_1$9 = __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) {
|
|
18672
18672
|
var $brandColor = _a.$brandColor, $selected = _a.$selected;
|
|
@@ -18876,7 +18876,7 @@ function StripeWrapper(_a) {
|
|
|
18876
18876
|
}
|
|
18877
18877
|
|
|
18878
18878
|
function Invoice(_a) {
|
|
18879
|
-
var id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onInvoiceDownloadError = _a.onInvoiceDownloadError, onPaymentSuccess = _a.onPaymentSuccess, _b = _a.shadow, shadow = _b === void 0 ?
|
|
18879
|
+
var id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onInvoiceDownloadError = _a.onInvoiceDownloadError, onPaymentSuccess = _a.onPaymentSuccess, _b = _a.shadow, shadow = _b === void 0 ? 'shadow-md' : _b, className = _a.className, _c = _a.hideDownloadButton, hideDownloadButton = _c === void 0 ? false : _c, onInvoiceLoaded = _a.onInvoiceLoaded;
|
|
18880
18880
|
return (jsxRuntime.jsx(InvoiceQuoteContext.Provider, __assign({ value: {
|
|
18881
18881
|
id: id,
|
|
18882
18882
|
invoiceQuoteViewComponent: invoiceQuoteViewComponent,
|
|
@@ -18894,7 +18894,7 @@ function ActualInvoice() {
|
|
|
18894
18894
|
// Context
|
|
18895
18895
|
var queryClient = reactQuery.useQueryClient();
|
|
18896
18896
|
var _a = react.useContext(InvoiceQuoteContext), id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onPaymentSuccess = _a.onPaymentSuccess, className = _a.className;
|
|
18897
|
-
var _b = react.useContext(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
18897
|
+
var _b = react.useContext(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
18898
18898
|
var _c = react.useContext(InvoiceQuoteContext), hideDownloadButton = _c.hideDownloadButton, onInvoiceLoaded = _c.onInvoiceLoaded;
|
|
18899
18899
|
var token = useToken();
|
|
18900
18900
|
// Hooks
|
|
@@ -18906,7 +18906,7 @@ function ActualInvoice() {
|
|
|
18906
18906
|
queryFn: function () { return common.getFormattedInvoice({ id: id, token: token, apiHost: apiHost }); },
|
|
18907
18907
|
}).data;
|
|
18908
18908
|
// Derived state
|
|
18909
|
-
var isInvoicePayable = common.PAYABLE_INVOICE_STATES.includes((formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.state) ||
|
|
18909
|
+
var isInvoicePayable = common.PAYABLE_INVOICE_STATES.includes((formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.state) || '');
|
|
18910
18910
|
// Local state
|
|
18911
18911
|
var isMobile = common.useIsMobile(isInvoicePayable ? common.BreakpointNumbers.lg : undefined);
|
|
18912
18912
|
var onSuccess = function () {
|
|
@@ -18919,7 +18919,7 @@ function ActualInvoice() {
|
|
|
18919
18919
|
token: token,
|
|
18920
18920
|
}),
|
|
18921
18921
|
});
|
|
18922
|
-
showSuccessNotification(
|
|
18922
|
+
showSuccessNotification('Your invoice has been paid', 'Payment successful');
|
|
18923
18923
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess();
|
|
18924
18924
|
};
|
|
18925
18925
|
var onFail = function (error) {
|
|
@@ -18932,10 +18932,10 @@ function ActualInvoice() {
|
|
|
18932
18932
|
}, [formattedInvoice]);
|
|
18933
18933
|
if (!formattedInvoice)
|
|
18934
18934
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
18935
|
-
return (jsxRuntime.jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-6 ".concat(isMobile ?
|
|
18935
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-6 ".concat(isMobile ? 'bunny-flex-col bunny-w-full bunny-overflow-hidden' : '', " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-w-full" }, { children: jsxRuntime.jsx(LegacyDocument, { documentUuid: formattedInvoice.uuid, documentType: "invoice" }) }))) : (invoiceQuoteViewComponent || (jsxRuntime.jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsxRuntime.jsx("div", __assign({ className: "bunny-w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? '' : 'pt-12') }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice }) })))] })) })));
|
|
18936
18936
|
}
|
|
18937
18937
|
|
|
18938
|
-
var MUTATION$
|
|
18938
|
+
var MUTATION$7 = function (id) { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\n object { documents { id filename size date url } }\n billingCity\n billingCountry\n billingState\n billingStreet\n billingZip\n contactName\n currency\n customerBillingCity\n customerBillingCountry\n customerBillingState\n customerBillingStreet\n customerBillingZip\n customerName\n discount\n discountValue\n duration\n endDate\n expiresAt\n html\n formattedLines {\n amount\n amountsByPeriod {\n quantity\n id\n name\n startDate\n endDate\n amount\n amountsByTier {\n id\n tier {\n starts\n ends\n price\n }\n quantity\n amount\n }\n prorationRate\n }\n billingPeriodEnd\n billingPeriodStart\n chargeType\n discount\n frequency\n isRamp\n periods\n planName\n position\n price\n priceDecimals\n priceListChargeId\n priceListChargeName\n priceListId\n priceListName\n priceTiers {\n price\n starts\n }\n pricingModel\n productName\n prorationRate\n quantity\n showProductNameOnLineItem\n taxCode\n trialEndDate\n trialStartDate\n unitOfMeasure\n vatCode\n }\n netPaymentDays\n notes\n number\n poNumberRequired\n salesContactEmail\n sharedAt\n startDate\n state\n subtotal\n taxAmount\n taxNumberLabel\n taxNumberRequired\n vendorName\n }\n }"; };
|
|
18939
18939
|
var getFormattedQuote = function (_a) {
|
|
18940
18940
|
var id = _a.id, token = _a.token, apiHost = _a.apiHost;
|
|
18941
18941
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -18943,7 +18943,7 @@ var getFormattedQuote = function (_a) {
|
|
|
18943
18943
|
return __generator(this, function (_b) {
|
|
18944
18944
|
switch (_b.label) {
|
|
18945
18945
|
case 0: return [4 /*yield*/, common.gqlRequest({
|
|
18946
|
-
query: MUTATION$
|
|
18946
|
+
query: MUTATION$7(),
|
|
18947
18947
|
token: token,
|
|
18948
18948
|
apiHost: apiHost,
|
|
18949
18949
|
vars: { id: id },
|
|
@@ -19215,7 +19215,7 @@ var AcceptQuoteModal = function (_a) {
|
|
|
19215
19215
|
}, open: acceptBoxVisible, title: "Accept quote", width: 400 }, { children: jsxRuntime.jsxs(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", form: form, layout: "vertical" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Your name", name: "name", rules: createRules(true, "Your name") }, { children: jsxRuntime.jsx(antd.Input, { autoFocus: true, ref: firstInputRef }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Your job title", name: "title", rules: createRules(true, "Your job title") }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Purchase order number", name: "poNumber", rules: createRules(poNumberRequired, "Purchase order number") }, { children: jsxRuntime.jsx(antd.Input, {}) })), taxNumberRequired && (jsxRuntime.jsx(antd.Form.Item, __assign({ name: "taxNumber", label: taxNumberLabel, rules: createRules(taxNumberRequired, taxNumberLabel) }, { children: jsxRuntime.jsx(antd.Input, {}) })))] })) })));
|
|
19216
19216
|
};
|
|
19217
19217
|
|
|
19218
|
-
var Text$
|
|
19218
|
+
var Text$o = antd.Typography.Text;
|
|
19219
19219
|
defaultStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
19220
19220
|
function Quote(_a) {
|
|
19221
19221
|
var id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, onInvoiceDownloadError = _a.onInvoiceDownloadError, onPaymentSuccess = _a.onPaymentSuccess, _b = _a.shadow, shadow = _b === void 0 ? 'shadow-md' : _b, className = _a.className, _c = _a.hideDownloadButton, hideDownloadButton = _c === void 0 ? false : _c, onQuoteLoaded = _a.onQuoteLoaded;
|
|
@@ -19284,7 +19284,7 @@ function ActualQuote() {
|
|
|
19284
19284
|
var isAccepted = formattedQuote.state === 'ACCEPTED';
|
|
19285
19285
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 ".concat(isMobile ? 'bunny-w-full bunny-overflow-hidden' : '', " ").concat(className) }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-justify-end bunny-items-center bunny-gap-4", id: "acceptance", style: {
|
|
19286
19286
|
color: entityBranding.secondaryColor,
|
|
19287
|
-
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$
|
|
19287
|
+
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$o, { children: "Quote was accepted by ".concat(formattedQuote.acceptedByName, " on ").concat(common.formatDate(formattedQuote.acceptedAt)) })) : null, (!isMobile || !isAccepted) && (jsxRuntime.jsxs("div", __assign({ className: isMobile ? 'flex w-full justify-end gap-2' : 'flex items-center justify-end gap-2' }, { children: [!isMobile && !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(icons.DownloadOutlined, {}), onClick: function () { return downloadFile(apiHost + '/api/pdf/quote', token); } }, { children: "Download" }))) : null, !isAccepted ? (jsxRuntime.jsx(antd.Button, __assign({ disabled: isExpired || isAccepting, onClick: function () { return startAcceptance(); }, type: "primary" }, { children: isExpired ? 'Quote is expired' : 'Accept quote' }))) : null] })))] })), jsxRuntime.jsx(InvoiceQuoteView, __assign({ html: formattedQuote.html }, { children: ((_b = (_a = formattedQuote.object) === null || _a === void 0 ? void 0 : _a.documents) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: formattedQuote.object.documents.map(function (doc, index) {
|
|
19288
19288
|
return (jsxRuntime.jsx(antd.Button, __assign({ download: doc.filename, href: doc.url, type: "link" }, { children: doc.filename }), index));
|
|
19289
19289
|
}) }))) : null }))] })), jsxRuntime.jsx(AcceptQuoteModal, { acceptBoxVisible: acceptBoxVisible, formattedQuote: formattedQuote, setAcceptBoxVisible: setAcceptBoxVisible, setIsAccepting: setIsAccepting, sendAccept: sendAccept }), jsxRuntime.jsx(PandadocPollingModal, { isVisible: pandadocPollingModalVisible, setVisible: setPandadocPollingModalVisible, id: id })] }));
|
|
19290
19290
|
}
|
|
@@ -19375,10 +19375,10 @@ var getColor = function (state) {
|
|
|
19375
19375
|
}
|
|
19376
19376
|
};
|
|
19377
19377
|
|
|
19378
|
-
var Text$
|
|
19378
|
+
var Text$n = antd.Typography.Text;
|
|
19379
19379
|
var TransactionDate = function (_a) {
|
|
19380
19380
|
var date = _a.date;
|
|
19381
|
-
return jsxRuntime.jsx(Text$
|
|
19381
|
+
return jsxRuntime.jsx(Text$n, __assign({ className: "bunny-text-sm" }, { children: common.formatDate(date) }));
|
|
19382
19382
|
};
|
|
19383
19383
|
|
|
19384
19384
|
var ArrowDownToLine = function (_a) {
|
|
@@ -19415,13 +19415,13 @@ var TransactionGridCell = defaultStyled.div.withConfig({
|
|
|
19415
19415
|
}, common.SLATE_600);
|
|
19416
19416
|
var templateObject_1$6;
|
|
19417
19417
|
|
|
19418
|
-
var Text$
|
|
19418
|
+
var Text$m = antd.Typography.Text;
|
|
19419
19419
|
var TransactionsEmptyState = function () {
|
|
19420
19420
|
var noTransactionsMessage = react.useContext(TransactionsListContext).noTransactionsMessage;
|
|
19421
|
-
return (jsxRuntime.jsx(Text$
|
|
19421
|
+
return (jsxRuntime.jsx(Text$m, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || "There are no transactions" })));
|
|
19422
19422
|
};
|
|
19423
19423
|
|
|
19424
|
-
var Text$
|
|
19424
|
+
var Text$l = antd.Typography.Text;
|
|
19425
19425
|
var isInvoice = function (transaction) {
|
|
19426
19426
|
return transaction.kind === "INVOICE";
|
|
19427
19427
|
};
|
|
@@ -19433,7 +19433,7 @@ var TransactionRowTitle = function (_a) {
|
|
|
19433
19433
|
if (!isInvoice(transaction) && !isQuote(transaction)) {
|
|
19434
19434
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
19435
19435
|
}
|
|
19436
|
-
return (jsxRuntime.jsx(Text$
|
|
19436
|
+
return (jsxRuntime.jsx(Text$l, __assign({ className: "bunny-text-slate-400", style: { fontSize: "11px" } }, { children: transaction.transactionable.number })));
|
|
19437
19437
|
};
|
|
19438
19438
|
|
|
19439
19439
|
function transactionDateToDisplay(transaction, transactionDateType) {
|
|
@@ -19452,7 +19452,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
|
|
|
19452
19452
|
}
|
|
19453
19453
|
}
|
|
19454
19454
|
|
|
19455
|
-
var Text$
|
|
19455
|
+
var Text$k = antd.Typography.Text;
|
|
19456
19456
|
var TransactionsListDesktop = function (_a) {
|
|
19457
19457
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
19458
19458
|
var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
|
|
@@ -19481,11 +19481,11 @@ var TransactionsListDesktop = function (_a) {
|
|
|
19481
19481
|
!showState &&
|
|
19482
19482
|
!showAmount &&
|
|
19483
19483
|
!showDownload &&
|
|
19484
|
-
!showAccountName && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$
|
|
19484
|
+
!showAccountName && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$k, { children: "No columns selected" }) })), showDate && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: false }, { children: jsxRuntime.jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) }) }))), showTitle && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(TransactionGridCell, __assign({ right: false, className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(Text$k, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] })) })), showAccountName && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: false }, { children: jsxRuntime.jsx(Text$k, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }) }))), !showDate && !showTitle && !showAccountName && (jsxRuntime.jsx(TransactionGridCell, { right: false })), 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$k, { children: common.formatCurrency(((_b = transaction === null || transaction === void 0 ? void 0 : transaction.transactionable) === null || _b === void 0 ? void 0 : _b.amount) || transaction.amount, transaction.currencyId) }) })))] }), index));
|
|
19485
19485
|
}) }));
|
|
19486
19486
|
};
|
|
19487
19487
|
|
|
19488
|
-
var Text$
|
|
19488
|
+
var Text$j = antd.Typography.Text;
|
|
19489
19489
|
var TransactionsListMobile = function (_a) {
|
|
19490
19490
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
19491
19491
|
var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
|
|
@@ -19508,12 +19508,12 @@ var TransactionsListMobile = function (_a) {
|
|
|
19508
19508
|
backgroundColor: index % 2 === 0
|
|
19509
19509
|
? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
|
|
19510
19510
|
: "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
|
|
19511
|
-
} }, { children: [jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [(showTitle || showState) && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$
|
|
19511
|
+
} }, { children: [jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [(showTitle || showState) && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$j, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] })), showState && jsxRuntime.jsx(StateTag, { state: transaction.state })] }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showAccountName && jsxRuntime.jsx(Text$j, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }), showAccountName && showDate && jsxRuntime.jsx(Text$j, { children: "\u00B7" }), showDate && (jsxRuntime.jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) })), showDate && showAmount && jsxRuntime.jsx(Text$j, { children: "\u00B7" }), showAmount && (jsxRuntime.jsx(Text$j, { children: common.formatCurrency(transaction.transactionable.amount ||
|
|
19512
19512
|
transaction.amount, transaction.currencyId) }))] }))] })) }), showDownload && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })))] }), index));
|
|
19513
19513
|
}) }));
|
|
19514
19514
|
};
|
|
19515
19515
|
|
|
19516
|
-
var Text$
|
|
19516
|
+
var Text$i = antd.Typography.Text;
|
|
19517
19517
|
var DISPLAY_WIDTH = 1200;
|
|
19518
19518
|
function Transactions(_a) {
|
|
19519
19519
|
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", "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 ? [
|
|
@@ -19626,7 +19626,7 @@ function TransactionsDisplay(_a) {
|
|
|
19626
19626
|
onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
|
|
19627
19627
|
setDrawerOpen(false);
|
|
19628
19628
|
}
|
|
19629
|
-
return (jsxRuntime.jsxs("div", __assign({ style: style }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-shadow-padding-xb bunny-gap-2 ".concat(isMobile ? "bunny-overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? "bunny-flex-col bunny-gap-1" : "bunny-flex-row bunny-items-center", " bunny-justify-between") }, { children: [showTitle ? (jsxRuntime.jsx(Text$
|
|
19629
|
+
return (jsxRuntime.jsxs("div", __assign({ style: style }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-shadow-padding-xb bunny-gap-2 ".concat(isMobile ? "bunny-overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? "bunny-flex-col bunny-gap-1" : "bunny-flex-row bunny-items-center", " bunny-justify-between") }, { children: [showTitle ? (jsxRuntime.jsx(Text$i, __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsxRuntime.jsx("div", {}) // Empty div so justify-between works
|
|
19630
19630
|
), showSearchBar && (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "bunny-w-full" : "") }, { children: jsxRuntime.jsx(antd.Input, { className: searchBarClassName
|
|
19631
19631
|
? searchBarClassName
|
|
19632
19632
|
: "border border-slate-200", onChange: function (e) {
|
|
@@ -19744,7 +19744,7 @@ function QuotesWrapper() {
|
|
|
19744
19744
|
return (jsxRuntime.jsx(TransactionsDisplay, { transactions: quotesAsTransactions, onSearchValueChanged: setSearch, search: search }));
|
|
19745
19745
|
}
|
|
19746
19746
|
|
|
19747
|
-
var MUTATION$
|
|
19747
|
+
var MUTATION$6 = function () { return "\nmutation AccountSignup (\n $pluginId: String!,\n $paymentMethodId: String,\n $priceListCode: String!,\n $accountId: ID!,\n $quoteId: ID!,\n $entityId: ID!\n) {\n accountSignup(\n pluginId: $pluginId,\n paymentMethodId: $paymentMethodId,\n priceListCode: $priceListCode,\n accountId: $accountId,\n quoteId: $quoteId,\n entityId: $entityId\n ) {\n errors\n quote {\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}"; };
|
|
19748
19748
|
var accountSignup = function (_a) {
|
|
19749
19749
|
var token = _a.token, apiHost = _a.apiHost, accountId = _a.accountId, quoteId = _a.quoteId, paymentToken = _a.paymentToken, paymentMethodId = _a.paymentMethodId, pluginId = _a.pluginId, priceListCode = _a.priceListCode, entityId = _a.entityId;
|
|
19750
19750
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -19763,7 +19763,7 @@ var accountSignup = function (_a) {
|
|
|
19763
19763
|
entityId: entityId,
|
|
19764
19764
|
};
|
|
19765
19765
|
return [4 /*yield*/, common.gqlRequest({
|
|
19766
|
-
query: MUTATION$
|
|
19766
|
+
query: MUTATION$6(),
|
|
19767
19767
|
token: token,
|
|
19768
19768
|
vars: vars,
|
|
19769
19769
|
apiHost: apiHost,
|
|
@@ -19779,7 +19779,7 @@ var accountSignup = function (_a) {
|
|
|
19779
19779
|
});
|
|
19780
19780
|
};
|
|
19781
19781
|
|
|
19782
|
-
var MUTATION$
|
|
19782
|
+
var MUTATION$5 = function () { return "\nmutation QuoteAccountSignup (\n $accountName: String!,\n $billingContact: ContactAttributes!,\n $priceListCode: String!,\n $entityId: ID!\n) {\n quoteAccountSignup(\n priceListCode: $priceListCode,\n accountName: $accountName,\n billingContact: $billingContact,\n entityId: $entityId\n ) {\n account {\n id\n }\n quote {\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 tenant {\n code\n }\n portalSessionToken\n errors\n }\n}"; };
|
|
19783
19783
|
var quoteAccountSignup = function (_a) {
|
|
19784
19784
|
var token = _a.token, apiHost = _a.apiHost, priceListCode = _a.priceListCode, accountName = _a.accountName, billingContact = _a.billingContact, entityId = _a.entityId;
|
|
19785
19785
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -19795,7 +19795,7 @@ var quoteAccountSignup = function (_a) {
|
|
|
19795
19795
|
entityId: entityId,
|
|
19796
19796
|
};
|
|
19797
19797
|
return [4 /*yield*/, common.gqlRequest({
|
|
19798
|
-
query: MUTATION$
|
|
19798
|
+
query: MUTATION$5(),
|
|
19799
19799
|
token: token,
|
|
19800
19800
|
vars: vars,
|
|
19801
19801
|
apiHost: apiHost,
|
|
@@ -19811,7 +19811,34 @@ var quoteAccountSignup = function (_a) {
|
|
|
19811
19811
|
});
|
|
19812
19812
|
};
|
|
19813
19813
|
|
|
19814
|
-
var MUTATION$
|
|
19814
|
+
var MUTATION$4 = "mutation quoteAddCoupon($couponCode: String!, $quoteId: ID!) {\n quoteAddCoupon(couponCode: $couponCode, quoteId: $quoteId) {\n quote {\n id\n subtotal\n taxAmount\n amount\n quoteChanges {\n id\n charges {\n id\n amount\n couponId\n }\n }\n }\n }\n}";
|
|
19815
|
+
var quoteAddCoupon = function (_a) {
|
|
19816
|
+
var quoteId = _a.quoteId, couponCode = _a.couponCode, token = _a.token, apiHost = _a.apiHost;
|
|
19817
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
19818
|
+
var vars, response, errors;
|
|
19819
|
+
var _b;
|
|
19820
|
+
return __generator(this, function (_c) {
|
|
19821
|
+
switch (_c.label) {
|
|
19822
|
+
case 0:
|
|
19823
|
+
vars = { quoteId: quoteId, couponCode: couponCode };
|
|
19824
|
+
return [4 /*yield*/, common.gqlRequest({
|
|
19825
|
+
query: MUTATION$4,
|
|
19826
|
+
token: token,
|
|
19827
|
+
vars: vars,
|
|
19828
|
+
apiHost: apiHost,
|
|
19829
|
+
})];
|
|
19830
|
+
case 1:
|
|
19831
|
+
response = _c.sent();
|
|
19832
|
+
errors = (_b = response === null || response === void 0 ? void 0 : response.quoteAddCoupon) === null || _b === void 0 ? void 0 : _b.errors;
|
|
19833
|
+
if (errors)
|
|
19834
|
+
throw errors;
|
|
19835
|
+
return [2 /*return*/, response.quote];
|
|
19836
|
+
}
|
|
19837
|
+
});
|
|
19838
|
+
});
|
|
19839
|
+
};
|
|
19840
|
+
|
|
19841
|
+
var MUTATION$3 = function () { return "\nquery PriceList($code: String!) {\n priceList (code: $code) {\n basePrice\n code\n createdAt\n currencyId\n id\n isVisible\n name\n periodMonths\n planId\n priceDescription\n productId\n product {\n name\n }\n sku\n trialAllowed\n trialLengthDays\n updatedAt\n }\n}"; };
|
|
19815
19842
|
var getPriceList = function (_a) {
|
|
19816
19843
|
var token = _a.token, code = _a.code, apiHost = _a.apiHost;
|
|
19817
19844
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -19832,52 +19859,121 @@ var getPriceList = function (_a) {
|
|
|
19832
19859
|
});
|
|
19833
19860
|
};
|
|
19834
19861
|
|
|
19862
|
+
var QUOTE_QUERY = function (id) { return "\n query quote {\n quote(id: ".concat(id, ") {\n accountId\n amount\n amountDue\n smallUnitAmountDue\n currencyId\n formattedQuote {\n html\n }\n id\n payableId\n periodAmount\n subtotal\n taxAmount\n amountsByPeriod {\n amount\n startDate\n }\n quoteChanges {\n currencyId\n id\n kind\n charges {\n amountsByPeriod {\n amount\n startDate\n }\n amount\n billingPeriod\n currencyId\n feature {\n unitName\n }\n id\n name\n priceListCharge {\n id\n }\n priceList {\n id\n }\n couponId\n quantity\n kind\n }\n priceList {\n id\n plan {\n name\n }\n product {\n name\n }\n }\n\n }\n }\n }"); };
|
|
19863
|
+
var getQuote = function (_a) {
|
|
19864
|
+
var id = _a.id, token = _a.token, apiHost = _a.apiHost;
|
|
19865
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
19866
|
+
var response;
|
|
19867
|
+
return __generator(this, function (_b) {
|
|
19868
|
+
switch (_b.label) {
|
|
19869
|
+
case 0: return [4 /*yield*/, common.gqlRequest({
|
|
19870
|
+
query: QUOTE_QUERY(id),
|
|
19871
|
+
token: token,
|
|
19872
|
+
vars: {},
|
|
19873
|
+
apiHost: apiHost,
|
|
19874
|
+
})];
|
|
19875
|
+
case 1:
|
|
19876
|
+
response = _b.sent();
|
|
19877
|
+
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.quote];
|
|
19878
|
+
}
|
|
19879
|
+
});
|
|
19880
|
+
});
|
|
19881
|
+
};
|
|
19882
|
+
|
|
19883
|
+
var useCurrentUserData = function () {
|
|
19884
|
+
var queryClient = reactQuery.useQueryClient();
|
|
19885
|
+
var token = useToken();
|
|
19886
|
+
var currentUser = queryClient.getQueryData(common.QueryKeyFactory.default.currentUserKey(token));
|
|
19887
|
+
if (!currentUser)
|
|
19888
|
+
return {};
|
|
19889
|
+
return currentUser;
|
|
19890
|
+
};
|
|
19891
|
+
|
|
19892
|
+
var BunnyFooterIcon = function (_a) {
|
|
19893
|
+
var color = _a.color;
|
|
19894
|
+
return (jsxRuntime.jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsxRuntime.jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
|
|
19895
|
+
};
|
|
19896
|
+
|
|
19897
|
+
var Text$h = antd.Typography.Text;
|
|
19898
|
+
var Footer = function (_a) {
|
|
19899
|
+
var className = _a.className;
|
|
19900
|
+
var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
|
|
19901
|
+
var isMobile = common.useIsMobile();
|
|
19902
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-shrink-0 ".concat(isMobile ? 'bunny-flex-col bunny-gap-2 bunny-grow' : '', " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-3" }, { children: [termsUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsxRuntime.jsx(BunnyMarketingLink, {})] })));
|
|
19903
|
+
};
|
|
19904
|
+
var BunnyMarketingLink = function () {
|
|
19905
|
+
var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
|
|
19906
|
+
var isMobile = common.useIsMobile();
|
|
19907
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-end bunny-justify-end ".concat(isMobile ? '' : 'grow') }, { children: jsxRuntime.jsx(StyledBunnyLink, __assign({ className: "bunny-flex bunny-items-end bunny-justify-end bunny-text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: [jsxRuntime.jsx(Text$h, __assign({ className: "bunny-text-xs bunny-text-slate-400" }, { children: "Powered by\u00A0" })), jsxRuntime.jsx("div", __assign({ style: { paddingTop: '5px' } }, { children: jsxRuntime.jsx(BunnyFooterIcon, { color: isHovered ? common.PRIMARY_COLOR : common.SLATE_400 }) }))] })) })) })));
|
|
19908
|
+
};
|
|
19909
|
+
var StyedLink = styled__default["default"].a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"])), common.SLATE_400, common.SLATE_500);
|
|
19910
|
+
var StyledBunnyLink = styled__default["default"](StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), common.PRIMARY_COLOR);
|
|
19911
|
+
var templateObject_1$5, templateObject_2$1;
|
|
19912
|
+
|
|
19913
|
+
function CouponEditor(_a) {
|
|
19914
|
+
var className = _a.className, onAddCoupon = _a.onAddCoupon, isAddingCoupon = _a.isAddingCoupon;
|
|
19915
|
+
// Local state
|
|
19916
|
+
var _b = react.useState(''), couponCode = _b[0], setCouponCode = _b[1];
|
|
19917
|
+
function handleAddCoupon() {
|
|
19918
|
+
return __awaiter(this, void 0, void 0, function () {
|
|
19919
|
+
return __generator(this, function (_a) {
|
|
19920
|
+
onAddCoupon(couponCode);
|
|
19921
|
+
setCouponCode('');
|
|
19922
|
+
return [2 /*return*/];
|
|
19923
|
+
});
|
|
19924
|
+
});
|
|
19925
|
+
}
|
|
19926
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(className) }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2" }, { children: [jsxRuntime.jsx(antd.Input, { value: couponCode, onChange: function (e) { return setCouponCode(e.target.value); }, placeholder: "Coupon code", disabled: isAddingCoupon }), jsxRuntime.jsx(antd.Button, __assign({ loading: isAddingCoupon, type: "primary", onClick: handleAddCoupon }, { children: "Apply" }))] })) })));
|
|
19927
|
+
}
|
|
19928
|
+
|
|
19929
|
+
var Title$1 = antd.Typography.Title;
|
|
19835
19930
|
function PaymentForms(_a) {
|
|
19836
19931
|
var quote = _a.quote, handlePaymentSuccess = _a.handlePaymentSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId, overrideToken = _a.overrideToken, customCheckoutFunction = _a.customCheckoutFunction;
|
|
19837
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: overrideToken ? (jsxRuntime.jsx(PaymentForm, { onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, customCheckoutFunction: customCheckoutFunction })) : null })) : (jsxRuntime.jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
|
|
19932
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: quote ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: overrideToken ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Title$1, __assign({ className: "bunny-px-4 bunny-m-0", level: 2 }, { children: "Payment" })), jsxRuntime.jsx(PaymentForm, { onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, customCheckoutFunction: customCheckoutFunction })] })) : null })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Title$1, __assign({ className: "bunny-px-4 bunny-m-0", level: 2 }, { children: "Signup" })), jsxRuntime.jsx(InitialSignupForm, { className: "bunny-px-4", onSubmit: handleSubmit, submitting: proceedingToPayment })] })) }));
|
|
19838
19933
|
}
|
|
19839
19934
|
function InitialSignupForm(_a) {
|
|
19840
|
-
var onSubmit = _a.onSubmit, submitting = _a.submitting;
|
|
19935
|
+
var className = _a.className, onSubmit = _a.onSubmit, submitting = _a.submitting;
|
|
19841
19936
|
var form = antd.Form.useForm()[0];
|
|
19842
19937
|
function handleSubmit() {
|
|
19843
19938
|
form.validateFields({ validateOnly: false }).then(function () {
|
|
19844
19939
|
onSubmit(form.getFieldsValue());
|
|
19845
19940
|
});
|
|
19846
19941
|
}
|
|
19847
|
-
return (jsxRuntime.
|
|
19848
|
-
|
|
19849
|
-
|
|
19850
|
-
|
|
19942
|
+
return (jsxRuntime.jsx(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-h-full bunny-w-full ".concat(className), form: form, layout: "vertical", autoComplete: "off" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-2" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ name: "firstName", rules: [{ required: true, message: 'First name is required' }] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "First name" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ name: "lastName", rules: [{ required: true, message: 'Last name is required' }] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Last name" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ name: "email", rules: [
|
|
19943
|
+
{ required: true, message: 'Email is required' },
|
|
19944
|
+
{ type: 'email', message: 'Please enter a valid email' },
|
|
19945
|
+
] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Email" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ name: "accountName", rules: [{ required: true, message: 'Company name is required' }] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Company name" }) })), jsxRuntime.jsx(antd.Form.Item, { children: jsxRuntime.jsx(antd.Button, __assign({ type: "primary", onClick: handleSubmit, loading: submitting, className: "bunny-w-full" }, { children: "Proceed to payment" })) })] })) })));
|
|
19851
19946
|
}
|
|
19852
19947
|
|
|
19853
|
-
var Title = antd.Typography.Title, Text$
|
|
19948
|
+
var Title = antd.Typography.Title, Text$g = antd.Typography.Text;
|
|
19854
19949
|
function PaymentSuccessDisplay(_a) {
|
|
19855
19950
|
var amountPaid = _a.amountPaid, className = _a.className, companyName = _a.companyName, returnUrl = _a.returnUrl, style = _a.style, currencyId = _a.currencyId;
|
|
19856
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-justify-center bunny-h-full ".concat(className), style: style }, { children: [jsxRuntime.jsx(icons.CheckCircleFilled, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxRuntime.jsxs(Title, __assign({ level: 3, className: "bunny-mt-2 bunny-m-0" }, { children: ["Payment of ", common.formatCurrency(amountPaid, currencyId), " successful"] })), returnUrl && (jsxRuntime.jsxs(Text$
|
|
19951
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-justify-center bunny-h-full ".concat(className), style: style }, { children: [jsxRuntime.jsx(icons.CheckCircleFilled, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxRuntime.jsxs(Title, __assign({ level: 3, className: "bunny-mt-2 bunny-m-0" }, { children: ["Payment of ", common.formatCurrency(amountPaid, currencyId), " successful"] })), returnUrl && (jsxRuntime.jsxs(Text$g, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
|
|
19857
19952
|
}
|
|
19858
19953
|
|
|
19859
|
-
var Text$
|
|
19954
|
+
var Text$f = antd.Typography.Text;
|
|
19860
19955
|
function PriceListDisplay(_a) {
|
|
19861
|
-
var priceListData = _a.priceListData
|
|
19956
|
+
var priceListData = _a.priceListData;
|
|
19862
19957
|
if (!priceListData)
|
|
19863
19958
|
return null;
|
|
19864
|
-
return (jsxRuntime.
|
|
19959
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-8" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsxs(Text$f, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: [priceListData.product.name, " ", priceListData.name] })), jsxRuntime.jsxs(Text$f, __assign({ className: "bunny-font-bold bunny-text-xl" }, { children: [common.formatCurrency(priceListData.basePrice, priceListData.currencyId), " / month"] }))] })), priceListData.trialAllowed ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: [jsxRuntime.jsxs(Text$f, __assign({ style: { fontSize: '16px' }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$f, __assign({ className: "bunny-text-slate-500", style: { fontSize: '12px' } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })));
|
|
19865
19960
|
}
|
|
19866
19961
|
|
|
19867
19962
|
var showErrorNotification = common.useErrorNotification();
|
|
19868
19963
|
function Signup(_a) {
|
|
19869
|
-
var companyName = _a.companyName, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl,
|
|
19964
|
+
var companyName = _a.companyName, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, couponCode = _a.couponCode, className = _a.className, _b = _a.shadow, shadow = _b === void 0 ? 'shadow-md' : _b, style = _a.style, entityId = _a.entityId;
|
|
19870
19965
|
// Hooks
|
|
19871
19966
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
19872
19967
|
var tokenFromContexts = useToken();
|
|
19873
19968
|
var isMobile = common.useIsMobile();
|
|
19874
19969
|
var topNavImageUrl = react.useContext(BrandContext).topNavImageUrl;
|
|
19875
|
-
var
|
|
19876
|
-
var
|
|
19877
|
-
var
|
|
19970
|
+
var _c = react.useState(undefined), initialQuote = _c[0], setInitialQuote = _c[1];
|
|
19971
|
+
var _d = react.useState(undefined), accountId = _d[0], setAccountId = _d[1];
|
|
19972
|
+
var _e = react.useState(undefined), portalSessionToken = _e[0], setPortalSessionToken = _e[1];
|
|
19878
19973
|
var token = portalSessionToken || tokenFromContexts;
|
|
19879
|
-
var
|
|
19880
|
-
var
|
|
19974
|
+
var _f = react.useState(false), proceedingToPayment = _f[0], setProceedingToPayment = _f[1];
|
|
19975
|
+
var _g = react.useState(false), purchaseSucceeded = _g[0], setPurchaseSucceeded = _g[1];
|
|
19976
|
+
var defaultCouponAppliedRef = react.useRef(undefined);
|
|
19881
19977
|
var defaultPaymentMethod = usePaymentMethod({
|
|
19882
19978
|
accountId: accountId,
|
|
19883
19979
|
token: token,
|
|
@@ -19885,13 +19981,57 @@ function Signup(_a) {
|
|
|
19885
19981
|
}).defaultPaymentMethod;
|
|
19886
19982
|
var queryClient = reactQuery.useQueryClient();
|
|
19887
19983
|
// Queries
|
|
19888
|
-
var
|
|
19889
|
-
queryKey: [
|
|
19984
|
+
var _h = reactQuery.useQuery({
|
|
19985
|
+
queryKey: ['priceList', priceListCode],
|
|
19890
19986
|
queryFn: function () { return getPriceList({ token: token, apiHost: apiHost, code: priceListCode }); },
|
|
19891
|
-
}).data;
|
|
19987
|
+
}), priceListData = _h.data, isLoadingPriceList = _h.isLoading;
|
|
19988
|
+
var _j = reactQuery.useQuery({
|
|
19989
|
+
queryKey: ['quote', initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id],
|
|
19990
|
+
queryFn: function () {
|
|
19991
|
+
if (!(initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id)) {
|
|
19992
|
+
throw new Error('Quote ID is required');
|
|
19993
|
+
}
|
|
19994
|
+
return getQuote({ token: token, apiHost: apiHost, id: initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id });
|
|
19995
|
+
},
|
|
19996
|
+
enabled: !!(initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id),
|
|
19997
|
+
}), data = _j.data, isLoadingQuote = _j.isLoading;
|
|
19998
|
+
var quote = data || initialQuote;
|
|
19999
|
+
var _k = reactQuery.useMutation({
|
|
20000
|
+
mutationFn: function (couponCode) {
|
|
20001
|
+
if (!quote) {
|
|
20002
|
+
throw new Error('Quote is required');
|
|
20003
|
+
}
|
|
20004
|
+
if (!token) {
|
|
20005
|
+
throw new Error('Token is required');
|
|
20006
|
+
}
|
|
20007
|
+
return quoteAddCoupon({
|
|
20008
|
+
quoteId: quote.id,
|
|
20009
|
+
couponCode: couponCode,
|
|
20010
|
+
apiHost: apiHost,
|
|
20011
|
+
token: token,
|
|
20012
|
+
});
|
|
20013
|
+
},
|
|
20014
|
+
onSuccess: function () {
|
|
20015
|
+
queryClient.refetchQueries({
|
|
20016
|
+
queryKey: ['quote', quote === null || quote === void 0 ? void 0 : quote.id],
|
|
20017
|
+
});
|
|
20018
|
+
showSuccessNotification('Coupon applied');
|
|
20019
|
+
},
|
|
20020
|
+
onError: function (error) {
|
|
20021
|
+
var _a, _b;
|
|
20022
|
+
showErrorNotification((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.errors[0]) === null || _b === void 0 ? void 0 : _b.message, 'Error adding coupon');
|
|
20023
|
+
},
|
|
20024
|
+
}), addCoupon = _k.mutate, isAddingCoupon = _k.isPending;
|
|
20025
|
+
// Handle default coupon application
|
|
20026
|
+
react.useEffect(function () {
|
|
20027
|
+
if (couponCode && (quote === null || quote === void 0 ? void 0 : quote.id) && defaultCouponAppliedRef.current !== couponCode) {
|
|
20028
|
+
addCoupon(couponCode);
|
|
20029
|
+
defaultCouponAppliedRef.current = couponCode;
|
|
20030
|
+
}
|
|
20031
|
+
}, [couponCode, quote === null || quote === void 0 ? void 0 : quote.id]);
|
|
19892
20032
|
function handleSubmit(formData) {
|
|
19893
20033
|
return __awaiter(this, void 0, void 0, function () {
|
|
19894
|
-
var
|
|
20034
|
+
var data_1, error_1;
|
|
19895
20035
|
return __generator(this, function (_a) {
|
|
19896
20036
|
switch (_a.label) {
|
|
19897
20037
|
case 0:
|
|
@@ -19910,9 +20050,9 @@ function Signup(_a) {
|
|
|
19910
20050
|
entityId: entityId,
|
|
19911
20051
|
})];
|
|
19912
20052
|
case 1:
|
|
19913
|
-
|
|
19914
|
-
setAccountId(
|
|
19915
|
-
setPortalSessionToken(
|
|
20053
|
+
data_1 = _a.sent();
|
|
20054
|
+
setAccountId(data_1.account.id);
|
|
20055
|
+
setPortalSessionToken(data_1.portalSessionToken);
|
|
19916
20056
|
// We must invalidate the accountPaymentMethodKey query in order to clear payment methods from the provided api token,
|
|
19917
20057
|
// to instead use paymentMethods from portalSessionToken.
|
|
19918
20058
|
queryClient.invalidateQueries({
|
|
@@ -19922,7 +20062,7 @@ function Signup(_a) {
|
|
|
19922
20062
|
}),
|
|
19923
20063
|
});
|
|
19924
20064
|
setProceedingToPayment(false);
|
|
19925
|
-
|
|
20065
|
+
setInitialQuote(data_1.quote);
|
|
19926
20066
|
return [3 /*break*/, 3];
|
|
19927
20067
|
case 2:
|
|
19928
20068
|
error_1 = _a.sent();
|
|
@@ -19948,16 +20088,16 @@ function Signup(_a) {
|
|
|
19948
20088
|
switch (_a.label) {
|
|
19949
20089
|
case 0:
|
|
19950
20090
|
if (!portalSessionToken) {
|
|
19951
|
-
throw new Error(
|
|
20091
|
+
throw new Error('Portal session token is required');
|
|
19952
20092
|
}
|
|
19953
20093
|
if (!accountId) {
|
|
19954
|
-
throw new Error(
|
|
20094
|
+
throw new Error('Account ID is required');
|
|
19955
20095
|
}
|
|
19956
20096
|
if (!(plugin === null || plugin === void 0 ? void 0 : plugin.id)) {
|
|
19957
|
-
throw new Error(
|
|
20097
|
+
throw new Error('Plugin ID is required');
|
|
19958
20098
|
}
|
|
19959
20099
|
if (!(defaultPaymentMethod === null || defaultPaymentMethod === void 0 ? void 0 : defaultPaymentMethod.id)) {
|
|
19960
|
-
throw new Error(
|
|
20100
|
+
throw new Error('Payment method ID is required');
|
|
19961
20101
|
}
|
|
19962
20102
|
return [4 /*yield*/, accountSignup({
|
|
19963
20103
|
token: portalSessionToken,
|
|
@@ -19977,13 +20117,27 @@ function Signup(_a) {
|
|
|
19977
20117
|
function handlePaymentFail(error) {
|
|
19978
20118
|
showErrorNotification(error.response.message);
|
|
19979
20119
|
}
|
|
19980
|
-
|
|
19981
|
-
|
|
19982
|
-
|
|
19983
|
-
|
|
19984
|
-
return (jsxRuntime.
|
|
19985
|
-
|
|
19986
|
-
|
|
20120
|
+
if (purchaseSucceeded) {
|
|
20121
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: (quote === null || quote === void 0 ? void 0 : quote.currencyId) !== undefined ? (jsxRuntime.jsx("div", __assign({ className: "bunny-w-screen bunny-flex bunny-items-start bunny-pt-[25vh]" }, { children: jsxRuntime.jsx(PaymentSuccessDisplay, { amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, className: "bunny-w-full", companyName: companyName, returnUrl: returnUrl, currencyId: quote === null || quote === void 0 ? void 0 : quote.currencyId }) }))) : (jsxRuntime.jsx("div", { children: "No currency ID found from Quote" })) }));
|
|
20122
|
+
}
|
|
20123
|
+
var marginY = '24';
|
|
20124
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'bunny-flex-col' : 'bunny-flex-row', " bunny-h-screen bunny-w-screen bunny-absolute bunny-top-0 bunny-left-0 ").concat(shadow, " ").concat(className), style: style }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-flex-col ".concat(isMobile ? 'bunny-w-full bunny-h-1/2' : 'bunny-w-1/2 bunny-h-full', " bunny-justify-center") }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-start bunny-justify-between bunny-w-3/5 bunny-h-full bunny-gap-4 bunny-my-24" }, { children: [jsxRuntime.jsx("div", { children: topNavImageUrl.length > 0 && (jsxRuntime.jsx(antd.Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false })) }), data ? (jsxRuntime.jsx(CheckoutSummary, { quote: data, className: "bunny-h-full bunny-w-full", onAddCoupon: addCoupon, priceListData: priceListData, isAddingCoupon: isAddingCoupon })) : (jsxRuntime.jsx("div", __assign({ className: "bunny-h-full" }, { children: isLoadingPriceList ? (jsxRuntime.jsx(antd.Skeleton, { active: true })) : (jsxRuntime.jsx(PriceListDisplay, { priceListData: priceListData })) }))), jsxRuntime.jsx(Footer, {})] })) })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col ".concat(isMobile ? 'bunny-w-full bunny-h-1/2' : 'bunny-w-1/2 bunny-h-full', " bunny-items-center"), style: {
|
|
20125
|
+
boxShadow: '-5px 0 20px 0 rgba(0, 0, 0, 0.05)',
|
|
20126
|
+
} }, { children: isLoadingPriceList ? (jsxRuntime.jsx(antd.Skeleton, { active: true, className: "bunny-flex bunny-flex-col bunny-w-3/5 bunny-mt-".concat(marginY) })) : (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-3/5 bunny-mt-".concat(marginY) }, { children: jsxRuntime.jsx(PaymentForms, { quote: isLoadingQuote ? undefined : quote, handlePaymentSuccess: handlePaymentSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId, overrideToken: portalSessionToken, customCheckoutFunction: accountSignupFunction }) }))) }))] })));
|
|
20127
|
+
}
|
|
20128
|
+
var Text$e = antd.Typography.Text;
|
|
20129
|
+
var CheckoutSummaryDivider = function () {
|
|
20130
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-my-2" }, { children: jsxRuntime.jsx(antd.Divider, { className: "m-0" }) })));
|
|
20131
|
+
};
|
|
20132
|
+
var showSuccessNotification = common.useSuccessNotification();
|
|
20133
|
+
function CheckoutSummary(_a) {
|
|
20134
|
+
var quote = _a.quote, className = _a.className, onAddCoupon = _a.onAddCoupon, priceListData = _a.priceListData, isAddingCoupon = _a.isAddingCoupon;
|
|
20135
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className, " bunny-space-y-4") }, { children: [jsxRuntime.jsxs(Text$e, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-text-lg bunny-font-medium bunny-mb-4" }, { children: ["Checkout summary - ", priceListData === null || priceListData === void 0 ? void 0 : priceListData.product.name, " ", priceListData === null || priceListData === void 0 ? void 0 : priceListData.name] })), jsxRuntime.jsx("div", __assign({ className: "bunny-space-y-4" }, { children: quote === null || quote === void 0 ? void 0 : quote.quoteChanges.map(function (quoteChange) {
|
|
20136
|
+
return quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.map(function (charge) {
|
|
20137
|
+
var multiplier = charge.kind === 'COUPON' ? -1 : 1;
|
|
20138
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsxRuntime.jsx("div", { children: charge.name }), jsxRuntime.jsx("div", { children: charge.quantity }), jsxRuntime.jsx("div", { children: common.formatCurrency(multiplier * charge.amount, charge.currencyId) })] }), charge.id));
|
|
20139
|
+
});
|
|
20140
|
+
}) })), jsxRuntime.jsx(CheckoutSummaryDivider, {}), jsxRuntime.jsxs("div", __assign({ className: "bunny-space-y-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsxRuntime.jsx("div", { children: "Subtotal" }), jsxRuntime.jsx("div", { children: common.formatCurrency(quote.amountDue, quote.currencyId) })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsxRuntime.jsx("div", { children: "Taxes" }), jsxRuntime.jsx("div", { children: common.formatCurrency(quote.taxAmount, quote.currencyId) })] }))] })), jsxRuntime.jsx(CheckoutSummaryDivider, {}), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsxRuntime.jsx("div", { children: "Total" }), jsxRuntime.jsx("div", { children: common.formatCurrency(quote.amountDue + quote.taxAmount, quote.currencyId) })] }))] }), jsxRuntime.jsx(CouponEditor, { className: "bunny-w-full", quote: quote, onAddCoupon: onAddCoupon, isAddingCoupon: isAddingCoupon })] })));
|
|
19987
20141
|
}
|
|
19988
20142
|
|
|
19989
20143
|
var createRequestHeaders = function (token) {
|
|
@@ -20076,27 +20230,6 @@ var useQuoteDelete = function () {
|
|
|
20076
20230
|
}); };
|
|
20077
20231
|
};
|
|
20078
20232
|
|
|
20079
|
-
var QUOTE_QUERY = function (id) { return "\n query quote {\n quote(id: ".concat(id, ") {\n accountId\n amount\n amountDue\n smallUnitAmountDue\n currencyId\n formattedQuote {\n html\n }\n id\n payableId\n periodAmount\n subtotal\n taxAmount\n amountsByPeriod {\n amount\n startDate\n }\n quoteChanges {\n currencyId\n id\n charges {\n amountsByPeriod {\n amount\n startDate\n }\n amount\n billingPeriod\n currencyId\n feature {\n unitName\n }\n id\n name\n priceListCharge {\n id\n }\n priceList {\n id\n }\n quantity\n }\n priceList {\n id\n plan {\n name\n }\n product {\n name\n }\n }\n\n }\n }\n }"); };
|
|
20080
|
-
var getQuote = function (_a) {
|
|
20081
|
-
var id = _a.id, token = _a.token, apiHost = _a.apiHost;
|
|
20082
|
-
return __awaiter(void 0, void 0, void 0, function () {
|
|
20083
|
-
var response;
|
|
20084
|
-
return __generator(this, function (_b) {
|
|
20085
|
-
switch (_b.label) {
|
|
20086
|
-
case 0: return [4 /*yield*/, common.gqlRequest({
|
|
20087
|
-
query: QUOTE_QUERY(id),
|
|
20088
|
-
token: token,
|
|
20089
|
-
vars: {},
|
|
20090
|
-
apiHost: apiHost,
|
|
20091
|
-
})];
|
|
20092
|
-
case 1:
|
|
20093
|
-
response = _b.sent();
|
|
20094
|
-
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.quote];
|
|
20095
|
-
}
|
|
20096
|
-
});
|
|
20097
|
-
});
|
|
20098
|
-
};
|
|
20099
|
-
|
|
20100
20233
|
var SUBSCRIPTIONS_QUERY = "\nquery subscriptions {\n subscriptions {\n nodes {\n cancellationDate\n currencyId\n endDate\n evergreen\n id\n period\n plan { id name selfServiceBuy selfServiceCancel selfServiceRenew }\n priceList { id periodMonths }\n product { id name showProductNameOnLineItem }\n startDate\n state\n trialEndDate\n trialPeriod\n trialStartDate\n charges {\n priceListCharge {\n priceListChargeTiers {\n price\n starts\n }\n }\n amount\n billingPeriod\n chargeType\n discount\n discountedPrice\n endDate\n expired\n feature { name }\n id\n isAmendment\n isRamp\n kind\n name\n periodPrice\n price\n priceDecimals\n priceListChargeId\n priceTiers { starts price }\n pricingModel\n quantity\n selfServiceQuantity\n startDate\n trial\n }\n }\n }\n }";
|
|
20101
20234
|
var getSubscriptions = function (_a) {
|
|
20102
20235
|
var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, token = _a.token;
|
|
@@ -20186,35 +20319,6 @@ var useHasTaxPlugin = function (_a) {
|
|
|
20186
20319
|
return Boolean(plugins === null || plugins === void 0 ? void 0 : plugins.some(function (plugin) { return plugin.type === "taxation"; }));
|
|
20187
20320
|
};
|
|
20188
20321
|
|
|
20189
|
-
var useCurrentUserData = function () {
|
|
20190
|
-
var queryClient = reactQuery.useQueryClient();
|
|
20191
|
-
var token = useToken();
|
|
20192
|
-
var currentUser = queryClient.getQueryData(common.QueryKeyFactory.default.currentUserKey(token));
|
|
20193
|
-
if (!currentUser)
|
|
20194
|
-
return {};
|
|
20195
|
-
return currentUser;
|
|
20196
|
-
};
|
|
20197
|
-
|
|
20198
|
-
var BunnyFooterIcon = function (_a) {
|
|
20199
|
-
var color = _a.color;
|
|
20200
|
-
return (jsxRuntime.jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxRuntime.jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M14.5898 7.19708C14.5898 9.35053 13.0926 10.325 11.2495 10.325C9.39955 10.325 7.90234 9.35001 7.90234 7.18967V3.26221H10.1125V7.00052C10.1125 7.87719 10.5855 8.27725 11.2495 8.27725C11.9061 8.27725 12.3865 7.87719 12.3865 7.00052V3.26221H14.5898V7.19708Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M31.8943 12.9625H29.4793L31.8523 8.62816L28.9355 3.26221H31.4708L33.0457 6.35524L34.5924 3.26221H37.0075L31.8943 12.9625Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M15.1602 5.96827C15.1602 3.8148 16.6574 2.84033 18.5005 2.84033C20.3504 2.84033 21.8476 3.81533 21.8476 5.97568V10.1473H19.6374V6.16483C19.6374 5.28815 19.1645 4.8881 18.5005 4.8881C17.8439 4.8881 17.3634 5.28815 17.3634 6.16483V10.1473H15.1602V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M22.4316 5.96827C22.4316 3.8148 23.9289 2.84033 25.7719 2.84033C27.6219 2.84033 29.1191 3.81533 29.1191 5.97568V10.1473H26.9089V6.16483C26.9089 5.28815 26.4359 4.8881 25.7719 4.8881C25.1154 4.8881 24.6349 5.28815 24.6349 6.16483V10.1473H22.4316V5.96827Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M7.40511 6.68957C7.40511 8.7236 6.02815 10.3227 4.17816 10.3227C3.23907 10.3227 2.61071 9.94378 2.19358 9.40371V10.1404H0.0605469V0.0405273H2.26381V3.91939C2.68041 3.42158 3.28802 3.07069 4.17763 3.07069C6.02759 3.07069 7.40511 4.66981 7.40511 6.68957ZM2.17229 6.69642C2.17229 7.60802 2.77937 8.2744 3.64823 8.2744C4.53783 8.2744 5.13107 7.59372 5.13107 6.69642C5.13107 5.79912 4.53783 5.11844 3.64823 5.11844C2.77937 5.11844 2.17229 5.78482 2.17229 6.69642Z", fill: color }), jsxRuntime.jsx("path", { className: "bunny-icon-path", d: "M38.966 8.94801C38.966 9.76181 38.2668 10.4631 37.4618 10.4631C36.6499 10.4631 35.9434 9.76181 35.9434 8.94801C35.9434 8.14846 36.6494 7.46094 37.4618 7.46094C38.2668 7.46094 38.966 8.14846 38.966 8.94801Z", fill: color })] })), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsxRuntime.jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
|
|
20201
|
-
};
|
|
20202
|
-
|
|
20203
|
-
var Footer = function (_a) {
|
|
20204
|
-
var className = _a.className;
|
|
20205
|
-
var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
|
|
20206
|
-
var isMobile = common.useIsMobile();
|
|
20207
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-shrink-0 ".concat(isMobile ? 'bunny-flex-col bunny-gap-2 bunny-grow' : '', " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-3" }, { children: [termsUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsxRuntime.jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsxRuntime.jsx(BunnyMarketingLink, {})] })));
|
|
20208
|
-
};
|
|
20209
|
-
var BunnyMarketingLink = function () {
|
|
20210
|
-
var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
|
|
20211
|
-
var isMobile = common.useIsMobile();
|
|
20212
|
-
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-end bunny-justify-end ".concat(isMobile ? '' : 'grow') }, { children: jsxRuntime.jsx(StyledBunnyLink, __assign({ className: "bunny-flex bunny-items-end bunny-justify-end bunny-text-slate-400", href: "https://bunny.com/", rel: "noopener noreferrer", target: "_blank" }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsxRuntime.jsx("div", __assign({ style: { paddingTop: '5px' } }, { children: jsxRuntime.jsx(BunnyFooterIcon, { color: isHovered ? common.PRIMARY_COLOR : common.SLATE_400 }) }))] })) })) })));
|
|
20213
|
-
};
|
|
20214
|
-
var StyedLink = styled__default["default"].a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"])), common.SLATE_400, common.SLATE_500);
|
|
20215
|
-
var StyledBunnyLink = styled__default["default"](StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), common.PRIMARY_COLOR);
|
|
20216
|
-
var templateObject_1$5, templateObject_2$1;
|
|
20217
|
-
|
|
20218
20322
|
var MUTATION$1 = "\nmutation accountUpdate(\n $id: ID!,\n $attributes: AccountAttributes!) {\n accountUpdate(\n id: $id,\n attributes: $attributes\n ) {\n account {\n id\n billingCountry\n billingState\n billingStreet\n billingCity\n billingZip\n name\n }\n errors\n }\n }\n";
|
|
20219
20323
|
var accountUpdate = function (_a) {
|
|
20220
20324
|
var accountId = _a.accountId, attributes = _a.attributes, token = _a.token, apiHost = _a.apiHost;
|
|
@@ -20289,10 +20393,10 @@ var FormBillingState = function (_a) {
|
|
|
20289
20393
|
|
|
20290
20394
|
var QuoteCheckout = function (_a) {
|
|
20291
20395
|
var account = _a.account, onSuccess = _a.onSuccess, onFail = _a.onFail, quote = _a.quote, taxationRequiredAccountFields = _a.taxationRequiredAccountFields;
|
|
20292
|
-
var
|
|
20396
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
20293
20397
|
var token = useToken();
|
|
20294
20398
|
var isMobile = common.useIsMobile();
|
|
20295
|
-
var
|
|
20399
|
+
var _b = react.useState(false), isSaving = _b[0], setIsSaving = _b[1];
|
|
20296
20400
|
var paymentRequired = getQuoteAmountDue(quote) > 0;
|
|
20297
20401
|
var checkoutMutation = reactQuery.useMutation({
|
|
20298
20402
|
mutationFn: function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -20300,9 +20404,9 @@ var QuoteCheckout = function (_a) {
|
|
|
20300
20404
|
switch (_a.label) {
|
|
20301
20405
|
case 0:
|
|
20302
20406
|
if (!quote)
|
|
20303
|
-
throw new Error(
|
|
20407
|
+
throw new Error('Quote is required');
|
|
20304
20408
|
if (paymentRequired)
|
|
20305
|
-
throw new Error(
|
|
20409
|
+
throw new Error('Payment is required');
|
|
20306
20410
|
return [4 /*yield*/, checkout({ quoteId: quote.id, token: token, apiHost: apiHost })];
|
|
20307
20411
|
case 1: return [2 /*return*/, _a.sent()];
|
|
20308
20412
|
}
|
|
@@ -20323,17 +20427,17 @@ var QuoteCheckout = function (_a) {
|
|
|
20323
20427
|
}
|
|
20324
20428
|
if (taxationRequiredAccountFields)
|
|
20325
20429
|
return (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsx(TaxationForm, { account: account, quote: quote }) })));
|
|
20326
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: paymentRequired ? (jsxRuntime.jsx(PaymentForm, { onFail: onFail, onPaymentSuccess: onSuccess, quote: quote })) : (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(isMobile ?
|
|
20430
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: paymentRequired ? (jsxRuntime.jsx(PaymentForm, { onFail: onFail, onPaymentSuccess: onSuccess, quote: quote })) : (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(isMobile ? 'bunny-shadow-padding-x' : '') }, { children: [jsxRuntime.jsx(antd.Button, __assign({ onClick: handleCheckoutNoPayment, type: "primary" }, { children: isSaving ? 'Processing...' : 'Complete order' })), jsxRuntime.jsx("div", __assign({ className: "bunny-text-xs bunny-text-slate-500" }, { children: "No payment is required" }))] })) }))) }));
|
|
20327
20431
|
};
|
|
20328
20432
|
var PaymentFormWrapper = function (_a) {
|
|
20329
20433
|
var children = _a.children, setMaxHeight = _a.setMaxHeight, className = _a.className;
|
|
20330
20434
|
var isMobile = common.useIsMobile();
|
|
20331
|
-
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-6 bunny-shrink-0 ".concat(isMobile ?
|
|
20435
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-6 bunny-shrink-0 ".concat(isMobile ? 'bunny-w-full bunny-shadow-padding-xb' : '', " ").concat(className), style: __assign({}, (isMobile
|
|
20332
20436
|
? setMaxHeight
|
|
20333
|
-
? { maxHeight:
|
|
20437
|
+
? { maxHeight: '60vh' }
|
|
20334
20438
|
: {}
|
|
20335
20439
|
: {
|
|
20336
|
-
width:
|
|
20440
|
+
width: '350px',
|
|
20337
20441
|
})) }, { children: children })));
|
|
20338
20442
|
};
|
|
20339
20443
|
|
|
@@ -20350,18 +20454,15 @@ var Checkout = function (_a) {
|
|
|
20350
20454
|
var queryClient = reactQuery.useQueryClient();
|
|
20351
20455
|
// Queries
|
|
20352
20456
|
var _d = reactQuery.useQuery({
|
|
20353
|
-
queryKey: [
|
|
20457
|
+
queryKey: ['getTaxationRequiredAccountFields', token],
|
|
20354
20458
|
queryFn: function () { return getTaxationRequiredAccountFields({ apiHost: apiHost, token: token }); },
|
|
20355
20459
|
enabled: Boolean(quote),
|
|
20356
20460
|
staleTime: 0,
|
|
20357
20461
|
}), taxationRequiredAccountFields = _d.data, isLoadingTaxationRequiredAccountFields = _d.isLoading;
|
|
20358
20462
|
var _e = reactQuery.useQuery({
|
|
20359
|
-
queryKey: [
|
|
20360
|
-
queryFn: function () {
|
|
20361
|
-
|
|
20362
|
-
},
|
|
20363
|
-
enabled: Boolean(quote === null || quote === void 0 ? void 0 : quote.accountId) &&
|
|
20364
|
-
((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
|
|
20463
|
+
queryKey: ['account', quote === null || quote === void 0 ? void 0 : quote.accountId],
|
|
20464
|
+
queryFn: function () { return (quote === null || quote === void 0 ? void 0 : quote.accountId) && common.getAccount({ id: quote.accountId, apiHost: apiHost, token: token }); },
|
|
20465
|
+
enabled: Boolean(quote === null || quote === void 0 ? void 0 : quote.accountId) && ((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
|
|
20365
20466
|
}), account = _e.data, isLoadingAccount = _e.isLoading;
|
|
20366
20467
|
reactQuery.useQuery({
|
|
20367
20468
|
queryKey: queryKeyFactory.createQuoteTaxCalculateKey({
|
|
@@ -20383,7 +20484,7 @@ var Checkout = function (_a) {
|
|
|
20383
20484
|
updatedQuote = _a.sent();
|
|
20384
20485
|
if (updatedQuote) {
|
|
20385
20486
|
quoteKey = queryKeyFactory.createObjectKey({
|
|
20386
|
-
objectName:
|
|
20487
|
+
objectName: 'editingQuote',
|
|
20387
20488
|
id: updatedQuote.id,
|
|
20388
20489
|
token: token,
|
|
20389
20490
|
});
|
|
@@ -20412,7 +20513,7 @@ var Checkout = function (_a) {
|
|
|
20412
20513
|
return null;
|
|
20413
20514
|
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-fixed bunny-top-0 bunny-left-0 bunny-right-0 bunny-bottom-0 bunny-bg-slate-50 bunny-overflow-auto", style: {
|
|
20414
20515
|
zIndex: 1001,
|
|
20415
|
-
} }, { children: jsxRuntime.jsxs("div", __assign({ className: pageWrapperClassName(isMobile) }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full" }, { children: jsxRuntime.jsx(icons.CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-gap-6 bunny-pt-4 ".concat(isMobile ?
|
|
20516
|
+
} }, { children: jsxRuntime.jsxs("div", __assign({ className: pageWrapperClassName(isMobile) }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full" }, { children: jsxRuntime.jsx(icons.CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-gap-6 bunny-pt-4 ".concat(isMobile ? 'bunny-flex-col' : 'bunny-shadow-padding-xb') }, { children: [((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_b = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _b === void 0 ? void 0 : _b.html)) && (jsxRuntime.jsx(InvoiceQuoteView, { html: invoice ? invoice.html : quote ? quote.formattedQuote.html : '' })), !isMobile && ((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_c = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _c === void 0 ? void 0 : _c.html)) && (jsxRuntime.jsx(antd.Divider, { className: "bunny-h-full", type: "vertical" })), invoice ? (jsxRuntime.jsx("div", __assign({ className: "bunny-w-full bunny-pt-12" }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: invoice }) }))) : quote ? (jsxRuntime.jsx(QuoteCheckout, { account: account, onFail: function (error) {
|
|
20416
20517
|
onFail(error);
|
|
20417
20518
|
}, onSuccess: onSuccess, quote: quote, taxationRequiredAccountFields: taxationRequiredAccountFields, token: token })) : (jsxRuntime.jsx(PaymentForm, { onFail: function (error) {
|
|
20418
20519
|
onFail(error);
|
|
@@ -20437,15 +20538,12 @@ var SubscriptionsContext = react.createContext({});
|
|
|
20437
20538
|
|
|
20438
20539
|
var QUOTE_CHARGE_UPDATE = "\n mutation QuoteChargeUpdate (\n $discount: Float,\n $endDate: ISO8601Date,\n $name: String,\n $price: Float,\n $quantity: Int,\n $quoteChargeId: ID!\n $startDate: ISO8601Date\n $subtotal: Float,\n ) {\n quoteChargeUpdate(\n discount: $discount\n endDate: $endDate\n name: $name\n price: $price\n quantity: $quantity\n quoteChargeId: $quoteChargeId\n startDate: $startDate\n subtotal: $subtotal\n ) {\n quoteCharge {\n id\n }\n }\n }\n";
|
|
20439
20540
|
var quoteChargeUpdate = function (_a) {
|
|
20440
|
-
var discount = _a.discount,
|
|
20441
|
-
// endDate,
|
|
20442
|
-
name = _a.name, price = _a.price, quantity = _a.quantity, quoteChargeId = _a.quoteChargeId, startDate = _a.startDate, subtotal = _a.subtotal, apiHost = _a.apiHost, token = _a.token;
|
|
20541
|
+
var discount = _a.discount, name = _a.name, price = _a.price, quantity = _a.quantity, quoteChargeId = _a.quoteChargeId, startDate = _a.startDate, subtotal = _a.subtotal, apiHost = _a.apiHost, token = _a.token;
|
|
20443
20542
|
return common.gqlRequest({
|
|
20444
20543
|
query: QUOTE_CHARGE_UPDATE,
|
|
20445
20544
|
vars: {
|
|
20446
20545
|
subtotal: subtotal,
|
|
20447
20546
|
discount: discount,
|
|
20448
|
-
// endDate,
|
|
20449
20547
|
name: name,
|
|
20450
20548
|
price: price,
|
|
20451
20549
|
quantity: quantity,
|
|
@@ -20686,7 +20784,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20686
20784
|
onSuccess: function () {
|
|
20687
20785
|
queryClient.invalidateQueries({
|
|
20688
20786
|
queryKey: common.QueryKeyFactory.default.createQuoteKey({
|
|
20689
|
-
id: quoteIdRef.current ||
|
|
20787
|
+
id: quoteIdRef.current || "",
|
|
20690
20788
|
token: token,
|
|
20691
20789
|
}),
|
|
20692
20790
|
});
|
|
@@ -20695,7 +20793,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20695
20793
|
// Queries
|
|
20696
20794
|
var quote = reactQuery.useQuery({
|
|
20697
20795
|
queryKey: common.QueryKeyFactory.default.createQuoteKey({
|
|
20698
|
-
id: quoteIdRef.current ||
|
|
20796
|
+
id: quoteIdRef.current || "",
|
|
20699
20797
|
token: token,
|
|
20700
20798
|
}),
|
|
20701
20799
|
queryFn: function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -20703,7 +20801,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20703
20801
|
return __generator(this, function (_a) {
|
|
20704
20802
|
switch (_a.label) {
|
|
20705
20803
|
case 0: return [4 /*yield*/, getQuote({
|
|
20706
|
-
id: quoteIdRef.current ||
|
|
20804
|
+
id: quoteIdRef.current || "",
|
|
20707
20805
|
token: token,
|
|
20708
20806
|
apiHost: apiHost,
|
|
20709
20807
|
})];
|
|
@@ -20716,7 +20814,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20716
20814
|
}).data;
|
|
20717
20815
|
react.useEffect(function () {
|
|
20718
20816
|
if (!(upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id)) {
|
|
20719
|
-
console.error(
|
|
20817
|
+
console.error("upgradingSubscription is undefined");
|
|
20720
20818
|
return;
|
|
20721
20819
|
}
|
|
20722
20820
|
createQuote.mutate({
|
|
@@ -20739,7 +20837,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20739
20837
|
var handleCheckoutSuccess = function () {
|
|
20740
20838
|
queryClient.invalidateQueries({
|
|
20741
20839
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
20742
|
-
pluralType:
|
|
20840
|
+
pluralType: "subscriptions",
|
|
20743
20841
|
token: token,
|
|
20744
20842
|
}),
|
|
20745
20843
|
});
|
|
@@ -20747,11 +20845,11 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20747
20845
|
queryKey: common.QueryKeyFactory.default.transactionsKey({ token: token }),
|
|
20748
20846
|
});
|
|
20749
20847
|
setPayModalVisible(false);
|
|
20750
|
-
showSuccessNotification(
|
|
20848
|
+
showSuccessNotification("Your subscription has been created", "Checkout successful");
|
|
20751
20849
|
onCheckoutSuccess();
|
|
20752
20850
|
};
|
|
20753
20851
|
var onCheckoutFail = function (error) {
|
|
20754
|
-
handlePortalErrors
|
|
20852
|
+
handlePortalErrors(error);
|
|
20755
20853
|
};
|
|
20756
20854
|
function onChangeQuantity(chargeId, quantity) {
|
|
20757
20855
|
var quoteChange = quote === null || quote === void 0 ? void 0 : quote.quoteChanges.find(function (qc) { return qc.priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id); });
|
|
@@ -20760,11 +20858,11 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20760
20858
|
return ((_a = charge === null || charge === void 0 ? void 0 : charge.priceListCharge) === null || _a === void 0 ? void 0 : _a.id) === chargeId;
|
|
20761
20859
|
});
|
|
20762
20860
|
if (!token) {
|
|
20763
|
-
console.error(
|
|
20861
|
+
console.error("token is undefined");
|
|
20764
20862
|
return;
|
|
20765
20863
|
}
|
|
20766
20864
|
if (!quoteCharge) {
|
|
20767
|
-
console.error(
|
|
20865
|
+
console.error("quoteCharge not found");
|
|
20768
20866
|
return;
|
|
20769
20867
|
}
|
|
20770
20868
|
updateCharge({
|
|
@@ -20774,7 +20872,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
20774
20872
|
token: token,
|
|
20775
20873
|
});
|
|
20776
20874
|
}
|
|
20777
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ?
|
|
20875
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "flex ".concat(isMobile ? "bunny-flex-col bunny-gap-4" : "bunny-flex-row", " my-2 p-4 justify-between bg-white rounded-md ").concat(shadow ? "shadow-".concat(shadow) : "") }, { children: [jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? "bunny-flex bunny-flex-col" : "bunny-flex", " bunny-gap-4") }, { children: selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.charges.map(function (charge, index) {
|
|
20778
20876
|
var _a;
|
|
20779
20877
|
var quoteChange = quote === null || quote === void 0 ? void 0 : quote.quoteChanges.find(function (qc) { return qc.priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id); });
|
|
20780
20878
|
var chargeQuantity = (_a = quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.find(function (charge) { var _a; return ((_a = charge === null || charge === void 0 ? void 0 : charge.priceList) === null || _a === void 0 ? void 0 : _a.id) === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id); })) === null || _a === void 0 ? void 0 : _a.quantity;
|
|
@@ -21431,7 +21529,7 @@ var PlanManager = function (_a) {
|
|
|
21431
21529
|
// Queries
|
|
21432
21530
|
var _f = reactQuery.useQuery({
|
|
21433
21531
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
21434
|
-
pluralType:
|
|
21532
|
+
pluralType: "subscriptions",
|
|
21435
21533
|
token: token,
|
|
21436
21534
|
}),
|
|
21437
21535
|
queryFn: function () { return getSubscriptions({ isInPreviewMode: isInPreviewMode, token: token, apiHost: apiHost }); },
|
|
@@ -21440,20 +21538,29 @@ var PlanManager = function (_a) {
|
|
|
21440
21538
|
var quote = reactQuery.useQuery({
|
|
21441
21539
|
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
21442
21540
|
id: editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id,
|
|
21443
|
-
objectName:
|
|
21541
|
+
objectName: "editingQuote",
|
|
21444
21542
|
token: token,
|
|
21445
21543
|
}),
|
|
21446
21544
|
queryFn: function () {
|
|
21447
|
-
return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
|
|
21545
|
+
return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
|
|
21546
|
+
? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
|
|
21547
|
+
: undefined;
|
|
21448
21548
|
},
|
|
21449
21549
|
enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
|
|
21450
21550
|
}).data;
|
|
21451
21551
|
react.useEffect(function () {
|
|
21452
21552
|
if (subscriptionUpgradeId && !upgradingSubscription) {
|
|
21453
|
-
var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) {
|
|
21553
|
+
var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) {
|
|
21554
|
+
return subscription.id === subscriptionUpgradeId;
|
|
21555
|
+
});
|
|
21454
21556
|
setUpgradingSubscription(subscription);
|
|
21455
21557
|
}
|
|
21456
|
-
}, [
|
|
21558
|
+
}, [
|
|
21559
|
+
setUpgradingSubscription,
|
|
21560
|
+
subscriptionUpgradeId,
|
|
21561
|
+
subscriptions,
|
|
21562
|
+
upgradingSubscription,
|
|
21563
|
+
]);
|
|
21457
21564
|
react.useEffect(function () {
|
|
21458
21565
|
var observer = new IntersectionObserver(function (_a) {
|
|
21459
21566
|
var entry = _a[0];
|
|
@@ -21462,7 +21569,7 @@ var PlanManager = function (_a) {
|
|
|
21462
21569
|
root: null,
|
|
21463
21570
|
// 300px margin from top so that we don't transition to sticky when scrolling up to PlanPickerCheckoutBar from bottom of page
|
|
21464
21571
|
// 20px margin from bottom so PlanPickerCheckoutBar resizes at the right time
|
|
21465
|
-
rootMargin:
|
|
21572
|
+
rootMargin: "300px 0px -20px 0px",
|
|
21466
21573
|
threshold: 1.0,
|
|
21467
21574
|
});
|
|
21468
21575
|
var el = stickyRef.current;
|
|
@@ -21481,27 +21588,27 @@ var PlanManager = function (_a) {
|
|
|
21481
21588
|
});
|
|
21482
21589
|
queryClient.invalidateQueries({
|
|
21483
21590
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
21484
|
-
pluralType:
|
|
21591
|
+
pluralType: "subscriptions",
|
|
21485
21592
|
token: token,
|
|
21486
21593
|
}),
|
|
21487
21594
|
});
|
|
21488
|
-
showSuccessNotification(
|
|
21595
|
+
showSuccessNotification("Your plan has been updated", "Payment successful");
|
|
21489
21596
|
setPayModalVisible(false);
|
|
21490
21597
|
};
|
|
21491
21598
|
var onCancel = function () {
|
|
21492
21599
|
setPayModalVisible(false);
|
|
21493
21600
|
};
|
|
21494
21601
|
var onFail = function (error) {
|
|
21495
|
-
handlePortalErrors
|
|
21602
|
+
handlePortalErrors(error);
|
|
21496
21603
|
};
|
|
21497
21604
|
if (subscriptionsAreLoading && !isInPreviewMode)
|
|
21498
21605
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
21499
21606
|
return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [jsxRuntime.jsx(PreviewModeAdvisary, { isInPreviewMode: isInPreviewMode }), jsxRuntime.jsx(PageTitle, { onGoBack: function () {
|
|
21500
21607
|
if (isInPreviewMode)
|
|
21501
|
-
return showInfoNotification(
|
|
21608
|
+
return showInfoNotification("You are in preview mode");
|
|
21502
21609
|
setQuotePreviewData(undefined);
|
|
21503
21610
|
onChangePlanCancel();
|
|
21504
|
-
}, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, {}), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: defaultPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList }), jsxRuntime.jsx("div", { ref: stickyRef }), jsxRuntime.jsx("div", __assign({ className: "bunny-sticky bunny-bottom-4 bunny-transition-[margin] bunny-duration-300 ".concat(isSticky ?
|
|
21611
|
+
}, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, {}), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: defaultPaymentMethod, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList }), jsxRuntime.jsx("div", { ref: stickyRef }), jsxRuntime.jsx("div", __assign({ className: "bunny-sticky bunny-bottom-4 bunny-transition-[margin] bunny-duration-300 ".concat(isSticky ? "bunny-mx-4" : "bunny-mx-0") }, { children: jsxRuntime.jsx(PlanPickerCheckoutBarWrapper, { handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) }))] })));
|
|
21505
21612
|
};
|
|
21506
21613
|
|
|
21507
21614
|
var useCancelSubscription = function () {
|
|
@@ -22274,12 +22381,12 @@ var QuantityChangeDrawerDesktop = function (_a) {
|
|
|
22274
22381
|
};
|
|
22275
22382
|
|
|
22276
22383
|
var HideExpiredToggle = function (_a) {
|
|
22277
|
-
var hideExpired = _a.hideExpired, setHideExpired = _a.setHideExpired;
|
|
22384
|
+
var hideExpired = _a.hideExpired, setHideExpired = _a.setHideExpired; _a.visible;
|
|
22278
22385
|
var isMobile = common.useIsMobile();
|
|
22279
22386
|
var secondaryColor = react.useContext(BrandContext).secondaryColor;
|
|
22280
22387
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-4 bunny-pl-4" }, { children: [!isMobile && jsxRuntime.jsx(antd.Divider, { className: "bunny-h-5", type: "vertical" }), jsxRuntime.jsx(StyledCheckbox, { children: jsxRuntime.jsx(antd.Checkbox, __assign({ checked: hideExpired, onChange: function (e) { return setHideExpired(e.target.checked); }, style: {
|
|
22281
22388
|
color: secondaryColor,
|
|
22282
|
-
} }, { children: isMobile ?
|
|
22389
|
+
} }, { children: isMobile ? "Hide inactive" : "Hide inactive subscriptions" })) })] })));
|
|
22283
22390
|
};
|
|
22284
22391
|
var StyledCheckbox = styled__default["default"].div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .ant-checkbox-wrapper span {\n padding-inline-end: 0 !important;\n }\n"], ["\n .ant-checkbox-wrapper span {\n padding-inline-end: 0 !important;\n }\n"])));
|
|
22285
22392
|
var templateObject_1;
|
|
@@ -22301,25 +22408,25 @@ var SubscriptionsNavigation = function (_a) {
|
|
|
22301
22408
|
var canShowChangeQuantitiesButton = canShowChangeQuantities({
|
|
22302
22409
|
subscriptions: subscriptions,
|
|
22303
22410
|
});
|
|
22304
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMobile &&
|
|
22411
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMobile && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-grow bunny-gap-2 ".concat(isMobile ? "bunny-flex-col" : "bunny-justify-end") }, { children: canShowChangeQuantitiesButton && (jsxRuntime.jsx(ChangeQuantitiesButton, { canShowChangeQuantitiesButton: canShowChangeQuantitiesButton, setQuantityDrawerOpen: setQuantityDrawerOpen })) }))] }));
|
|
22305
22412
|
};
|
|
22306
22413
|
|
|
22307
22414
|
var Text$1 = antd.Typography.Text;
|
|
22308
22415
|
var SubscriptionsWrapper = function (_a) {
|
|
22309
|
-
var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, _b = _a.isInPreviewMode, isInPreviewMode = _b === void 0 ? false : _b, productId = _a.productId, className = _a.className, _c = _a.styles, userStyles = _c === void 0 ? {} : _c, noSubscriptionsComponent = _a.noSubscriptionsComponent, _d = _a.hideTitle, hideTitle = _d === void 0 ? false : _d
|
|
22416
|
+
var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, _b = _a.isInPreviewMode, isInPreviewMode = _b === void 0 ? false : _b, productId = _a.productId, className = _a.className, _c = _a.styles, userStyles = _c === void 0 ? {} : _c, noSubscriptionsComponent = _a.noSubscriptionsComponent, _d = _a.hideTitle, hideTitle = _d === void 0 ? false : _d;
|
|
22310
22417
|
var defaultStyles = {
|
|
22311
22418
|
gap: 4,
|
|
22312
|
-
shadow:
|
|
22419
|
+
shadow: "sm",
|
|
22313
22420
|
subscriptionProductNameStyle: {
|
|
22314
|
-
fontSize:
|
|
22421
|
+
fontSize: "11px",
|
|
22315
22422
|
fontWeight: 500,
|
|
22316
22423
|
},
|
|
22317
22424
|
};
|
|
22318
22425
|
var styles = __assign(__assign({}, defaultStyles), userStyles);
|
|
22319
|
-
var
|
|
22320
|
-
var
|
|
22321
|
-
var
|
|
22322
|
-
var
|
|
22426
|
+
var _e = react.useState(undefined), upgradingSubscription = _e[0], setUpgradingSubscription = _e[1];
|
|
22427
|
+
var _f = react.useState(undefined), updatingChargeQuantityId = _f[0], setUpdatingChargeQuantityId = _f[1];
|
|
22428
|
+
var _g = react.useState(undefined), quotePreviewData = _g[0], setQuotePreviewData = _g[1];
|
|
22429
|
+
var _h = react.useState(null), subscriptionUpgradeId = _h[0], setSubscriptionUpgradeId = _h[1];
|
|
22323
22430
|
return (jsxRuntime.jsx(SubscriptionsContext.Provider, __assign({ value: {
|
|
22324
22431
|
gap: styles.gap,
|
|
22325
22432
|
shadow: styles.shadow,
|
|
@@ -22327,7 +22434,6 @@ var SubscriptionsWrapper = function (_a) {
|
|
|
22327
22434
|
subscriptionProductNameStyle: styles.subscriptionProductNameStyle,
|
|
22328
22435
|
productId: productId,
|
|
22329
22436
|
isInPreviewMode: isInPreviewMode,
|
|
22330
|
-
hideExpired: hideExpired,
|
|
22331
22437
|
upgradingSubscription: upgradingSubscription,
|
|
22332
22438
|
setUpgradingSubscription: setUpgradingSubscription,
|
|
22333
22439
|
updatingChargeQuantityId: updatingChargeQuantityId,
|
|
@@ -22336,22 +22442,21 @@ var SubscriptionsWrapper = function (_a) {
|
|
|
22336
22442
|
setQuotePreviewData: setQuotePreviewData,
|
|
22337
22443
|
subscriptionUpgradeId: subscriptionUpgradeId,
|
|
22338
22444
|
setSubscriptionUpgradeId: setSubscriptionUpgradeId,
|
|
22339
|
-
} }, { children: jsxRuntime.jsx(Subscriptions, { handlePortalErrors: handlePortalErrors, companyName: companyName, noSubscriptionsComponent: noSubscriptionsComponent, hideTitle: hideTitle
|
|
22445
|
+
} }, { children: jsxRuntime.jsx(Subscriptions, { handlePortalErrors: handlePortalErrors, companyName: companyName, noSubscriptionsComponent: noSubscriptionsComponent, hideTitle: hideTitle }) })));
|
|
22340
22446
|
};
|
|
22341
22447
|
var Subscriptions = function (_a) {
|
|
22342
|
-
var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, noSubscriptionsComponent = _a.noSubscriptionsComponent, hideTitle = _a.hideTitle
|
|
22448
|
+
var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, noSubscriptionsComponent = _a.noSubscriptionsComponent, hideTitle = _a.hideTitle;
|
|
22343
22449
|
// Context
|
|
22344
22450
|
var token = useToken();
|
|
22345
|
-
var
|
|
22346
|
-
var
|
|
22451
|
+
var _b = react.useContext(BunnyContext), apiHost = _b.apiHost; _b.graphQLClient;
|
|
22452
|
+
var _c = react.useContext(SubscriptionsContext), setUpgradingSubscription = _c.setUpgradingSubscription, updatingChargeQuantityId = _c.updatingChargeQuantityId, setUpdatingChargeQuantityId = _c.setUpdatingChargeQuantityId, setSubscriptionUpgradeId = _c.setSubscriptionUpgradeId, className = _c.className, isInPreviewMode = _c.isInPreviewMode;
|
|
22347
22453
|
// Local state
|
|
22348
|
-
var
|
|
22349
|
-
var
|
|
22350
|
-
var
|
|
22351
|
-
var
|
|
22352
|
-
var
|
|
22353
|
-
var
|
|
22354
|
-
var hideExpired = hideExpiredOverride !== null && hideExpiredOverride !== void 0 ? hideExpiredOverride : hideExpiredState;
|
|
22454
|
+
var _d = react.useState(), editingQuoteData = _d[0], setEditingQuoteData = _d[1];
|
|
22455
|
+
var _e = react.useState(false), payModalVisible = _e[0], setPayModalVisible = _e[1];
|
|
22456
|
+
var _f = react.useState(true), hideExpired = _f[0], setHideExpired = _f[1];
|
|
22457
|
+
var _g = react.useState(false), quantityDrawerOpen = _g[0], setQuantityDrawerOpen = _g[1];
|
|
22458
|
+
var _h = react.useState(false), expiredSwitchVisible = _h[0], setExpiredSwitchVisible = _h[1];
|
|
22459
|
+
var _j = react.useState(false), isChangingPlan = _j[0], setIsChangingPlan = _j[1];
|
|
22355
22460
|
// Hooks
|
|
22356
22461
|
var queryClient = reactQuery.useQueryClient();
|
|
22357
22462
|
var showSuccessNotification = common.useSuccessNotification();
|
|
@@ -22366,21 +22471,23 @@ var Subscriptions = function (_a) {
|
|
|
22366
22471
|
var quote = reactQuery.useQuery({
|
|
22367
22472
|
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
22368
22473
|
id: editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id,
|
|
22369
|
-
objectName:
|
|
22474
|
+
objectName: "editingQuote",
|
|
22370
22475
|
token: token,
|
|
22371
22476
|
}),
|
|
22372
22477
|
queryFn: function () {
|
|
22373
|
-
return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
|
|
22478
|
+
return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id)
|
|
22479
|
+
? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost })
|
|
22480
|
+
: undefined;
|
|
22374
22481
|
},
|
|
22375
22482
|
enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
|
|
22376
22483
|
}).data;
|
|
22377
|
-
var
|
|
22484
|
+
var _k = reactQuery.useQuery({
|
|
22378
22485
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
22379
|
-
pluralType:
|
|
22486
|
+
pluralType: "subscriptions",
|
|
22380
22487
|
token: token,
|
|
22381
22488
|
}),
|
|
22382
22489
|
queryFn: function () { return getSubscriptions({ token: token, apiHost: apiHost }); },
|
|
22383
|
-
}), subscriptions =
|
|
22490
|
+
}), subscriptions = _k.data, subscriptionsAreLoading = _k.isLoading;
|
|
22384
22491
|
// Mutations
|
|
22385
22492
|
var subscriptionCancel = reactQuery.useMutation({
|
|
22386
22493
|
mutationFn: function (subscription) {
|
|
@@ -22389,11 +22496,11 @@ var Subscriptions = function (_a) {
|
|
|
22389
22496
|
onSuccess: function () {
|
|
22390
22497
|
queryClient.invalidateQueries({
|
|
22391
22498
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
22392
|
-
pluralType:
|
|
22499
|
+
pluralType: "subscriptions",
|
|
22393
22500
|
token: token,
|
|
22394
22501
|
}),
|
|
22395
22502
|
});
|
|
22396
|
-
showSuccessNotification(
|
|
22503
|
+
showSuccessNotification("Subscription canceled");
|
|
22397
22504
|
},
|
|
22398
22505
|
});
|
|
22399
22506
|
// Handlers
|
|
@@ -22419,19 +22526,19 @@ var Subscriptions = function (_a) {
|
|
|
22419
22526
|
});
|
|
22420
22527
|
queryClient.invalidateQueries({
|
|
22421
22528
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
22422
|
-
pluralType:
|
|
22529
|
+
pluralType: "subscriptions",
|
|
22423
22530
|
token: token,
|
|
22424
22531
|
}),
|
|
22425
22532
|
});
|
|
22426
|
-
showSuccessNotification(
|
|
22533
|
+
showSuccessNotification("Your plan has been updated", "Payment successful");
|
|
22427
22534
|
setPayModalVisible(false);
|
|
22428
|
-
|
|
22535
|
+
setHideExpired(true);
|
|
22429
22536
|
};
|
|
22430
22537
|
var onCancel = function () {
|
|
22431
22538
|
setPayModalVisible(false);
|
|
22432
22539
|
};
|
|
22433
22540
|
var onFail = function (error) {
|
|
22434
|
-
handlePortalErrors
|
|
22541
|
+
handlePortalErrors(error);
|
|
22435
22542
|
};
|
|
22436
22543
|
var onClose = function () {
|
|
22437
22544
|
if (editingQuoteData) {
|
|
@@ -22455,7 +22562,7 @@ var Subscriptions = function (_a) {
|
|
|
22455
22562
|
});
|
|
22456
22563
|
react.useEffect(function () {
|
|
22457
22564
|
if (allSubscriptionsExpired && subscriptions.length > 0)
|
|
22458
|
-
|
|
22565
|
+
setHideExpired(false);
|
|
22459
22566
|
}, [allSubscriptionsExpired, subscriptions]);
|
|
22460
22567
|
react.useEffect(function () {
|
|
22461
22568
|
if (hasExpiredOrCanceledSubscriptions && subscriptions.length > 0)
|
|
@@ -22466,14 +22573,12 @@ var Subscriptions = function (_a) {
|
|
|
22466
22573
|
setIsChangingPlan(false);
|
|
22467
22574
|
}, handlePortalErrors: handlePortalErrors }));
|
|
22468
22575
|
}
|
|
22469
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title:
|
|
22576
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title: "Subscriptions" }) : null, jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsxs(Text$1, __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: { minWidth: "137px" } }, { children: [hideExpired ? "Active subscriptions" : "All subscriptions", isMobile && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired, visible: expiredSwitchVisible }))] })) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsxRuntime.jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsxRuntime.jsx("div", __assign({ className: "bunny-pt-4 bunny-pb-2" }, { children: jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsxRuntime.jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: defaultPaymentMethod })] })));
|
|
22470
22577
|
};
|
|
22471
22578
|
var PageHeaderWithActions = function (_a) {
|
|
22472
22579
|
var children = _a.children, title = _a.title;
|
|
22473
22580
|
var isMobile = common.useIsMobile();
|
|
22474
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-pb-4 ".concat(isMobile
|
|
22475
|
-
? 'bunny-flex-col bunny-gap-2'
|
|
22476
|
-
: 'bunny-items-center bunny-justify-between bunny-h-8') }, { children: [title && jsxRuntime.jsx(PageSubTitle, { title: title }), children] })));
|
|
22581
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-pb-4 ".concat(isMobile ? "bunny-flex-col bunny-gap-2" : "bunny-items-center bunny-justify-between bunny-h-8") }, { children: [jsxRuntime.jsx(PageSubTitle, { title: title }), children] })));
|
|
22477
22582
|
};
|
|
22478
22583
|
var PageSubTitle = function (_a) {
|
|
22479
22584
|
var title = _a.title;
|