@bunnyapp/components 1.3.0-beta.4 → 1.3.0-beta.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +1360 -920
- package/dist/cjs/src/components/BillingDetails/BillingDetails.d.ts +1 -1
- package/dist/cjs/src/components/Card.d.ts +0 -1
- package/dist/cjs/src/components/CustomizedAntdComponents/Tag.d.ts +1 -1
- package/dist/cjs/src/components/Invoice/Invoice.d.ts +4 -1
- package/dist/cjs/src/components/PaymentForm/CheckoutFooter.d.ts +1 -1
- package/dist/cjs/src/components/PaymentForm/DemoPay/demoPayUtils.d.ts +2 -2
- package/dist/cjs/src/components/PaymentForm/PaymentForm.d.ts +3 -4
- package/dist/cjs/src/components/PaymentForm/PaymentMethodDetails.d.ts +1 -1
- package/dist/cjs/src/components/PaymentForm/hooks/usePaymentMethodSelectorPlugin.d.ts +0 -1
- package/dist/cjs/src/components/PlanManagerQuoteProvider.d.ts +19 -0
- package/dist/cjs/src/components/Quote/Quote.stories.d.ts +30 -25
- package/dist/cjs/src/components/QuotePreviewProvider.d.ts +0 -2
- package/dist/cjs/src/components/Subscriptions/AddonIndentation.d.ts +8 -0
- package/dist/cjs/src/components/Subscriptions/AddonSubscriptionCards.d.ts +7 -0
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/PriceListGrid.d.ts +3 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/CheckoutBarSummarySection.d.ts +2 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/CheckoutButton.d.ts +2 -1
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/PlanPickerCheckoutBar.d.ts +1 -2
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/EverythingPlanFeatures.d.ts +5 -1
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PlanAddonsCard.d.ts +11 -0
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListCardDesktop.d.ts +4 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListGridDesktop.d.ts +3 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerMobile/PriceListCardMobile.d.ts +1 -2
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerMobile/PriceListGridMobile.d.ts +2 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCard.d.ts +3 -2
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardButton.d.ts +2 -2
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardPrice.d.ts +2 -1
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardTitle.d.ts +1 -1
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/priceListCardUtils.d.ts +1 -3
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/{PriceListSelector.d.ts → priceListSelector/PriceListSelector.d.ts} +1 -2
- package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListSelector/PriceListSelectorContext.d.ts +9 -0
- package/dist/cjs/src/components/Subscriptions/QuotePreviewData.d.ts +6 -0
- package/dist/cjs/src/components/Subscriptions/SubscriptionRequests.d.ts +0 -1
- package/dist/cjs/src/components/Subscriptions/Subscriptions.d.ts +1 -1
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/SubscriptionCardActions.d.ts +2 -2
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/SubscriptionsList.d.ts +1 -1
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/subscriptionCardDesktop/SubscriptionCardDesktop.d.ts +2 -1
- package/dist/cjs/src/components/Subscriptions/subscriptionsList/subscriptionUtils.d.ts +2 -1
- package/dist/cjs/src/components/TaxationForm.d.ts +2 -2
- package/dist/cjs/src/components/Transactions/Transactions.d.ts +3 -1
- package/dist/cjs/src/components/Transactions/TransactionsListContext.d.ts +1 -0
- package/dist/cjs/src/graphql/QuoteRequests.d.ts +17 -1
- package/dist/cjs/src/graphql/mutations/quoteAddonCreate.d.ts +7 -0
- package/dist/cjs/src/graphql/mutations/quoteChangeCreate.d.ts +8 -0
- package/dist/cjs/src/graphql/mutations/quoteChangeDelete.d.ts +6 -0
- package/dist/cjs/src/graphql/mutations/quoteChargeDelete.d.ts +2 -1
- package/dist/cjs/src/graphql/mutations/quoteCompose.d.ts +0 -1
- package/dist/cjs/src/graphql/mutations/quoteCreate.d.ts +8 -0
- package/dist/cjs/src/graphql/mutations/quoteCreateWithDeal.d.ts +10 -0
- package/dist/cjs/src/graphql/mutations/subscriptionTrialConvert.d.ts +7 -0
- package/dist/cjs/src/graphql/queries/getCurrentUserData.d.ts +13 -0
- package/dist/cjs/src/graphql/queries/getFeatureUsage.d.ts +1 -4
- package/dist/cjs/src/graphql/queries/getFormattedQuote.d.ts +2 -4
- package/dist/cjs/src/graphql/queries/getPriceListChangeOptions.d.ts +2 -1
- package/dist/cjs/src/graphql/queries/getQuote.d.ts +3 -1
- package/dist/cjs/src/hooks/quotes/useQuoteCreate.d.ts +12 -0
- package/dist/cjs/src/hooks/quotes/useQuoteUpdateFeatureAddon.d.ts +2 -3
- package/dist/cjs/src/hooks/quotes/useSendAcceptQuote.d.ts +0 -1
- package/dist/cjs/src/hooks/useCurrentUserData.d.ts +10 -1
- package/dist/cjs/src/hooks/usePaymentPlugins.d.ts +2 -2
- package/dist/cjs/src/hooks/useToggleAddonQuoteChange.d.ts +7 -0
- package/dist/cjs/src/mocks/handlers.d.ts +1 -1
- package/dist/cjs/src/utils/addonPlanUtils.d.ts +4 -0
- package/dist/cjs/src/utils/couponUtils.d.ts +2 -0
- package/dist/esm/index.js +1361 -921
- package/dist/esm/src/components/BillingDetails/BillingDetails.d.ts +1 -1
- package/dist/esm/src/components/Card.d.ts +0 -1
- package/dist/esm/src/components/CustomizedAntdComponents/Tag.d.ts +1 -1
- package/dist/esm/src/components/Invoice/Invoice.d.ts +4 -1
- package/dist/esm/src/components/PaymentForm/CheckoutFooter.d.ts +1 -1
- package/dist/esm/src/components/PaymentForm/DemoPay/demoPayUtils.d.ts +2 -2
- package/dist/esm/src/components/PaymentForm/PaymentForm.d.ts +3 -4
- package/dist/esm/src/components/PaymentForm/PaymentMethodDetails.d.ts +1 -1
- package/dist/esm/src/components/PaymentForm/hooks/usePaymentMethodSelectorPlugin.d.ts +0 -1
- package/dist/esm/src/components/PlanManagerQuoteProvider.d.ts +19 -0
- package/dist/esm/src/components/Quote/Quote.stories.d.ts +30 -25
- package/dist/esm/src/components/QuotePreviewProvider.d.ts +0 -2
- package/dist/esm/src/components/Subscriptions/AddonIndentation.d.ts +8 -0
- package/dist/esm/src/components/Subscriptions/AddonSubscriptionCards.d.ts +7 -0
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/PriceListGrid.d.ts +3 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/CheckoutBarSummarySection.d.ts +2 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/CheckoutButton.d.ts +2 -1
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/checkoutBar/PlanPickerCheckoutBar.d.ts +1 -2
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/EverythingPlanFeatures.d.ts +5 -1
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PlanAddonsCard.d.ts +11 -0
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListCardDesktop.d.ts +4 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListGridDesktop.d.ts +3 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerMobile/PriceListCardMobile.d.ts +1 -2
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerMobile/PriceListGridMobile.d.ts +2 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCard.d.ts +3 -2
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardButton.d.ts +2 -2
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardPrice.d.ts +2 -1
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardTitle.d.ts +1 -1
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/priceListCardUtils.d.ts +1 -3
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/{PriceListSelector.d.ts → priceListSelector/PriceListSelector.d.ts} +1 -2
- package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListSelector/PriceListSelectorContext.d.ts +9 -0
- package/dist/esm/src/components/Subscriptions/QuotePreviewData.d.ts +6 -0
- package/dist/esm/src/components/Subscriptions/SubscriptionRequests.d.ts +0 -1
- package/dist/esm/src/components/Subscriptions/Subscriptions.d.ts +1 -1
- package/dist/esm/src/components/Subscriptions/subscriptionsList/SubscriptionCardActions.d.ts +2 -2
- package/dist/esm/src/components/Subscriptions/subscriptionsList/SubscriptionsList.d.ts +1 -1
- package/dist/esm/src/components/Subscriptions/subscriptionsList/subscriptionCardDesktop/SubscriptionCardDesktop.d.ts +2 -1
- package/dist/esm/src/components/Subscriptions/subscriptionsList/subscriptionUtils.d.ts +2 -1
- package/dist/esm/src/components/TaxationForm.d.ts +2 -2
- package/dist/esm/src/components/Transactions/Transactions.d.ts +3 -1
- package/dist/esm/src/components/Transactions/TransactionsListContext.d.ts +1 -0
- package/dist/esm/src/graphql/QuoteRequests.d.ts +17 -1
- package/dist/esm/src/graphql/mutations/quoteAddonCreate.d.ts +7 -0
- package/dist/esm/src/graphql/mutations/quoteChangeCreate.d.ts +8 -0
- package/dist/esm/src/graphql/mutations/quoteChangeDelete.d.ts +6 -0
- package/dist/esm/src/graphql/mutations/quoteChargeDelete.d.ts +2 -1
- package/dist/esm/src/graphql/mutations/quoteCompose.d.ts +0 -1
- package/dist/esm/src/graphql/mutations/quoteCreate.d.ts +8 -0
- package/dist/esm/src/graphql/mutations/quoteCreateWithDeal.d.ts +10 -0
- package/dist/esm/src/graphql/mutations/subscriptionTrialConvert.d.ts +7 -0
- package/dist/esm/src/graphql/queries/getCurrentUserData.d.ts +13 -0
- package/dist/esm/src/graphql/queries/getFeatureUsage.d.ts +1 -4
- package/dist/esm/src/graphql/queries/getFormattedQuote.d.ts +2 -4
- package/dist/esm/src/graphql/queries/getPriceListChangeOptions.d.ts +2 -1
- package/dist/esm/src/graphql/queries/getQuote.d.ts +3 -1
- package/dist/esm/src/hooks/quotes/useQuoteCreate.d.ts +12 -0
- package/dist/esm/src/hooks/quotes/useQuoteUpdateFeatureAddon.d.ts +2 -3
- package/dist/esm/src/hooks/quotes/useSendAcceptQuote.d.ts +0 -1
- package/dist/esm/src/hooks/useCurrentUserData.d.ts +10 -1
- package/dist/esm/src/hooks/usePaymentPlugins.d.ts +2 -2
- package/dist/esm/src/hooks/useToggleAddonQuoteChange.d.ts +7 -0
- package/dist/esm/src/mocks/handlers.d.ts +1 -1
- package/dist/esm/src/utils/addonPlanUtils.d.ts +4 -0
- package/dist/esm/src/utils/couponUtils.d.ts +2 -0
- package/dist/index.d.ts +12 -8
- package/package.json +2 -2
- package/dist/cjs/src/components/UpgradeFromTrial.d.ts +0 -6
- package/dist/esm/src/components/UpgradeFromTrial.d.ts +0 -6
- /package/dist/cjs/src/components/icons/{iDeal.d.ts → IDeal.d.ts} +0 -0
- /package/dist/esm/src/components/icons/{iDeal.d.ts → IDeal.d.ts} +0 -0
package/dist/cjs/index.js
CHANGED
|
@@ -56,7 +56,7 @@ function styleInject(css, ref) {
|
|
|
56
56
|
}
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
var css_248z = ":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.bunny-component-wrapper {\n box-sizing: border-box;\n}\n.bunny-component-wrapper * {\n box-sizing: border-box;\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-1 {\n grid-column: span 1 / span 1;\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-24 {\n margin-top: 6rem;\n margin-bottom: 6rem;\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-24 {\n margin-top: 6rem;\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-1\\/2 {\n height: 50%;\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-max-h-\\[calc\\(100vh-10rem\\)\\] {\n max-height: calc(100vh - 10rem);\n}\n.bunny-min-h-0 {\n min-height: 0px;\n}\n.bunny-w-1\\/2 {\n width: 50%;\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-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-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-flex-wrap {\n flex-wrap: wrap;\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-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-overflow-y-auto {\n overflow-y: auto;\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-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-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-12 {\n padding-left: 3rem;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pr-4 {\n padding-right: 1rem;\n}\n.bunny-pt-1 {\n padding-top: 0.25rem;\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-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity, 1));\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-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / 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.hover\\:bunny-text-orange-400:hover {\n --tw-text-opacity: 1;\n color: rgb(251 146 60 / var(--tw-text-opacity, 1));\n}\n.bunny-components .ant-upload-select-picture-card {\n margin: 0 !important;\n}\n.bunny-components .ant-upload {\n border-radius: 0.5rem !important;\n}\n.bunny-components .ant-checkbox-inner {\n border-color: #cccccc;\n}\n.bunny-components .ant-row {\n margin-bottom: 0px;\n}\n.bunny-components .ant-select-disabled .ant-select-selector .ant-select-selection-item {\n color: rgba(0, 0, 0, 0.25) !important;\n}\n.bunny-components .ant-input-number,\n.bunny-components .ant-input,\n.bunny-components .ant-picker,\n.bunny-components .ant-input-affix-wrapper,\n.bunny-components .ant-select-selector {\n font-size: 0.875rem !important;\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n color: #232323 !important;\n}\n.bunny-components .ant-input-affix-wrapper {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n}\n.bunny-components .ant-input-group-addon,\n.bunny-components .ant-input-number-group-addon {\n color: #475569 !important;\n}\n.bunny-components .ant-input-number-group-wrapper,\n.bunny-components .ant-input-number-affix-wrapper {\n width: 100%;\n}\n.bunny-components .ant-input-affix-wrapper input {\n border: none !important;\n}\n.bunny-components .ant-form-item {\n margin-bottom: 0;\n}\n.bunny-components .ant-form-item-label {\n text-transform: none !important;\n font-size: 0.75rem;\n padding-bottom: 2px !important;\n}\n.bunny-components .ant-form-item-label > label {\n width: 100%;\n color: #4b5563 !important;\n}\n.bunny-components .form .ant-form-item-label label {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n box-sizing: border-box;\n}\n.bunny-components .ant-form-item-explain,\n.bunny-components .ant-form-item-explain-error {\n font-size: 11px;\n min-height: 11px;\n line-height: 11px;\n padding-top: 2px;\n}\n.bunny-components .ant-timeline-item-content {\n font-size: smaller;\n}\n.bunny-components .ant-tree {\n font-size: 0.875rem;\n}\n.bunny-components .ant-tree-treenode {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-draggable-icon {\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-node-content-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-switcher {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-page-header {\n padding-left: 0;\n padding-right: 0;\n padding-top: 0;\n}\n.bunny-components .ant-tag {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n border-radius: 14px;\n font-weight: 500;\n white-space: nowrap;\n padding-inline-start: 0.625rem;\n padding-inline-end: 0.625rem;\n margin: 0;\n}\n.bunny-components .ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.bunny-components .ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.bunny-components .ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.bunny-components .ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.bunny-components .ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.bunny-components .ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.bunny-components .ant-tag-gray {\n color: #6b7280 !important;\n background: #e5e7eb !important;\n}\n.bunny-components .ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.bunny-components .ant-picker {\n width: 100%;\n}\n.bunny-components .ant-input,\n.bunny-components .ant-select,\n.bunny-components .ant-picker {\n height: 32px !important;\n}\n.bunny-components .ant-slider-dot {\n border: 2px solid #f0f0f0;\n}\n.bunny-components .ant-slider-dot-active {\n border-color: #ff5833;\n}\n.bunny-components .ant-slider-mark :last-child {\n transform: translateX(-75%) !important;\n}\n.bunny-components .ant-drawer-content {\n background: #f3f3f9ff;\n}\n.bunny-components .ant-drawer-body,\n.bunny-components .ant-layout {\n background: #f8fafc;\n}\n.bunny-components .vista-link {\n color: #1890ff;\n}\n.bunny-components .vista-link:hover {\n text-decoration: underline;\n cursor: pointer;\n}\n.bunny-components .ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.bunny-components .ant-popconfirm-message-text {\n width: 100% !important;\n}\n.bunny-components .ant-popconfirm-title {\n padding: 0;\n text-align: center;\n font-size: 0.875rem !important;\n width: 100% !important;\n}\n.bunny-components .ant-popconfirm-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n}\n.bunny-components .ant-popconfirm-buttons button {\n margin-inline-start: 0 !important;\n}\n.bunny-components .ant-pagination-item {\n display: flex !important;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-btn-primary:disabled {\n background: #eef0f2 !important;\n color: rgba(0, 0, 0, 0.25) !important;\n border: none;\n}\n.bunny-components .ant-btn {\n box-shadow: none;\n text-shadow: none;\n outline: none !important;\n line-height: 1;\n font-weight: normal;\n}\n.bunny-components .ant-btn-default .ant-btn-icon {\n color: #94a3b8;\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.bunny-components .ant-btn-default:hover .ant-btn-icon {\n color: #ff7f5c;\n}\n.bunny-components .ant-btn-default:disabled {\n border-color: rgba(113, 125, 148, 0.2) !important;\n}\n.bunny-components .ant-btn-primary:disabled {\n background-color: rgba(113, 125, 148, 0.1) !important;\n border-color: rgba(113, 125, 148, 0.1) !important;\n}\n.bunny-components .ant-btn-primary:hover:disabled,\n.bunny-components .ant-btn-primary:disabled {\n background-clip: padding-box;\n}\n.bunny-components .ant-select-selection-item-content {\n display: flex !important;\n align-items: center;\n}\n.bunny-components .ant-select-item {\n font-size: 0.875rem;\n}\n.bunny-components .ant-select-item-option-content {\n display: flex;\n align-items: center;\n white-space: nowrap !important;\n overflow: visible !important;\n text-overflow: default !important;\n font-size: 0.875rem;\n}\n.bunny-components .ant-select-arrow .anticon:not(.ant-select-suffix) {\n pointer-events: none;\n}\n.bunny-components .select-dropdown-blue-gray .ant-select-item-option {\n background-color: #fff !important;\n}\n.bunny-components .select-dropdown-blue-gray .ant-select-item-option-active {\n color: #ff5833;\n}\n.bunny-components .ant-dropdown-menu-items {\n padding-left: 0 !important;\n}\n.bunny-components .ant-dropdown-menu-item-active {\n background-color: transparent !important;\n}\n.bunny-components .ant-input-affix-wrapper.searchfield {\n background: white !important;\n}\n.bunny-components .ant-input-affix-wrapper.searchfield input {\n background: white !important;\n}\n.bunny-components .ant-input-affix-wrapper-focused {\n background: white !important;\n}\n.bunny-components .panel .ant-input-affix-wrapper.searchfield {\n background: #f8f8f8 !important;\n}\n.bunny-components .panel .ant-input-affix-wrapper.searchfield input {\n background: #f8f8f8 !important;\n}\n.bunny-components .ant-input-steps-hidden .ant-input-number-handler-wrap {\n display: none;\n}\n.bunny-components .ant-layout-header {\n height: 48px;\n}\n.bunny-components .ant-layout-sider-children {\n width: inherit;\n position: fixed;\n}\n.bunny-components .ant-menu-item-group-list {\n display: flex !important;\n flex-direction: column !important;\n align-items: flex-start !important;\n gap: 4px !important;\n}\n.bunny-components .group {\n display: flex;\n flex-direction: row;\n flex-flow: row wrap;\n box-sizing: border-box;\n}\n.bunny-components .select-datepicker {\n animation-duration: 0.35s !important;\n}\n.bunny-components .header-datepicker {\n top: 96px !important;\n animation-duration: 0s !important;\n}\n.bunny-components .ant-picker-header {\n border-bottom: none !important;\n}\n.bunny-components .ant-picker-content thead tr th {\n font-weight: 500;\n}\n.bunny-components .ant-picker-panel-container {\n border-radius: 0.375rem;\n}\n.bunny-components .ant-picker-cell-selected .custom-date-display {\n color: #ffffff;\n background-color: #ff5833;\n}\n.bunny-components .ant-picker-cell-today .custom-date-display {\n border: 1px solid #ff5833;\n}\n.bunny-components .ant-select:hover,\n.bunny-components * .cardElement:hover {\n border-color: #ff5833;\n}\n.bunny-components .ant-input-number {\n width: 100%;\n}\n.bunny-components .ant-input-number-focused {\n border-color: #ff5833 !important;\n background-color: #ffffff !important;\n}\n.bunny-components .ant-input-affix-wrapper-focused,\n.bunny-components .ant-input-number-focused,\n.bunny-components .ant-picker,\n.bunny-components .ant-input,\n.bunny-components .ant-select-focused .ant-select-selector,\n.bunny-components .ant-select-selector:focus,\n.bunny-components .ant-select-selector:active,\n.bunny-components .ant-select-open .ant-select-selector {\n box-shadow: none !important;\n}\n.bunny-components .ant-select-item-option-selected .ant-select-item-option-state {\n display: none !important;\n}\n.bunny-components .ant-form * input[type='text'].ant-input:not(:disabled),\n.bunny-components .ant-select-selection-item:not(:disabled) {\n color: #232323;\n}\n.bunny-components .ant-tabs-ink-bar {\n display: none !important;\n}\n.bunny-components .ant-tabs-tab.ant-tabs-tab-active {\n border-bottom: 2px solid #ff5833 !important;\n}\n.bunny-components .ant-tabs-tab {\n border-bottom: 2px solid transparent !important;\n padding-bottom: 14px !important;\n}\n.bunny-components .ant-upload-wrapper {\n display: flex;\n}\n.bunny-components .ant-form-item-label > label::after {\n display: none !important;\n}\n.bunny-components .ant-menu-item {\n display: flex !important;\n align-items: center !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 border-radius: 8px !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 font-size: 14px !important;\n overflow-wrap: break-word;\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: #ff5833 !important;\n font-weight: 500 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff5833;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-weight: 500 !important;\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.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";
|
|
59
|
+
var css_248z = ":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.bunny-component-wrapper {\n box-sizing: border-box;\n}\n.bunny-component-wrapper * {\n box-sizing: border-box;\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-1 {\n grid-column: span 1 / span 1;\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-mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n.bunny-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.bunny-my-24 {\n margin-top: 6rem;\n margin-bottom: 6rem;\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-ml-auto {\n margin-left: auto;\n}\n.bunny-mt-2 {\n margin-top: 0.5rem;\n}\n.bunny-mt-24 {\n margin-top: 6rem;\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-0\\.5 {\n height: 0.125rem;\n}\n.bunny-h-1\\/2 {\n height: 50%;\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-max-h-\\[calc\\(100vh-10rem\\)\\] {\n max-height: calc(100vh - 10rem);\n}\n.bunny-min-h-0 {\n min-height: 0px;\n}\n.bunny-w-0\\.5 {\n width: 0.125rem;\n}\n.bunny-w-1\\/2 {\n width: 50%;\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-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-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-flex-wrap {\n flex-wrap: wrap;\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-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-overflow-y-auto {\n overflow-y: auto;\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-gray-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(209 213 219 / var(--tw-bg-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-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-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-12 {\n padding-left: 3rem;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pr-4 {\n padding-right: 1rem;\n}\n.bunny-pt-1 {\n padding-top: 0.25rem;\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-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity, 1));\n}\n.bunny-text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity, 1));\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-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / 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.hover\\:bunny-text-orange-400:hover {\n --tw-text-opacity: 1;\n color: rgb(251 146 60 / var(--tw-text-opacity, 1));\n}\n.bunny-components .ant-upload-select-picture-card {\n margin: 0 !important;\n}\n.bunny-components .ant-upload {\n border-radius: 0.5rem !important;\n}\n.bunny-components .ant-checkbox-inner {\n border-color: #cccccc;\n}\n.bunny-components .ant-row {\n margin-bottom: 0px;\n}\n.bunny-components .ant-select-disabled .ant-select-selector .ant-select-selection-item {\n color: rgba(0, 0, 0, 0.25) !important;\n}\n.bunny-components .ant-input-number,\n.bunny-components .ant-input,\n.bunny-components .ant-picker,\n.bunny-components .ant-input-affix-wrapper,\n.bunny-components .ant-select-selector {\n font-size: 0.875rem !important;\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n color: #232323 !important;\n}\n.bunny-components .ant-input-affix-wrapper {\n padding-top: 0 !important;\n padding-bottom: 0 !important;\n}\n.bunny-components .ant-input-group-addon,\n.bunny-components .ant-input-number-group-addon {\n color: #475569 !important;\n}\n.bunny-components .ant-input-number-group-wrapper,\n.bunny-components .ant-input-number-affix-wrapper {\n width: 100%;\n}\n.bunny-components .ant-input-affix-wrapper input {\n border: none !important;\n}\n.bunny-components .ant-form-item {\n margin-bottom: 0;\n}\n.bunny-components .ant-form-item-label {\n text-transform: none !important;\n font-size: 0.75rem;\n padding-bottom: 2px !important;\n}\n.bunny-components .ant-form-item-label > label {\n width: 100%;\n color: #4b5563 !important;\n}\n.bunny-components .form .ant-form-item-label label {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n box-sizing: border-box;\n}\n.bunny-components .ant-form-item-explain,\n.bunny-components .ant-form-item-explain-error {\n font-size: 11px;\n min-height: 11px;\n line-height: 11px;\n padding-top: 2px;\n}\n.bunny-components .ant-timeline-item-content {\n font-size: smaller;\n}\n.bunny-components .ant-tree {\n font-size: 0.875rem;\n}\n.bunny-components .ant-tree-treenode {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-draggable-icon {\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-node-content-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-tree-switcher {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-page-header {\n padding-left: 0;\n padding-right: 0;\n padding-top: 0;\n}\n.bunny-components .ant-tag {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n border-radius: 14px;\n font-weight: 500;\n white-space: nowrap;\n padding-inline-start: 0.625rem;\n padding-inline-end: 0.625rem;\n margin: 0;\n}\n.bunny-components .ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.bunny-components .ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.bunny-components .ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.bunny-components .ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.bunny-components .ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.bunny-components .ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.bunny-components .ant-tag-gray {\n color: #6b7280 !important;\n background: #e5e7eb !important;\n}\n.bunny-components .ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.bunny-components .ant-picker {\n width: 100%;\n}\n.bunny-components .ant-input,\n.bunny-components .ant-select,\n.bunny-components .ant-picker {\n height: 32px !important;\n}\n.bunny-components .ant-slider-dot {\n border: 2px solid #f0f0f0;\n}\n.bunny-components .ant-slider-dot-active {\n border-color: #ff5833;\n}\n.bunny-components .ant-slider-mark :last-child {\n transform: translateX(-75%) !important;\n}\n.bunny-components .ant-drawer-content {\n background: #f3f3f9ff;\n}\n.bunny-components .ant-drawer-body,\n.bunny-components .ant-layout {\n background: #f8fafc;\n}\n.bunny-components .vista-link {\n color: #1890ff;\n}\n.bunny-components .vista-link:hover {\n text-decoration: underline;\n cursor: pointer;\n}\n.bunny-components .ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.bunny-components .ant-popconfirm-message-text {\n width: 100% !important;\n}\n.bunny-components .ant-popconfirm-title {\n padding: 0;\n text-align: center;\n font-size: 0.875rem !important;\n width: 100% !important;\n}\n.bunny-components .ant-popconfirm-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n}\n.bunny-components .ant-popconfirm-buttons button {\n margin-inline-start: 0 !important;\n}\n.bunny-components .ant-pagination-item {\n display: flex !important;\n align-items: center;\n justify-content: center;\n}\n.bunny-components .ant-btn-primary:disabled {\n background: #eef0f2 !important;\n color: rgba(0, 0, 0, 0.25) !important;\n border: none;\n}\n.bunny-components .ant-btn {\n box-shadow: none;\n text-shadow: none;\n outline: none !important;\n line-height: 1;\n font-weight: normal;\n}\n.bunny-components .ant-btn-default .ant-btn-icon {\n color: #94a3b8;\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n}\n.bunny-components .ant-btn-default:hover .ant-btn-icon {\n color: #ff7f5c;\n}\n.bunny-components .ant-btn-default:disabled {\n border-color: rgba(113, 125, 148, 0.2) !important;\n}\n.bunny-components .ant-btn-primary:disabled {\n background-color: rgba(113, 125, 148, 0.1) !important;\n border-color: rgba(113, 125, 148, 0.1) !important;\n}\n.bunny-components .ant-btn-primary:hover:disabled,\n.bunny-components .ant-btn-primary:disabled {\n background-clip: padding-box;\n}\n.bunny-components .ant-select-selection-item-content {\n display: flex !important;\n align-items: center;\n}\n.bunny-components .ant-select-item {\n font-size: 0.875rem;\n}\n.bunny-components .ant-select-item-option-content {\n display: flex;\n align-items: center;\n white-space: nowrap !important;\n overflow: visible !important;\n text-overflow: default !important;\n font-size: 0.875rem;\n}\n.bunny-components .ant-select-arrow .anticon:not(.ant-select-suffix) {\n pointer-events: none;\n}\n.bunny-components .select-dropdown-blue-gray .ant-select-item-option {\n background-color: #fff !important;\n}\n.bunny-components .select-dropdown-blue-gray .ant-select-item-option-active {\n color: #ff5833;\n}\n.bunny-components .ant-dropdown-menu-items {\n padding-left: 0 !important;\n}\n.bunny-components .ant-dropdown-menu-item-active {\n background-color: transparent !important;\n}\n.bunny-components .ant-input-affix-wrapper.searchfield {\n background: white !important;\n}\n.bunny-components .ant-input-affix-wrapper.searchfield input {\n background: white !important;\n}\n.bunny-components .ant-input-affix-wrapper-focused {\n background: white !important;\n}\n.bunny-components .panel .ant-input-affix-wrapper.searchfield {\n background: #f8f8f8 !important;\n}\n.bunny-components .panel .ant-input-affix-wrapper.searchfield input {\n background: #f8f8f8 !important;\n}\n.bunny-components .ant-input-steps-hidden .ant-input-number-handler-wrap {\n display: none;\n}\n.bunny-components .ant-layout-header {\n height: 48px;\n}\n.bunny-components .ant-layout-sider-children {\n width: inherit;\n position: fixed;\n}\n.bunny-components .ant-menu-item-group-list {\n display: flex !important;\n flex-direction: column !important;\n align-items: flex-start !important;\n gap: 4px !important;\n}\n.bunny-components .group {\n display: flex;\n flex-direction: row;\n flex-flow: row wrap;\n box-sizing: border-box;\n}\n.bunny-components .select-datepicker {\n animation-duration: 0.35s !important;\n}\n.bunny-components .header-datepicker {\n top: 96px !important;\n animation-duration: 0s !important;\n}\n.bunny-components .ant-picker-header {\n border-bottom: none !important;\n}\n.bunny-components .ant-picker-content thead tr th {\n font-weight: 500;\n}\n.bunny-components .ant-picker-panel-container {\n border-radius: 0.375rem;\n}\n.bunny-components .ant-picker-cell-selected .custom-date-display {\n color: #ffffff;\n background-color: #ff5833;\n}\n.bunny-components .ant-picker-cell-today .custom-date-display {\n border: 1px solid #ff5833;\n}\n.bunny-components .ant-select:hover,\n.bunny-components * .cardElement:hover {\n border-color: #ff5833;\n}\n.bunny-components .ant-input-number {\n width: 100%;\n}\n.bunny-components .ant-input-number-focused {\n border-color: #ff5833 !important;\n background-color: #ffffff !important;\n}\n.bunny-components .ant-input-affix-wrapper-focused,\n.bunny-components .ant-input-number-focused,\n.bunny-components .ant-picker,\n.bunny-components .ant-input,\n.bunny-components .ant-select-focused .ant-select-selector,\n.bunny-components .ant-select-selector:focus,\n.bunny-components .ant-select-selector:active,\n.bunny-components .ant-select-open .ant-select-selector {\n box-shadow: none !important;\n}\n.bunny-components .ant-select-item-option-selected .ant-select-item-option-state {\n display: none !important;\n}\n.bunny-components .ant-form * input[type='text'].ant-input:not(:disabled),\n.bunny-components .ant-select-selection-item:not(:disabled) {\n color: #232323;\n}\n.bunny-components .ant-tabs-ink-bar {\n display: none !important;\n}\n.bunny-components .ant-tabs-tab.ant-tabs-tab-active {\n border-bottom: 2px solid #ff5833 !important;\n}\n.bunny-components .ant-tabs-tab {\n border-bottom: 2px solid transparent !important;\n padding-bottom: 14px !important;\n}\n.bunny-components .ant-upload-wrapper {\n display: flex;\n}\n.bunny-components .ant-form-item-label > label::after {\n display: none !important;\n}\n.bunny-components .ant-menu-item {\n display: flex !important;\n align-items: center !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 border-radius: 8px !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 font-size: 14px !important;\n overflow-wrap: break-word;\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: #ff5833 !important;\n font-weight: 500 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff5833;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-weight: 500 !important;\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.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";
|
|
60
60
|
styleInject(css_248z);
|
|
61
61
|
|
|
62
62
|
/******************************************************************************
|
|
@@ -154,7 +154,7 @@ var BrandContext = react.createContext({
|
|
|
154
154
|
});
|
|
155
155
|
|
|
156
156
|
// This will be replaced at build time by rollup-plugin-replace
|
|
157
|
-
var PACKAGE_VERSION = '1.0
|
|
157
|
+
var PACKAGE_VERSION = '1.3.0-beta.5';
|
|
158
158
|
var createRequestHeaders = function (token) {
|
|
159
159
|
var headers = common.createClientDevHeaders(token);
|
|
160
160
|
// Add the components version header
|
|
@@ -430,6 +430,7 @@ var DocumentTemplatePreview = function (_a) {
|
|
|
430
430
|
URL.revokeObjectURL(url_1);
|
|
431
431
|
};
|
|
432
432
|
}
|
|
433
|
+
return undefined;
|
|
433
434
|
}, [data]);
|
|
434
435
|
if (isLoading) {
|
|
435
436
|
return (jsxRuntime.jsx("div", __assign({ className: "flex items-center justify-center h-96" }, { children: jsxRuntime.jsx(antd.Spin, {}) })));
|
|
@@ -501,6 +502,7 @@ function LegacyDocument(_a) {
|
|
|
501
502
|
setPdfUrl(url_1);
|
|
502
503
|
return function () { return URL.revokeObjectURL(url_1); };
|
|
503
504
|
}
|
|
505
|
+
return undefined;
|
|
504
506
|
}, [pdfBlob]);
|
|
505
507
|
if (isLoading || !pdfUrl)
|
|
506
508
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
@@ -547,7 +549,7 @@ var checkout = function (_a) {
|
|
|
547
549
|
});
|
|
548
550
|
};
|
|
549
551
|
|
|
550
|
-
var paymentMethodsQuery = function (
|
|
552
|
+
var paymentMethodsQuery = function () { return "query PaymentMethods($accountId: ID) {\n paymentMethods (accountId: $accountId) {\n nodes {\n id\n pluginId\n accountId\n expirationDate\n plugin {\n guid\n id\n }\n state\n metadata {\n issuer\n identifier\n kind\n description\n icon\n type\n }\n isDefault\n }\n }\n}"; };
|
|
551
553
|
var getPaymentMethods = function (_a) {
|
|
552
554
|
var apiHost = _a.apiHost, token = _a.token, accountId = _a.accountId;
|
|
553
555
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -556,9 +558,10 @@ var getPaymentMethods = function (_a) {
|
|
|
556
558
|
return __generator(this, function (_c) {
|
|
557
559
|
switch (_c.label) {
|
|
558
560
|
case 0: return [4 /*yield*/, gqlRequest({
|
|
559
|
-
query: paymentMethodsQuery(
|
|
561
|
+
query: paymentMethodsQuery(),
|
|
560
562
|
token: token,
|
|
561
563
|
apiHost: apiHost,
|
|
564
|
+
vars: { accountId: accountId },
|
|
562
565
|
})];
|
|
563
566
|
case 1:
|
|
564
567
|
response = _c.sent();
|
|
@@ -586,20 +589,11 @@ var usePaymentMethod = function (_a) {
|
|
|
586
589
|
};
|
|
587
590
|
|
|
588
591
|
var filterPaymentPlugins = function (plugins) {
|
|
589
|
-
return plugins === null || plugins === void 0 ? void 0 : plugins.filter(function (plugin) { var _a, _b; return ((_a = plugin.type) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'payment' && ((_b = plugin.status) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'valid'; })
|
|
590
|
-
};
|
|
591
|
-
var filterPaymentPluginsByEntity = function (plugins, selectedEntityId) {
|
|
592
|
-
return plugins === null || plugins === void 0 ? void 0 : plugins.filter(function (plugin) {
|
|
593
|
-
var _a, _b;
|
|
594
|
-
return selectedEntityId === undefined ||
|
|
595
|
-
selectedEntityId === null ||
|
|
596
|
-
((_a = plugin.entities) === null || _a === void 0 ? void 0 : _a.includes(selectedEntityId)) ||
|
|
597
|
-
((_b = plugin.entities) === null || _b === void 0 ? void 0 : _b.length) === 0;
|
|
598
|
-
});
|
|
592
|
+
return plugins === null || plugins === void 0 ? void 0 : plugins.filter(function (plugin) { var _a, _b; return ((_a = plugin.type) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'payment' && ((_b = plugin.status) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'valid'; });
|
|
599
593
|
};
|
|
600
|
-
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}";
|
|
594
|
+
var MUTATION$9 = "query PaymentPlugins($accountId: ID) {\n paymentPlugins (accountId: $accountId) {\n enabled\n entities\n guid\n hidden\n id\n name\n status\n type\n webhookEnabled\n components\n }\n}";
|
|
601
595
|
var getPaymentPlugins = function (_a) {
|
|
602
|
-
var apiHost = _a.apiHost, token = _a.token;
|
|
596
|
+
var apiHost = _a.apiHost, token = _a.token, accountId = _a.accountId;
|
|
603
597
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
604
598
|
var response;
|
|
605
599
|
return __generator(this, function (_b) {
|
|
@@ -610,6 +604,7 @@ var getPaymentPlugins = function (_a) {
|
|
|
610
604
|
query: MUTATION$9,
|
|
611
605
|
token: token,
|
|
612
606
|
apiHost: apiHost,
|
|
607
|
+
vars: { accountId: accountId },
|
|
613
608
|
})];
|
|
614
609
|
case 1:
|
|
615
610
|
response = _b.sent();
|
|
@@ -623,18 +618,15 @@ var getPaymentPlugins = function (_a) {
|
|
|
623
618
|
});
|
|
624
619
|
};
|
|
625
620
|
var usePaymentPlugins = function (_a) {
|
|
626
|
-
var apiHost = _a.apiHost, token = _a.token,
|
|
621
|
+
var apiHost = _a.apiHost, token = _a.token, accountId = _a.accountId;
|
|
627
622
|
var _b = reactQuery.useQuery({
|
|
628
623
|
queryKey: ['paymentPlugins', token],
|
|
629
|
-
queryFn: function () { return getPaymentPlugins({ apiHost: apiHost, token: token }); },
|
|
624
|
+
queryFn: function () { return getPaymentPlugins({ apiHost: apiHost, token: token, accountId: accountId }); },
|
|
630
625
|
staleTime: 5 * 60 * 1000, // Consider data fresh for 5 minutes
|
|
631
626
|
}), paymentPlugins = _b.data, isFetched = _b.isFetched;
|
|
632
627
|
var filteredPaymentPlugins = filterPaymentPlugins(paymentPlugins);
|
|
633
|
-
var filteredPaymentPluginsByEntity = selectedEntityId
|
|
634
|
-
? filterPaymentPluginsByEntity(filteredPaymentPlugins, selectedEntityId)
|
|
635
|
-
: filteredPaymentPlugins;
|
|
636
628
|
return {
|
|
637
|
-
paymentPlugins:
|
|
629
|
+
paymentPlugins: filteredPaymentPlugins,
|
|
638
630
|
isFetched: isFetched,
|
|
639
631
|
};
|
|
640
632
|
};
|
|
@@ -18413,7 +18405,7 @@ var Bancontact = function (_a) {
|
|
|
18413
18405
|
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: "M18.2243 35.1715C18.2243 34.882 18.156 34.6314 18.0199 34.4199C17.8835 34.2083 17.7043 34.0468 17.4819 33.9355C17.7043 33.8242 17.8766 33.6597 17.9991 33.4426C18.1214 33.2255 18.1825 32.9806 18.1825 32.7078V32.5575C18.1825 32.2233 18.1186 31.9451 17.9908 31.7223C17.8628 31.4996 17.6833 31.3213 17.4526 31.1878C17.2219 31.0541 16.9451 30.9582 16.6227 30.8995C16.3 30.8411 15.9414 30.812 15.5465 30.812C15.4131 30.812 15.274 30.8147 15.1296 30.8203C14.9848 30.8258 14.8445 30.8328 14.7083 30.8411C14.572 30.8494 14.4468 30.8593 14.3329 30.8704C14.2188 30.8817 14.1256 30.8928 14.0534 30.9037C13.8921 30.9318 13.7781 30.9817 13.7114 31.0541C13.6448 31.1266 13.6113 31.2575 13.6113 31.4467V36.5245C13.6113 36.7139 13.646 36.8447 13.7156 36.917C13.7851 36.9895 13.9032 37.0394 14.0702 37.0673C14.1535 37.084 14.2536 37.0979 14.3704 37.1091C14.4871 37.1202 14.6136 37.1299 14.7499 37.1383C14.8862 37.1466 15.0265 37.1535 15.1711 37.1593C15.3158 37.1646 15.4575 37.1676 15.5966 37.1676C15.9581 37.1676 16.2986 37.1397 16.6185 37.084C16.9381 37.0285 17.2161 36.9295 17.4526 36.7874C17.689 36.6456 17.8766 36.4534 18.0157 36.2113C18.1546 35.969 18.2243 35.6642 18.2243 35.2967V35.1715ZM16.8063 32.7746C16.8063 32.8637 16.7924 32.9487 16.7645 33.0293C16.7366 33.11 16.6909 33.1795 16.627 33.2383C16.5629 33.2966 16.4768 33.3439 16.3684 33.38C16.2599 33.4162 16.1222 33.4343 15.9554 33.4343H15.0213V31.9895C15.049 31.9895 15.0921 31.9883 15.1505 31.9853C15.2089 31.9825 15.27 31.9812 15.3339 31.9812H15.6551C16.0833 31.9812 16.3822 32.0354 16.5518 32.144C16.7214 32.2526 16.8063 32.421 16.8063 32.6492V32.7746ZM16.5935 35.8062C16.7576 35.6782 16.8397 35.4971 16.8397 35.2634V35.1714C16.8397 34.971 16.7756 34.797 16.6478 34.6494C16.5198 34.502 16.289 34.4282 15.9554 34.4282H15.0213V35.9898H15.1671C15.231 35.9898 15.2977 35.9916 15.3673 35.9942C15.4368 35.9969 15.5035 35.9985 15.5676 35.9985H15.7051C16.1333 35.9985 16.4295 35.9343 16.5935 35.8062ZM22.7955 33.9438C22.7955 33.6377 22.7496 33.3772 22.6578 33.1629C22.5662 32.9487 22.4368 32.7732 22.27 32.6367C22.1032 32.5004 21.8988 32.4003 21.6568 32.3362C21.415 32.2722 21.1439 32.2401 20.8436 32.2401C20.5654 32.2401 20.2943 32.2597 20.0303 32.2987C19.766 32.3375 19.556 32.3766 19.4005 32.4154C19.2948 32.4435 19.242 32.5046 19.242 32.5991V33.2756C19.242 33.3314 19.2559 33.3705 19.2837 33.3925C19.3115 33.4149 19.3475 33.4261 19.3922 33.4261H19.4337C19.5006 33.4204 19.5839 33.4135 19.684 33.4051C19.7842 33.3968 19.8968 33.3901 20.022 33.3842C20.1471 33.3788 20.2777 33.3746 20.414 33.3717C20.5501 33.3689 20.6851 33.3675 20.8186 33.3675C21.0131 33.3675 21.1661 33.4038 21.2773 33.4761C21.3885 33.5486 21.4441 33.7045 21.4441 33.9438V34.2445H20.9937C20.2763 34.2445 19.7549 34.3572 19.4296 34.5827C19.1043 34.8081 18.9416 35.1659 18.9416 35.6558V35.7313C18.9416 36.0039 18.982 36.2321 19.0625 36.4158C19.1431 36.5996 19.2503 36.7472 19.3837 36.8587C19.5172 36.9699 19.6686 37.0493 19.8384 37.0964C20.008 37.1438 20.1846 37.1676 20.3681 37.1676C20.6184 37.1676 20.8339 37.1341 21.0145 37.0673C21.1952 37.0005 21.3662 36.9086 21.5276 36.7917V36.9253C21.5276 36.9699 21.5442 37.0089 21.5776 37.0422C21.6111 37.0756 21.6499 37.0923 21.6944 37.0923H22.6287C22.6731 37.0923 22.712 37.0756 22.7455 37.0422C22.7789 37.0089 22.7955 36.9699 22.7955 36.9253V33.9438ZM21.1481 36.0942C21.2619 36.0581 21.3691 36.015 21.4692 35.9648V35.0462H20.9937C20.8491 35.0462 20.7296 35.0587 20.635 35.0837C20.5404 35.1088 20.4653 35.1465 20.4098 35.1966C20.3542 35.2465 20.3152 35.3107 20.2931 35.3886C20.2707 35.4666 20.2596 35.5556 20.2596 35.6558V35.7312C20.2596 35.9092 20.3026 36.0233 20.3889 36.0734C20.4751 36.1235 20.6071 36.1485 20.7852 36.1485C20.913 36.1485 21.0339 36.1306 21.1481 36.0942ZM27.9007 36.917V34.1358C27.9007 33.8744 27.8799 33.6278 27.8381 33.3968C27.7964 33.166 27.7214 32.9653 27.6129 32.7954C27.5045 32.6256 27.3543 32.4905 27.1624 32.3904C26.9707 32.2902 26.7245 32.2401 26.4242 32.2401C26.1572 32.2401 25.9208 32.2723 25.7152 32.3369C25.5094 32.4014 25.2925 32.515 25.0646 32.6776V32.4752C25.0646 32.4305 25.0478 32.3911 25.0145 32.3575C24.9811 32.3238 24.9421 32.3068 24.8976 32.3068H23.9634C23.9187 32.3068 23.8799 32.3235 23.8467 32.357C23.8133 32.3904 23.7966 32.4295 23.7966 32.4739V36.917C23.7966 36.9615 23.8145 37.0019 23.8508 37.038C23.8869 37.0743 23.9272 37.0923 23.9717 37.0923H24.9811C25.0256 37.0923 25.0646 37.0743 25.0978 37.0382C25.1313 37.0021 25.1479 36.9619 25.1479 36.9173V33.6341C25.2925 33.5564 25.4287 33.4925 25.5567 33.4426C25.6845 33.3925 25.8096 33.3675 25.932 33.3675C26.0599 33.3675 26.1642 33.38 26.2449 33.4051C26.3254 33.4301 26.388 33.4731 26.4325 33.5345C26.477 33.5954 26.5076 33.6759 26.5243 33.7757C26.5409 33.8758 26.5494 33.9981 26.5494 34.1425V36.9173C26.5494 36.9619 26.566 37.0021 26.5994 37.0382C26.6327 37.0743 26.6715 37.0923 26.7162 37.0923H27.7255C27.7699 37.0923 27.8102 37.0743 27.8464 37.038C27.8826 37.0019 27.9007 36.9615 27.9007 36.917ZM32.0047 36.1071V36.8502C32.0047 36.9114 31.9907 36.9546 31.963 36.9796C31.9351 37.0047 31.8906 37.0255 31.8294 37.0422C31.7127 37.0701 31.5611 37.0978 31.3749 37.1259C31.1885 37.1535 30.9703 37.1676 30.72 37.1676C30.1305 37.1676 29.6592 36.9867 29.3062 36.6246C28.953 36.2628 28.7765 35.7394 28.7765 35.0546V34.3531C28.7765 33.6682 28.953 33.1448 29.3062 32.7831C29.6592 32.421 30.1305 32.2401 30.72 32.2401C30.9703 32.2401 31.1885 32.254 31.3749 32.2817C31.5611 32.3098 31.7127 32.3375 31.8294 32.3653C31.8906 32.3819 31.9351 32.4029 31.963 32.4279C31.9907 32.453 32.0047 32.4962 32.0047 32.5574V33.3007C32.0047 33.3453 31.9893 33.38 31.9588 33.4051C31.9281 33.4301 31.8906 33.4426 31.8462 33.4426H31.8294C31.6737 33.4261 31.5251 33.4121 31.3832 33.401C31.2413 33.3901 31.0508 33.3842 30.8118 33.3842C30.7172 33.3842 30.6283 33.3996 30.5448 33.4301C30.4613 33.4608 30.3891 33.5137 30.328 33.5888C30.2666 33.6641 30.2181 33.7641 30.1819 33.8895C30.1457 34.0147 30.1277 34.1692 30.1277 34.3531V35.0546C30.1277 35.2382 30.1457 35.3927 30.1819 35.5181C30.2181 35.6433 30.2666 35.7436 30.328 35.8187C30.3891 35.8939 30.4613 35.9468 30.5448 35.9774C30.6283 36.008 30.7172 36.0233 30.8118 36.0233C31.0508 36.0233 31.2413 36.0178 31.3832 36.0067C31.5251 35.9956 31.6737 35.9815 31.8294 35.9649H31.8462C31.8906 35.9649 31.9281 35.9774 31.9588 36.0025C31.9893 36.0276 32.0047 36.0623 32.0047 36.1071ZM36.6346 34.4115C36.6346 34.0773 36.5885 33.7768 36.4966 33.5095C36.4046 33.2423 36.2709 33.0155 36.0954 32.8289C35.9199 32.6424 35.7025 32.4976 35.4436 32.3946C35.1844 32.2918 34.8848 32.2401 34.5449 32.2401C34.2051 32.2401 33.9056 32.2918 33.6465 32.3946C33.3873 32.4976 33.1685 32.6424 32.9903 32.8289C32.8119 33.0155 32.6768 33.2423 32.585 33.5095C32.4928 33.7768 32.4469 34.0773 32.4469 34.4115V34.9961C32.4469 35.3301 32.4928 35.6309 32.585 35.8981C32.6768 36.1653 32.8119 36.3922 32.9903 36.5788C33.1685 36.7654 33.3873 36.91 33.6465 37.013C33.9056 37.1159 34.2051 37.1676 34.5449 37.1676C34.8848 37.1676 35.1844 37.1159 35.4436 37.013C35.7025 36.91 35.9199 36.7654 36.0954 36.5788C36.2709 36.3922 36.4046 36.1653 36.4966 35.8981C36.5885 35.6309 36.6346 35.3301 36.6346 34.9961V34.4115ZM34.5449 36.0233C35.037 36.0233 35.2832 35.6809 35.2832 34.9961V34.4115C35.2832 33.7322 35.037 33.3925 34.5449 33.3925C34.3016 33.3925 34.1164 33.4774 33.9893 33.6472C33.8619 33.8172 33.7984 34.0719 33.7984 34.4115V34.9961C33.7984 35.3357 33.8619 35.5918 33.9893 35.7644C34.1164 35.9371 34.3016 36.0233 34.5449 36.0233ZM41.5976 36.917V34.1358C41.5976 33.8744 41.5765 33.6278 41.5351 33.3968C41.4933 33.166 41.4181 32.9653 41.3095 32.7954C41.2011 32.6256 41.0511 32.4905 40.8593 32.3904C40.6674 32.2902 40.4213 32.2401 40.1211 32.2401C39.8542 32.2401 39.6177 32.2723 39.4119 32.3369C39.2062 32.4014 38.9893 32.515 38.7613 32.6776V32.4752C38.7613 32.4305 38.7447 32.3911 38.7111 32.3575C38.678 32.3238 38.6389 32.3068 38.5945 32.3068H37.6602C37.6157 32.3068 37.5769 32.3235 37.5434 32.357C37.5102 32.3904 37.4934 32.4295 37.4934 32.4739V36.917C37.4934 36.9615 37.5114 37.0019 37.5476 37.038C37.5838 37.0743 37.624 37.0923 37.6687 37.0923H38.678C38.7224 37.0923 38.7613 37.0743 38.7948 37.0382C38.828 37.0021 38.8448 36.9619 38.8448 36.9173V33.6341C38.9893 33.5564 39.1256 33.4925 39.2534 33.4426C39.3815 33.3925 39.5065 33.3675 39.629 33.3675C39.7568 33.3675 39.8611 33.38 39.9416 33.4051C40.0222 33.4301 40.0849 33.4731 40.1294 33.5345C40.1739 33.5954 40.2044 33.6759 40.2212 33.7757C40.2378 33.8758 40.2462 33.9981 40.2462 34.1425V36.9173C40.2462 36.9619 40.2628 37.0021 40.2962 37.0382C40.3296 37.0743 40.3684 37.0923 40.413 37.0923H41.4223C41.4668 37.0923 41.5072 37.0743 41.5434 37.038C41.5794 37.0019 41.5976 36.9615 41.5976 36.917ZM45.2348 36.2893V36.9357C45.2348 37.0295 45.182 37.0848 45.0763 37.1011C44.9483 37.1233 44.8371 37.1398 44.7427 37.1509C44.6481 37.162 44.5395 37.1675 44.4174 37.1675C44.1905 37.1675 43.9901 37.1493 43.816 37.1133C43.6419 37.077 43.4966 37.0061 43.3805 36.9003C43.2646 36.7945 43.1761 36.6483 43.1153 36.4617C43.0547 36.2753 43.0242 36.0347 43.0242 35.7394V33.3175L42.357 33.2088C42.3123 33.1977 42.2721 33.1769 42.2359 33.1462C42.1997 33.1157 42.1817 33.0781 42.1817 33.0335V32.4822C42.1817 32.4378 42.1997 32.3974 42.2359 32.3611C42.2721 32.325 42.3123 32.3068 42.357 32.3068H43.0242V31.622C43.0242 31.5774 43.0409 31.5414 43.0739 31.5134C43.1068 31.4857 43.1458 31.4663 43.1902 31.455L44.2016 31.2798H44.2263C44.2705 31.2798 44.3065 31.2921 44.3343 31.3171C44.3618 31.3423 44.3757 31.3771 44.3757 31.4215V32.3068H45.0597C45.104 32.3068 45.143 32.3237 45.1764 32.3573C45.2099 32.3909 45.2265 32.4305 45.2265 32.4752V33.1573C45.2265 33.2024 45.2099 33.2416 45.1764 33.2752C45.143 33.3089 45.104 33.3257 45.0597 33.3257H44.3757V35.7561C44.3757 35.9231 44.3895 36.0304 44.4174 36.0776C44.4451 36.1249 44.5229 36.1485 44.6507 36.1485H45.0597C45.1764 36.1485 45.2348 36.1955 45.2348 36.2893ZM49.6891 33.9438C49.6891 33.6377 49.6433 33.3772 49.5514 33.1629C49.4597 32.9487 49.3305 32.7732 49.1637 32.6367C48.9969 32.5004 48.7925 32.4003 48.5505 32.3362C48.3087 32.2722 48.0376 32.2401 47.7373 32.2401C47.4589 32.2401 47.188 32.2597 46.924 32.2987C46.6597 32.3375 46.4497 32.3766 46.2942 32.4154C46.1882 32.4435 46.1357 32.5046 46.1357 32.5991V33.2756C46.1357 33.3314 46.1494 33.3705 46.1773 33.3925C46.2052 33.4149 46.2412 33.4261 46.2857 33.4261H46.3274C46.3943 33.4204 46.4776 33.4135 46.5777 33.4051C46.6779 33.3968 46.7905 33.3901 46.9155 33.3842C47.0408 33.3788 47.1714 33.3746 47.3077 33.3717C47.4438 33.3689 47.5788 33.3675 47.7121 33.3675C47.9068 33.3675 48.0598 33.4038 48.171 33.4761C48.2822 33.5486 48.3378 33.7045 48.3378 33.9438V34.2445H47.8874C47.1698 34.2445 46.6486 34.3572 46.3233 34.5827C45.998 34.8081 45.8353 35.1659 45.8353 35.6558V35.7313C45.8353 36.0039 45.8755 36.2321 45.9562 36.4158C46.0366 36.5996 46.144 36.7472 46.2774 36.8587C46.4109 36.9699 46.5623 37.0493 46.7321 37.0964C46.9017 37.1438 47.0782 37.1676 47.2618 37.1676C47.5121 37.1676 47.7274 37.1341 47.9082 37.0673C48.0889 37.0005 48.2597 36.9086 48.4213 36.7917V36.9253C48.4213 36.9699 48.4379 37.0089 48.4713 37.0422C48.5046 37.0756 48.5436 37.0923 48.5881 37.0923H49.5224C49.5668 37.0923 49.6057 37.0756 49.6392 37.0422C49.6724 37.0089 49.6891 36.9699 49.6891 36.9253V33.9438ZM48.0418 36.0942C48.1556 36.0581 48.2628 36.015 48.3629 35.9648V35.0462H47.8874C47.7428 35.0462 47.6233 35.0587 47.5287 35.0837C47.4341 35.1088 47.359 35.1465 47.3035 35.1966C47.2477 35.2465 47.2088 35.3107 47.1868 35.3886C47.1644 35.4666 47.1533 35.5556 47.1533 35.6558V35.7312C47.1533 35.9092 47.1963 36.0233 47.2826 36.0734C47.3688 36.1235 47.5008 36.1485 47.6789 36.1485C47.8067 36.1485 47.9274 36.1306 48.0418 36.0942ZM53.7933 36.8502V36.1071C53.7933 36.0623 53.7779 36.0276 53.7474 36.0025C53.7167 35.9774 53.6793 35.9649 53.6348 35.9649H53.6181C53.4624 35.9815 53.3136 35.9956 53.1718 36.0067C53.0301 36.0178 52.8395 36.0233 52.6005 36.0233C52.5057 36.0233 52.4167 36.008 52.3336 35.9774C52.2501 35.9468 52.1777 35.8939 52.1165 35.8187C52.0554 35.7436 52.0067 35.6433 51.9707 35.5181C51.9343 35.3927 51.9165 35.2382 51.9165 35.0546V34.3531C51.9165 34.1692 51.9343 34.0147 51.9707 33.8895C52.0067 33.7641 52.0554 33.6641 52.1165 33.5888C52.1777 33.5137 52.2501 33.4608 52.3336 33.4301C52.4167 33.3996 52.5057 33.3842 52.6005 33.3842C52.8395 33.3842 53.0301 33.3901 53.1718 33.401C53.3136 33.4121 53.4624 33.4261 53.6181 33.4426H53.6348C53.6793 33.4426 53.7167 33.4301 53.7474 33.4051C53.7779 33.38 53.7933 33.3453 53.7933 33.3007V32.5574C53.7933 32.4962 53.7794 32.453 53.7515 32.4279C53.7235 32.4029 53.6793 32.3819 53.6181 32.3653C53.5014 32.3375 53.3497 32.3098 53.1635 32.2817C52.9771 32.254 52.759 32.2401 52.5087 32.2401C51.9189 32.2401 51.4479 32.421 51.0947 32.7831C50.7415 33.1448 50.565 33.6682 50.565 34.3531V35.0546C50.565 35.7394 50.7415 36.2628 51.0947 36.6246C51.4479 36.9867 51.9189 37.1676 52.5087 37.1676C52.759 37.1676 52.9771 37.1535 53.1635 37.1259C53.3497 37.0978 53.5014 37.0701 53.6181 37.0422C53.6793 37.0255 53.7235 37.0047 53.7515 36.9796C53.7794 36.9546 53.7933 36.9114 53.7933 36.8502ZM57.3884 36.2893V36.9357C57.3884 37.0295 57.3354 37.0848 57.2299 37.1011C57.1019 37.1233 56.9907 37.1398 56.8963 37.1509C56.8016 37.162 56.6931 37.1675 56.571 37.1675C56.3441 37.1675 56.1437 37.1493 55.9696 37.1133C55.7954 37.077 55.6502 37.0061 55.5343 36.9003C55.4183 36.7945 55.3298 36.6483 55.269 36.4617C55.2083 36.2753 55.1778 36.0347 55.1778 35.7394V33.3175L54.5106 33.2088C54.4659 33.1977 54.4257 33.1769 54.3895 33.1462C54.3533 33.1157 54.3353 33.0781 54.3353 33.0335V32.4822C54.3353 32.4378 54.3533 32.3974 54.3895 32.3611C54.4257 32.325 54.4659 32.3068 54.5106 32.3068H55.1778V31.622C55.1778 31.5774 55.1945 31.5414 55.2276 31.5134C55.2605 31.4857 55.2993 31.4663 55.3436 31.455L56.355 31.2798H56.38C56.4241 31.2798 56.4602 31.2921 56.4875 31.3171C56.5154 31.3423 56.5293 31.3771 56.5293 31.4215V32.3068H57.2133C57.2577 32.3068 57.2966 32.3237 57.3301 32.3573C57.3633 32.3909 57.3801 32.4305 57.3801 32.4752V33.1573C57.3801 33.2024 57.3633 33.2416 57.3301 33.2752C57.2966 33.3089 57.2577 33.3257 57.2133 33.3257H56.5293V35.7561C56.5293 35.9231 56.5431 36.0304 56.571 36.0776C56.5987 36.1249 56.6765 36.1485 56.8045 36.1485H57.2133C57.3301 36.1485 57.3884 36.1955 57.3884 36.2893Z", fill: "#005697" }), jsxRuntime.jsx("path", { d: "M52.6187 14.7398H39.0664L37.6881 16.2935L33.2155 21.3349V21.3351L31.8372 22.8886H18.464L19.821 21.3153L20.4633 20.5706L21.8202 18.9973H15.6582C14.5325 18.9973 13.6113 19.943 13.6113 21.0987V25.5326C13.6113 26.6885 14.5325 27.6342 15.6582 27.6342H39.2492C40.3749 27.6342 41.9127 26.9318 42.6665 26.0733L46.235 22.0097L52.6187 14.7398Z", fill: "#005697" }), jsxRuntime.jsx("path", { d: "M55.3418 10C56.4676 10 57.3887 10.9457 57.3887 12.1015V16.5353C57.3887 17.691 56.4676 18.6368 55.3418 18.6368H49.1999L50.5697 17.0753H50.5699L51.2491 16.3012L52.6189 14.7398H39.0667L31.8375 22.8945H18.3813L28.0314 11.9701L28.3966 11.5566C29.153 10.7005 30.6929 10 31.8186 10H55.3418V10Z", fill: "#FBD500" })] })));
|
|
18414
18406
|
};
|
|
18415
18407
|
|
|
18416
|
-
var Text$
|
|
18408
|
+
var Text$r = antd.Typography.Text;
|
|
18417
18409
|
var MiniCreditCard = function (_a) {
|
|
18418
18410
|
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;
|
|
18419
18411
|
var darkMode = react.useContext(BunnyContext).darkMode;
|
|
@@ -18424,7 +18416,7 @@ var MiniCreditCard = function (_a) {
|
|
|
18424
18416
|
return darkMode ? 'var(--row-background-alternate)' : 'bg-slate-50';
|
|
18425
18417
|
}, [darkMode]);
|
|
18426
18418
|
var isDefault = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.isDefault;
|
|
18427
|
-
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$
|
|
18419
|
+
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] }))) })));
|
|
18428
18420
|
};
|
|
18429
18421
|
var Identifier = function (_a) {
|
|
18430
18422
|
var _b, _c, _d;
|
|
@@ -18433,9 +18425,9 @@ var Identifier = function (_a) {
|
|
|
18433
18425
|
return null;
|
|
18434
18426
|
}
|
|
18435
18427
|
if (((_c = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _c === void 0 ? void 0 : _c.type) === 'cashapp') {
|
|
18436
|
-
return jsxRuntime.jsx(Text$
|
|
18428
|
+
return jsxRuntime.jsx(Text$r, { children: "Cashapp" });
|
|
18437
18429
|
}
|
|
18438
|
-
return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Text$
|
|
18430
|
+
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 })] }));
|
|
18439
18431
|
};
|
|
18440
18432
|
var Issuer = function (_a) {
|
|
18441
18433
|
var _b;
|
|
@@ -18444,7 +18436,7 @@ var Issuer = function (_a) {
|
|
|
18444
18436
|
var issuer = (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.issuer;
|
|
18445
18437
|
if (issuer.length == 0 || list.includes(issuer.toLowerCase()))
|
|
18446
18438
|
return null;
|
|
18447
|
-
return jsxRuntime.jsx(Text$
|
|
18439
|
+
return jsxRuntime.jsx(Text$r, { children: lodashExports.capitalize(issuer) });
|
|
18448
18440
|
};
|
|
18449
18441
|
var DropdownMenu = function (_a) {
|
|
18450
18442
|
var setDefault = _a.setDefault, remove = _a.remove, isDefault = _a.isDefault, id = _a.id;
|
|
@@ -18613,13 +18605,13 @@ var isCardExpired = function (expiry) {
|
|
|
18613
18605
|
var formatCardExpiry = function (cardExpiry) {
|
|
18614
18606
|
if (cardExpiry.length <= 2)
|
|
18615
18607
|
return cardExpiry;
|
|
18616
|
-
return cardExpiry.substring(0, 2) +
|
|
18608
|
+
return cardExpiry.substring(0, 2) + '/' + cardExpiry.substring(2);
|
|
18617
18609
|
};
|
|
18618
18610
|
// removes spaces from a credit card number
|
|
18619
18611
|
var unformatCardNumber = function (cardNumber) {
|
|
18620
|
-
var cardNumberArray = cardNumber.split(
|
|
18621
|
-
var unformattedCardNumberArray = cardNumberArray.filter(function (character) { return character !==
|
|
18622
|
-
return unformattedCardNumberArray.join(
|
|
18612
|
+
var cardNumberArray = cardNumber.split('');
|
|
18613
|
+
var unformattedCardNumberArray = cardNumberArray.filter(function (character) { return character !== ' '; });
|
|
18614
|
+
return unformattedCardNumberArray.join('');
|
|
18623
18615
|
};
|
|
18624
18616
|
var storePayment = function (options, plugin, apiHost, accountId) { return __awaiter(void 0, void 0, void 0, function () {
|
|
18625
18617
|
var testCreditCardNumber, testCreditCardCvc, testCreditCardExpirationDate, token, response;
|
|
@@ -18628,7 +18620,7 @@ var storePayment = function (options, plugin, apiHost, accountId) { return __awa
|
|
|
18628
18620
|
case 0:
|
|
18629
18621
|
testCreditCardNumber = options.testCreditCardNumber, testCreditCardCvc = options.testCreditCardCvc, testCreditCardExpirationDate = options.testCreditCardExpirationDate, token = options.token;
|
|
18630
18622
|
return [4 /*yield*/, common.invokePlugin({
|
|
18631
|
-
method:
|
|
18623
|
+
method: 'store_payment_method',
|
|
18632
18624
|
plugin: plugin,
|
|
18633
18625
|
payload: {
|
|
18634
18626
|
test_credit_card_number: testCreditCardNumber,
|
|
@@ -18641,7 +18633,7 @@ var storePayment = function (options, plugin, apiHost, accountId) { return __awa
|
|
|
18641
18633
|
})];
|
|
18642
18634
|
case 1:
|
|
18643
18635
|
response = _a.sent();
|
|
18644
|
-
if ((response === null || response === void 0 ? void 0 : response.status) !==
|
|
18636
|
+
if ((response === null || response === void 0 ? void 0 : response.status) !== 'success')
|
|
18645
18637
|
throw new Error(response === null || response === void 0 ? void 0 : response.message);
|
|
18646
18638
|
return [2 /*return*/, response];
|
|
18647
18639
|
}
|
|
@@ -18741,7 +18733,7 @@ function useSave$1(_a) {
|
|
|
18741
18733
|
return { save: save, isSaving: isSaving };
|
|
18742
18734
|
}
|
|
18743
18735
|
|
|
18744
|
-
var Text$
|
|
18736
|
+
var Text$q = antd.Typography.Text;
|
|
18745
18737
|
var TEST_CARD = '4242424242424242';
|
|
18746
18738
|
var DemoPayForm = function (_a) {
|
|
18747
18739
|
var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
|
|
@@ -18803,7 +18795,7 @@ var DemoPayForm = function (_a) {
|
|
|
18803
18795
|
var onCardCvcChange = function (cvc) {
|
|
18804
18796
|
setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
|
|
18805
18797
|
};
|
|
18806
|
-
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$
|
|
18798
|
+
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 })] })));
|
|
18807
18799
|
};
|
|
18808
18800
|
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) {
|
|
18809
18801
|
var darkMode = _a.darkMode;
|
|
@@ -18958,7 +18950,7 @@ var PaymentMethodDetails = function (_a) {
|
|
|
18958
18950
|
case 'StripePayment':
|
|
18959
18951
|
return (jsxRuntime.jsx(StripeForm, { onFail: onFail, onSavePaymentMethod: onSavePaymentMethod, plugin: plugin }));
|
|
18960
18952
|
case 'DemoPayPayment':
|
|
18961
|
-
return (jsxRuntime.jsx(DemoPayForm, { onFail: onFail, onSavePaymentMethod: onSavePaymentMethod, plugin: plugin }));
|
|
18953
|
+
return (jsxRuntime.jsx(DemoPayForm, { onFail: onFail, onSavePaymentMethod: function (response) { return onSavePaymentMethod(response); }, plugin: plugin }));
|
|
18962
18954
|
default:
|
|
18963
18955
|
console.warn('Can not find form for plugin', plugin);
|
|
18964
18956
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
@@ -18970,7 +18962,7 @@ var CardIcon = function (_a) {
|
|
|
18970
18962
|
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" })] })));
|
|
18971
18963
|
};
|
|
18972
18964
|
|
|
18973
|
-
var Text$
|
|
18965
|
+
var Text$p = antd.Typography.Text;
|
|
18974
18966
|
var PaymentMethodSelector = function (_a) {
|
|
18975
18967
|
var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
|
|
18976
18968
|
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)); }) })));
|
|
@@ -18983,7 +18975,7 @@ var PaymentOption = function (_a) {
|
|
|
18983
18975
|
var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('card');
|
|
18984
18976
|
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
|
|
18985
18977
|
? "var(--row-background-dark) border-gray-500"
|
|
18986
|
-
: '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$
|
|
18978
|
+
: '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" }))] })));
|
|
18987
18979
|
};
|
|
18988
18980
|
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) {
|
|
18989
18981
|
var $brandColor = _a.$brandColor, $selected = _a.$selected;
|
|
@@ -19104,7 +19096,7 @@ function useSetDefaultPaymentMethod(paymentPlugins, apiHost, token, accountId, o
|
|
|
19104
19096
|
var showErrorNotification$2 = common.useErrorNotification();
|
|
19105
19097
|
var PaymentForm = function (_a) {
|
|
19106
19098
|
var _b;
|
|
19107
|
-
var invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, onPaymentHoldSuccess = _a.onPaymentHoldSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, onRemovePaymentMethod = _a.onRemovePaymentMethod, onSetDefaultPaymentMethod = _a.onSetDefaultPaymentMethod,
|
|
19099
|
+
var invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, onPaymentHoldSuccess = _a.onPaymentHoldSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, onRemovePaymentMethod = _a.onRemovePaymentMethod, onSetDefaultPaymentMethod = _a.onSetDefaultPaymentMethod, overrideToken = _a.overrideToken, customCheckoutFunction = _a.customCheckoutFunction, currencyIdFromProps = _a.currencyId, paymentHoldOptions = _a.paymentHoldOptions;
|
|
19108
19100
|
// Local state
|
|
19109
19101
|
var _c = react.useState(false), showPaymentMethodForm = _c[0], setShowPaymentMethodForm = _c[1];
|
|
19110
19102
|
// Simple hooks
|
|
@@ -19118,7 +19110,7 @@ var PaymentForm = function (_a) {
|
|
|
19118
19110
|
apiHost: apiHost,
|
|
19119
19111
|
}), storedPaymentMethods = _d.paymentMethods, defaultPaymentMethod = _d.defaultPaymentMethod, isPaymentMethodLoading = _d.isLoading;
|
|
19120
19112
|
// Complex hooks
|
|
19121
|
-
var paymentPlugins = usePaymentPlugins({ apiHost: apiHost,
|
|
19113
|
+
var paymentPlugins = usePaymentPlugins({ apiHost: apiHost, token: token, accountId: accountId }).paymentPlugins;
|
|
19122
19114
|
var selectedPaymentMethodPlugin = react.useMemo(function () {
|
|
19123
19115
|
// TODO: consolate PluginData and PaymentPlugin into one type. Needs to be done on API side.
|
|
19124
19116
|
return paymentPlugins === null || paymentPlugins === void 0 ? void 0 : paymentPlugins.find(function (plugin) { var _a, _b, _c; return ((_a = plugin.id) === null || _a === void 0 ? void 0 : _a.toString()) === ((_c = (_b = defaultPaymentMethod === null || defaultPaymentMethod === void 0 ? void 0 : defaultPaymentMethod.plugin) === null || _b === void 0 ? void 0 : _b.id) === null || _c === void 0 ? void 0 : _c.toString()); });
|
|
@@ -19176,14 +19168,14 @@ var PaymentForm = function (_a) {
|
|
|
19176
19168
|
setShowPaymentMethodForm(false);
|
|
19177
19169
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess();
|
|
19178
19170
|
};
|
|
19179
|
-
var handleSavePaymentMethod = function () {
|
|
19171
|
+
var handleSavePaymentMethod = function (response) {
|
|
19180
19172
|
queryClient.invalidateQueries({
|
|
19181
19173
|
queryKey: common.QueryKeyFactory.default.accountPaymentMethodKey({
|
|
19182
19174
|
accountId: accountId,
|
|
19183
19175
|
token: token,
|
|
19184
19176
|
}),
|
|
19185
19177
|
});
|
|
19186
|
-
onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod();
|
|
19178
|
+
onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod(response);
|
|
19187
19179
|
setShowPaymentMethodForm(false);
|
|
19188
19180
|
};
|
|
19189
19181
|
function handleClickAddPaymentMethod() {
|
|
@@ -19225,17 +19217,8 @@ function StripeWrapper(_a) {
|
|
|
19225
19217
|
return (jsxRuntime.jsx(reactStripeJs.Elements, __assign({ options: options, stripe: stripe }, { children: children })));
|
|
19226
19218
|
}
|
|
19227
19219
|
|
|
19228
|
-
var useCurrentUserData = function () {
|
|
19229
|
-
var queryClient = reactQuery.useQueryClient();
|
|
19230
|
-
var token = useToken();
|
|
19231
|
-
var currentUser = queryClient.getQueryData(common.QueryKeyFactory.default.currentUserKey(token));
|
|
19232
|
-
if (!currentUser)
|
|
19233
|
-
return {};
|
|
19234
|
-
return currentUser;
|
|
19235
|
-
};
|
|
19236
|
-
|
|
19237
19220
|
function Invoice(_a) {
|
|
19238
|
-
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;
|
|
19221
|
+
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, _d = _a.hidePaymentForm, hidePaymentForm = _d === void 0 ? false : _d, onInvoiceLoaded = _a.onInvoiceLoaded;
|
|
19239
19222
|
return (jsxRuntime.jsx(InvoiceQuoteContext.Provider, __assign({ value: {
|
|
19240
19223
|
id: id,
|
|
19241
19224
|
invoiceQuoteViewComponent: invoiceQuoteViewComponent,
|
|
@@ -19247,16 +19230,16 @@ function Invoice(_a) {
|
|
|
19247
19230
|
className: className,
|
|
19248
19231
|
hideDownloadButton: hideDownloadButton,
|
|
19249
19232
|
onInvoiceLoaded: onInvoiceLoaded,
|
|
19250
|
-
} }, { children: jsxRuntime.jsx(ActualInvoice, {}) })));
|
|
19233
|
+
} }, { children: jsxRuntime.jsx(ActualInvoice, { hidePaymentForm: hidePaymentForm }) })));
|
|
19251
19234
|
}
|
|
19252
|
-
function ActualInvoice() {
|
|
19235
|
+
function ActualInvoice(_a) {
|
|
19236
|
+
var hidePaymentForm = _a.hidePaymentForm;
|
|
19253
19237
|
// Context
|
|
19254
19238
|
var queryClient = reactQuery.useQueryClient();
|
|
19255
|
-
var
|
|
19256
|
-
var
|
|
19257
|
-
var
|
|
19239
|
+
var _b = react.useContext(InvoiceQuoteContext), id = _b.id, invoiceQuoteViewComponent = _b.invoiceQuoteViewComponent, backButtonName = _b.backButtonName, onBackButtonClick = _b.onBackButtonClick, onPaymentSuccess = _b.onPaymentSuccess, className = _b.className;
|
|
19240
|
+
var _c = react.useContext(BunnyContext), apiHost = _c.apiHost, onTokenExpired = _c.onTokenExpired;
|
|
19241
|
+
var _d = react.useContext(InvoiceQuoteContext), hideDownloadButton = _d.hideDownloadButton, onInvoiceLoaded = _d.onInvoiceLoaded;
|
|
19258
19242
|
var token = useToken();
|
|
19259
|
-
var entityId = useCurrentUserData().entityId;
|
|
19260
19243
|
// Hooks
|
|
19261
19244
|
var showSuccessNotification = common.useSuccessNotification();
|
|
19262
19245
|
var handleAllErrorFormats = common.useAllErrorFormats(onTokenExpired);
|
|
@@ -19292,12 +19275,12 @@ function ActualInvoice() {
|
|
|
19292
19275
|
}, [formattedInvoice]);
|
|
19293
19276
|
if (!formattedInvoice)
|
|
19294
19277
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
19295
|
-
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' : '', " ").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, {
|
|
19278
|
+
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' : '', " ").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 && !hidePaymentForm && (jsxRuntime.jsx("div", __assign({ className: "bunny-w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? '' : 'pt-12') }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice }) })))] })) })));
|
|
19296
19279
|
}
|
|
19297
19280
|
|
|
19298
|
-
var MUTATION$8 = function (
|
|
19281
|
+
var MUTATION$8 = function () { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n quote {\n documentTemplateId\n documents { id filename size date url }\n firstInvoice {\n id\n state\n }\n payableId\n id\n payToAccept\n currentPaymentHold {\n createdAt\n expiresAt\n id\n updatedAt\n paymentMethod {\n accountId\n createdAt\n expirationDate\n failureCode\n id\n isDefault\n lastSuccess\n paymentType\n pluginId\n state\n updatedAt\n metadata {\n description\n expiration\n icon\n identifier\n issuer\n kind\n }\n }\n }\n }\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\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 }"; };
|
|
19299
19282
|
var getFormattedQuote = function (_a) {
|
|
19300
|
-
var
|
|
19283
|
+
var token = _a.token, apiHost = _a.apiHost;
|
|
19301
19284
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
19302
19285
|
var response;
|
|
19303
19286
|
return __generator(this, function (_b) {
|
|
@@ -19306,12 +19289,11 @@ var getFormattedQuote = function (_a) {
|
|
|
19306
19289
|
query: MUTATION$8(),
|
|
19307
19290
|
token: token,
|
|
19308
19291
|
apiHost: apiHost,
|
|
19309
|
-
vars: { id: id },
|
|
19310
19292
|
})];
|
|
19311
19293
|
case 1:
|
|
19312
19294
|
response = _b.sent();
|
|
19313
|
-
if (response
|
|
19314
|
-
throw new Error(response
|
|
19295
|
+
if (response.errors && response.errors.length > 0) {
|
|
19296
|
+
throw new Error(response.errors[0].message);
|
|
19315
19297
|
}
|
|
19316
19298
|
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.formattedQuote];
|
|
19317
19299
|
}
|
|
@@ -19606,10 +19588,9 @@ var PaymentHoldModal = function (_a) {
|
|
|
19606
19588
|
var visible = _a.visible, setVisible = _a.setVisible, quote = _a.quote;
|
|
19607
19589
|
var queryClient = reactQuery.useQueryClient();
|
|
19608
19590
|
var token = useToken();
|
|
19609
|
-
var entityId = useCurrentUserData().entityId;
|
|
19610
19591
|
return (jsxRuntime.jsxs(StyledModal$1, __assign({ centered: true, onCancel: function () {
|
|
19611
19592
|
setVisible(false);
|
|
19612
|
-
}, footer: null, open: visible, width: 600 }, { children: [jsxRuntime.jsx(Title$2, __assign({ className: "mt-4 pb-4 mx-4", level: 5 }, { children: "Pay to accept" })), jsxRuntime.jsx("div", __assign({ className: "mb-4" }, { children: jsxRuntime.jsx(PaymentForm, {
|
|
19593
|
+
}, footer: null, open: visible, width: 600 }, { children: [jsxRuntime.jsx(Title$2, __assign({ className: "mt-4 pb-4 mx-4", level: 5 }, { children: "Pay to accept" })), jsxRuntime.jsx("div", __assign({ className: "mb-4" }, { children: jsxRuntime.jsx(PaymentForm, { quote: {
|
|
19613
19594
|
amount: quote.amount,
|
|
19614
19595
|
currencyId: quote.currency,
|
|
19615
19596
|
id: quote.quote.id,
|
|
@@ -19632,7 +19613,7 @@ var PaymentHoldModal = function (_a) {
|
|
|
19632
19613
|
} }) }))] })));
|
|
19633
19614
|
};
|
|
19634
19615
|
|
|
19635
|
-
var Text$
|
|
19616
|
+
var Text$o = antd.Typography.Text;
|
|
19636
19617
|
defaultStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
19637
19618
|
function Quote(_a) {
|
|
19638
19619
|
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;
|
|
@@ -19672,18 +19653,10 @@ function ActualQuote() {
|
|
|
19672
19653
|
var _f = reactQuery.useQuery({
|
|
19673
19654
|
queryKey: common.QueryKeyFactory.default.createQuoteKey({ id: id, token: token }),
|
|
19674
19655
|
queryFn: function () { return __awaiter(_this, void 0, void 0, function () {
|
|
19675
|
-
var error_1;
|
|
19676
19656
|
return __generator(this, function (_a) {
|
|
19677
19657
|
switch (_a.label) {
|
|
19678
|
-
case 0:
|
|
19679
|
-
_a.trys.push([0, 2, , 3]);
|
|
19680
|
-
return [4 /*yield*/, getFormattedQuote({ token: token, apiHost: apiHost, id: id })];
|
|
19658
|
+
case 0: return [4 /*yield*/, getFormattedQuote({ token: token, apiHost: apiHost })];
|
|
19681
19659
|
case 1: return [2 /*return*/, _a.sent()];
|
|
19682
|
-
case 2:
|
|
19683
|
-
error_1 = _a.sent();
|
|
19684
|
-
showErrorNotification(error_1.message);
|
|
19685
|
-
return [3 /*break*/, 3];
|
|
19686
|
-
case 3: return [2 /*return*/];
|
|
19687
19660
|
}
|
|
19688
19661
|
});
|
|
19689
19662
|
}); },
|
|
@@ -19698,7 +19671,6 @@ function ActualQuote() {
|
|
|
19698
19671
|
}), acceptBoxVisible = _g.acceptBoxVisible, isAccepting = _g.isAccepting, sendAccept = _g.sendAccept, setAcceptBoxVisible = _g.setAcceptBoxVisible, setIsAccepting = _g.setIsAccepting, startAcceptance = _g.startAcceptance, pandadocPollingModalVisible = _g.pandadocPollingModalVisible, setPandadocPollingModalVisible = _g.setPandadocPollingModalVisible, isSendAcceptPending = _g.isSendAcceptPending;
|
|
19699
19672
|
useSigningComplete({ data: formattedQuote, token: token });
|
|
19700
19673
|
var isMobile = common.useIsMobile();
|
|
19701
|
-
var showErrorNotification = common.useErrorNotification();
|
|
19702
19674
|
react.useEffect(function () {
|
|
19703
19675
|
if (formattedQuote) {
|
|
19704
19676
|
onQuoteLoaded === null || onQuoteLoaded === void 0 ? void 0 : onQuoteLoaded(formattedQuote);
|
|
@@ -19723,7 +19695,7 @@ function ActualQuote() {
|
|
|
19723
19695
|
if ((firstInvoice === null || firstInvoice === void 0 ? void 0 : firstInvoice.state) === 'PAID' && paymentHoldCompleted) {
|
|
19724
19696
|
return jsxRuntime.jsx(Invoice, { id: firstInvoice.id });
|
|
19725
19697
|
}
|
|
19726
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4
|
|
19698
|
+
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.jsx(QuoteButtons, { isAccepted: isAccepted, formattedQuote: formattedQuote, isMobile: isMobile, hideDownloadButton: hideDownloadButton, id: id, isAccepting: isAccepting, handleClickAccept: handleClickAccept, setPaymentHoldModalVisible: setPaymentHoldModalVisible, shouldDoPaymentHold: shouldDoPaymentHold, paymentHoldCompleted: paymentHoldCompleted, paymentHold: paymentHold }), jsxRuntime.jsx(InvoiceQuoteView, __assign({ html: formattedQuote.html, targetUrl: ((_b = formattedQuote === null || formattedQuote === void 0 ? void 0 : formattedQuote.quote) === null || _b === void 0 ? void 0 : _b.documentTemplateId) ? "/pdf/quote" : undefined }, { children: ((_d = (_c = formattedQuote.quote) === null || _c === void 0 ? void 0 : _c.documents) === null || _d === void 0 ? void 0 : _d.length) > 0 ? (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: formattedQuote.quote.documents.map(function (doc, index) {
|
|
19727
19699
|
return (jsxRuntime.jsx(antd.Button, __assign({ download: doc.filename, href: doc.url, type: "link" }, { children: doc.filename }), index));
|
|
19728
19700
|
}) }))) : null }))] })), jsxRuntime.jsx(AcceptQuoteModal, { acceptBoxVisible: acceptBoxVisible, formattedQuote: formattedQuote, setAcceptBoxVisible: setAcceptBoxVisible, setIsAccepting: setIsAccepting, sendAccept: sendAccept, isSendAcceptPending: isSendAcceptPending }), jsxRuntime.jsx(PaymentHoldModal, { visible: paymentHoldModalVisible, setVisible: setPaymentHoldModalVisible, quote: formattedQuote }), jsxRuntime.jsx(PandadocPollingModal, { isVisible: pandadocPollingModalVisible, setVisible: setPandadocPollingModalVisible, id: id })] }));
|
|
19729
19701
|
}
|
|
@@ -19738,7 +19710,7 @@ function QuoteButtons(_a) {
|
|
|
19738
19710
|
var signingPlugins = useSigningPlugins({ apiHost: apiHost, token: token });
|
|
19739
19711
|
return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-row justify-end items-center gap-4", id: "acceptance", style: {
|
|
19740
19712
|
color: entityBranding.secondaryColor,
|
|
19741
|
-
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$
|
|
19713
|
+
} }, { 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: [paymentHold ? (jsxRuntime.jsx(PaymentHoldDisplay, { paymentHold: paymentHold, currency: formattedQuote.currency, amount: formattedQuote.amount })) : null, !isMobile && !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(icons.DownloadOutlined, {}), onClick: function () { return downloadFile(apiHost + '/api/pdf/quote', token); } }, { children: "Download" }))) : null, shouldDoPaymentHold && !paymentHoldCompleted ? (jsxRuntime.jsx(antd.Button, __assign({ disabled: isExpired, onClick: function () { return setPaymentHoldModalVisible(true); }, type: "primary" }, { children: "Pay to accept" }))) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: !isAccepted ? (jsxRuntime.jsx(antd.Button, __assign({ disabled: isExpired || isAccepting, onClick: handleClickAccept, type: "primary" }, { children: isExpired
|
|
19742
19714
|
? 'Quote is expired'
|
|
19743
19715
|
: (signingPlugins === null || signingPlugins === void 0 ? void 0 : signingPlugins.length)
|
|
19744
19716
|
? 'Start signing'
|
|
@@ -19838,10 +19810,10 @@ var getColor = function (state) {
|
|
|
19838
19810
|
}
|
|
19839
19811
|
};
|
|
19840
19812
|
|
|
19841
|
-
var Text$
|
|
19813
|
+
var Text$n = antd.Typography.Text;
|
|
19842
19814
|
var TransactionDate = function (_a) {
|
|
19843
19815
|
var date = _a.date;
|
|
19844
|
-
return jsxRuntime.jsx(Text$
|
|
19816
|
+
return jsxRuntime.jsx(Text$n, __assign({ className: "bunny-text-sm" }, { children: common.formatDate(date) }));
|
|
19845
19817
|
};
|
|
19846
19818
|
|
|
19847
19819
|
var ArrowDownToLine = function (_a) {
|
|
@@ -19878,13 +19850,13 @@ var TransactionGridCell = defaultStyled.div.withConfig({
|
|
|
19878
19850
|
}, common.SLATE_600);
|
|
19879
19851
|
var templateObject_1$6;
|
|
19880
19852
|
|
|
19881
|
-
var Text$
|
|
19853
|
+
var Text$m = antd.Typography.Text;
|
|
19882
19854
|
var TransactionsEmptyState = function () {
|
|
19883
19855
|
var noTransactionsMessage = react.useContext(TransactionsListContext).noTransactionsMessage;
|
|
19884
|
-
return (jsxRuntime.jsx(Text$
|
|
19856
|
+
return (jsxRuntime.jsx(Text$m, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || 'There are no transactions' })));
|
|
19885
19857
|
};
|
|
19886
19858
|
|
|
19887
|
-
var Text$
|
|
19859
|
+
var Text$l = antd.Typography.Text;
|
|
19888
19860
|
var isInvoice = function (transaction) {
|
|
19889
19861
|
return transaction.kind === 'INVOICE';
|
|
19890
19862
|
};
|
|
@@ -19893,7 +19865,7 @@ var TransactionRowTitle = function (_a) {
|
|
|
19893
19865
|
if (!isInvoice(transaction)) {
|
|
19894
19866
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
19895
19867
|
}
|
|
19896
|
-
return (jsxRuntime.jsx(Text$
|
|
19868
|
+
return (jsxRuntime.jsx(Text$l, __assign({ className: "bunny-text-slate-400", style: { fontSize: '11px' } }, { children: transaction.transactionable.number })));
|
|
19897
19869
|
};
|
|
19898
19870
|
|
|
19899
19871
|
function transactionDateToDisplay(transaction, transactionDateType) {
|
|
@@ -19911,7 +19883,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
|
|
|
19911
19883
|
}
|
|
19912
19884
|
}
|
|
19913
19885
|
|
|
19914
|
-
var Text$
|
|
19886
|
+
var Text$k = antd.Typography.Text;
|
|
19915
19887
|
var TransactionsListDesktop = function (_a) {
|
|
19916
19888
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
19917
19889
|
var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
|
|
@@ -19940,11 +19912,11 @@ var TransactionsListDesktop = function (_a) {
|
|
|
19940
19912
|
!showState &&
|
|
19941
19913
|
!showAmount &&
|
|
19942
19914
|
!showDownload &&
|
|
19943
|
-
!showAccountName && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$
|
|
19915
|
+
!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));
|
|
19944
19916
|
}) }));
|
|
19945
19917
|
};
|
|
19946
19918
|
|
|
19947
|
-
var Text$
|
|
19919
|
+
var Text$j = antd.Typography.Text;
|
|
19948
19920
|
var TransactionsListMobile = function (_a) {
|
|
19949
19921
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
19950
19922
|
var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
|
|
@@ -19967,11 +19939,11 @@ var TransactionsListMobile = function (_a) {
|
|
|
19967
19939
|
backgroundColor: index % 2 === 0
|
|
19968
19940
|
? "var(--row-background".concat(darkMode ? '-dark' : '', ")")
|
|
19969
19941
|
: "var(--row-background-alternate".concat(darkMode ? '-dark' : '', ")"),
|
|
19970
|
-
} }, { 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$
|
|
19942
|
+
} }, { 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 || transaction.amount, transaction.currencyId) }))] }))] })) }), showDownload && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })))] }), index));
|
|
19971
19943
|
}) }));
|
|
19972
19944
|
};
|
|
19973
19945
|
|
|
19974
|
-
var Text$
|
|
19946
|
+
var Text$i = antd.Typography.Text;
|
|
19975
19947
|
var DISPLAY_WIDTH = 1200;
|
|
19976
19948
|
function Transactions(_a) {
|
|
19977
19949
|
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 ? [
|
|
@@ -19981,7 +19953,7 @@ function Transactions(_a) {
|
|
|
19981
19953
|
common.TransactionKind.WRITE_OFF,
|
|
19982
19954
|
] : _j, style = _a.style, filter = _a.filter, noTransactionsMessage = _a.noTransactionsMessage, filterTransactions = _a.filterTransactions, _k = _a.sortTransactions, sortTransactions = _k === void 0 ? function (a, b) {
|
|
19983
19955
|
return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
|
|
19984
|
-
} : _k, _l = _a.transactionDateType, transactionDateType = _l === void 0 ? 'createdAt' : _l;
|
|
19956
|
+
} : _k, _l = _a.transactionDateType, transactionDateType = _l === void 0 ? 'createdAt' : _l, _m = _a.hidePaymentForm, hidePaymentForm = _m === void 0 ? false : _m;
|
|
19985
19957
|
var contextValues = {
|
|
19986
19958
|
showSearchBar: showSearchBar,
|
|
19987
19959
|
showTitle: showTitle,
|
|
@@ -20001,11 +19973,12 @@ function Transactions(_a) {
|
|
|
20001
19973
|
filterTransactions: filterTransactions,
|
|
20002
19974
|
sortTransactions: sortTransactions,
|
|
20003
19975
|
transactionDateType: transactionDateType,
|
|
19976
|
+
hidePaymentForm: hidePaymentForm,
|
|
20004
19977
|
};
|
|
20005
19978
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
20006
19979
|
var token = useToken();
|
|
20007
19980
|
// Local state
|
|
20008
|
-
var
|
|
19981
|
+
var _o = react.useState(''), search = _o[0], setSearch = _o[1];
|
|
20009
19982
|
var filterValue = filter || (search ? "filter: \"transaction.transactionableId is ".concat(search, "\"") : '');
|
|
20010
19983
|
// Queries
|
|
20011
19984
|
var data = reactQuery.useQuery({
|
|
@@ -20018,7 +19991,7 @@ function Transactions(_a) {
|
|
|
20018
19991
|
function TransactionsDisplay(_a) {
|
|
20019
19992
|
var _b, _c;
|
|
20020
19993
|
var transactions = _a.transactions, onSearchValueChanged = _a.onSearchValueChanged, search = _a.search;
|
|
20021
|
-
var _d = react.useContext(TransactionsListContext), showSearchBar = _d.showSearchBar, showTitle = _d.showTitle, title = _d.title, transactionComponent = _d.transactionComponent, useModal = _d.useModal, suppressTransactionDisplay = _d.suppressTransactionDisplay, className = _d.className, shadow = _d.shadow, searchBarClassName = _d.searchBarClassName, style = _d.style, onTransactionClick = _d.onTransactionClick, onTransactionDisplayClose = _d.onTransactionDisplayClose, kindsToShow = _d.kindsToShow, filterTransactions = _d.filterTransactions, sortTransactions = _d.sortTransactions
|
|
19994
|
+
var _d = react.useContext(TransactionsListContext), showSearchBar = _d.showSearchBar, showTitle = _d.showTitle, title = _d.title, transactionComponent = _d.transactionComponent, useModal = _d.useModal, suppressTransactionDisplay = _d.suppressTransactionDisplay, className = _d.className, shadow = _d.shadow, searchBarClassName = _d.searchBarClassName, style = _d.style, onTransactionClick = _d.onTransactionClick, onTransactionDisplayClose = _d.onTransactionDisplayClose, kindsToShow = _d.kindsToShow, filterTransactions = _d.filterTransactions, sortTransactions = _d.sortTransactions, hidePaymentForm = _d.hidePaymentForm;
|
|
20022
19995
|
var columns = react.useContext(TransactionsListContext).columns;
|
|
20023
19996
|
var darkMode = react.useContext(BunnyContext).darkMode;
|
|
20024
19997
|
var secondaryColor = react.useContext(BrandContext).secondaryColor;
|
|
@@ -20082,7 +20055,7 @@ function TransactionsDisplay(_a) {
|
|
|
20082
20055
|
onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
|
|
20083
20056
|
setDrawerOpen(false);
|
|
20084
20057
|
}
|
|
20085
|
-
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$
|
|
20058
|
+
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
|
|
20086
20059
|
), showSearchBar && (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? 'bunny-w-full' : '') }, { children: jsxRuntime.jsx(antd.Input, { className: searchBarClassName ? searchBarClassName : '', onChange: function (e) {
|
|
20087
20060
|
if (isNaN(Number(e.target.value))) {
|
|
20088
20061
|
return;
|
|
@@ -20093,7 +20066,7 @@ function TransactionsDisplay(_a) {
|
|
|
20093
20066
|
}, value: search }) })))] }))) : null, jsxRuntime.jsx("div", __assign({ className: "bunny-grid bunny-w-full bunny-rounded-md bunny-overflow-auto ".concat(shadow), style: {
|
|
20094
20067
|
gridTemplateColumns: gridTemplateColumns(),
|
|
20095
20068
|
backgroundColor: "var(--row-background".concat(darkMode ? '-dark' : '', ")"),
|
|
20096
|
-
} }, { children: isMobile ? (jsxRuntime.jsx(TransactionsListMobile, { transactions: updatedTransactions, onTransactionClick: handleTransactionClick })) : (jsxRuntime.jsx(TransactionsListDesktop, { transactions: updatedTransactions, onTransactionClick: handleTransactionClick })) }))] })), useModal ? (jsxRuntime.jsx(antd.Modal, __assign({ title: drawerTitle(), open: drawerOpen, onOk: handleDisplayClose, onCancel: handleDisplayClose, width: DISPLAY_WIDTH, footer: null }, { children: jsxRuntime.jsx(Invoice, { id:
|
|
20069
|
+
} }, { children: isMobile ? (jsxRuntime.jsx(TransactionsListMobile, { transactions: updatedTransactions, onTransactionClick: handleTransactionClick })) : (jsxRuntime.jsx(TransactionsListDesktop, { transactions: updatedTransactions, onTransactionClick: handleTransactionClick })) }))] })), useModal ? (jsxRuntime.jsx(antd.Modal, __assign({ title: drawerTitle(), open: drawerOpen, onOk: handleDisplayClose, onCancel: handleDisplayClose, width: DISPLAY_WIDTH, footer: null }, { children: jsxRuntime.jsx(Invoice, { id: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.transactionableId, hidePaymentForm: hidePaymentForm }) }))) : (jsxRuntime.jsx(antd.Drawer, __assign({ title: drawerTitle(), onClose: handleDisplayClose, open: drawerOpen, width: DISPLAY_WIDTH }, { children: transactionComponent ? (transactionComponent) : (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind) === 'INVOICE' ? (jsxRuntime.jsx(Invoice, { id: selectedTransaction.transactionableId, hidePaymentForm: hidePaymentForm })) : (jsxRuntime.jsxs(antd.Card, __assign({ className: "bunny-shadow-md" }, { children: [jsxRuntime.jsx(antd.Typography.Title, __assign({ level: 2, className: "bunny-mb-4" }, { children: "Transaction Details" })), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Amount:" }), ' ', jsxRuntime.jsx(antd.Typography.Text, { children: common.formatCurrency((selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.amount) || 0, (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.currencyId) || 'USD') })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Description:" }), ' ', jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.description })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "Kind:" }), ' ', jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind })] }), jsxRuntime.jsxs(antd.Typography.Paragraph, { children: [jsxRuntime.jsx("strong", { children: "State:" }), ' ', jsxRuntime.jsx(antd.Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.state })] })] }))) })))] })));
|
|
20097
20070
|
}
|
|
20098
20071
|
|
|
20099
20072
|
function Quotes(_a) {
|
|
@@ -20312,21 +20285,22 @@ var getPriceList = function (_a) {
|
|
|
20312
20285
|
});
|
|
20313
20286
|
};
|
|
20314
20287
|
|
|
20315
|
-
var
|
|
20288
|
+
var QUOTE_FIELDS = function (removeFormattedQuoteField) { return "\n fragment QuoteFields on Quote {\n accountId\n amount\n amountDue\n smallUnitAmountDue\n currencyId\n ".concat(removeFormattedQuoteField ? '' : "formattedQuote { html }", "\n id\n payableId\n periodAmount\n subtotal\n taxAmount\n startDate\n amountsByPeriod {\n amount\n startDate\n }\n kind\n quoteChanges {\n currencyId\n id\n kind\n charges {\n subtotal\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 coupon {\n couponCode\n }\n quantity\n kind\n }\n priceList {\n id\n plan {\n name\n }\n product {\n name\n }\n }\n }\n }\n"); };
|
|
20289
|
+
var QUOTE_QUERY = function (id, removeFormattedQuoteField) { return "\n".concat(QUOTE_FIELDS(removeFormattedQuoteField), "\n query quote {\n quote ").concat(id ? "(id: ".concat(id, ")") : '', " {\n ...QuoteFields\n }\n }"); };
|
|
20316
20290
|
var getQuote = function (_a) {
|
|
20317
|
-
var id = _a.id, token = _a.token, apiHost = _a.apiHost;
|
|
20291
|
+
var id = _a.id, token = _a.token, apiHost = _a.apiHost, _b = _a.removeFormattedQuoteField, removeFormattedQuoteField = _b === void 0 ? false : _b;
|
|
20318
20292
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
20319
20293
|
var response;
|
|
20320
|
-
return __generator(this, function (
|
|
20321
|
-
switch (
|
|
20294
|
+
return __generator(this, function (_c) {
|
|
20295
|
+
switch (_c.label) {
|
|
20322
20296
|
case 0: return [4 /*yield*/, gqlRequest({
|
|
20323
|
-
query: QUOTE_QUERY(id),
|
|
20297
|
+
query: QUOTE_QUERY(id, removeFormattedQuoteField),
|
|
20324
20298
|
token: token,
|
|
20325
20299
|
vars: {},
|
|
20326
20300
|
apiHost: apiHost,
|
|
20327
20301
|
})];
|
|
20328
20302
|
case 1:
|
|
20329
|
-
response =
|
|
20303
|
+
response = _c.sent();
|
|
20330
20304
|
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.quote];
|
|
20331
20305
|
}
|
|
20332
20306
|
});
|
|
@@ -20467,27 +20441,84 @@ var useUpdateCoupons = function (_a) {
|
|
|
20467
20441
|
};
|
|
20468
20442
|
};
|
|
20469
20443
|
|
|
20444
|
+
var CURRENT_USER_DATA_QUERY = "{\n company {\n name\n }\n currentUser {\n account {\n billingCountry\n currencyId\n }\n authObjectName\n payload {\n returnUrl\n }\n privacyUrl\n termsUrl\n entityId\n }\n }";
|
|
20445
|
+
var getCurrentUserData = function (_a) {
|
|
20446
|
+
var token = _a.token, apiHost = _a.apiHost;
|
|
20447
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
20448
|
+
var response;
|
|
20449
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
20450
|
+
return __generator(this, function (_k) {
|
|
20451
|
+
switch (_k.label) {
|
|
20452
|
+
case 0: return [4 /*yield*/, common.gqlRequest({
|
|
20453
|
+
query: CURRENT_USER_DATA_QUERY,
|
|
20454
|
+
token: token,
|
|
20455
|
+
apiHost: apiHost,
|
|
20456
|
+
})];
|
|
20457
|
+
case 1:
|
|
20458
|
+
response = _k.sent();
|
|
20459
|
+
return [2 /*return*/, {
|
|
20460
|
+
authObjectName: (_b = response === null || response === void 0 ? void 0 : response.currentUser) === null || _b === void 0 ? void 0 : _b.authObjectName,
|
|
20461
|
+
account: (_c = response === null || response === void 0 ? void 0 : response.currentUser) === null || _c === void 0 ? void 0 : _c.account,
|
|
20462
|
+
companyName: (_d = response === null || response === void 0 ? void 0 : response.company) === null || _d === void 0 ? void 0 : _d.name,
|
|
20463
|
+
returnUrl: (_f = (_e = response === null || response === void 0 ? void 0 : response.currentUser) === null || _e === void 0 ? void 0 : _e.payload) === null || _f === void 0 ? void 0 : _f.returnUrl,
|
|
20464
|
+
privacyUrl: (_g = response === null || response === void 0 ? void 0 : response.currentUser) === null || _g === void 0 ? void 0 : _g.privacyUrl,
|
|
20465
|
+
termsUrl: (_h = response === null || response === void 0 ? void 0 : response.currentUser) === null || _h === void 0 ? void 0 : _h.termsUrl,
|
|
20466
|
+
entityId: (_j = response === null || response === void 0 ? void 0 : response.currentUser) === null || _j === void 0 ? void 0 : _j.entityId,
|
|
20467
|
+
}];
|
|
20468
|
+
}
|
|
20469
|
+
});
|
|
20470
|
+
});
|
|
20471
|
+
};
|
|
20472
|
+
|
|
20473
|
+
var useCurrentUserData = function (token) {
|
|
20474
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
20475
|
+
var currentUserData = reactQuery.useQuery({
|
|
20476
|
+
queryKey: common.QueryKeyFactory.default.currentUserKey(token),
|
|
20477
|
+
queryFn: function () { return getCurrentUserData({ token: token, apiHost: apiHost }); },
|
|
20478
|
+
enabled: Boolean(token),
|
|
20479
|
+
}).data;
|
|
20480
|
+
return currentUserData || {};
|
|
20481
|
+
};
|
|
20482
|
+
|
|
20470
20483
|
var BunnyFooterIcon = function (_a) {
|
|
20471
20484
|
var color = _a.color;
|
|
20472
20485
|
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" }) })) })] })));
|
|
20473
20486
|
};
|
|
20474
20487
|
|
|
20475
|
-
var Text$
|
|
20488
|
+
var Text$h = antd.Typography.Text;
|
|
20476
20489
|
var Footer = function (_a) {
|
|
20477
20490
|
var className = _a.className;
|
|
20478
|
-
var
|
|
20491
|
+
var token = useToken();
|
|
20492
|
+
var _b = useCurrentUserData(token), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
|
|
20479
20493
|
var isMobile = common.useIsMobile();
|
|
20480
20494
|
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' : '', " ").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, {})] })));
|
|
20481
20495
|
};
|
|
20482
20496
|
var BunnyMarketingLink = function () {
|
|
20483
20497
|
var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
|
|
20484
20498
|
var isMobile = common.useIsMobile();
|
|
20485
|
-
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$
|
|
20499
|
+
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 }) }))] })) })) })));
|
|
20486
20500
|
};
|
|
20487
20501
|
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"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n"])), common.SLATE_400, common.SLATE_500);
|
|
20488
20502
|
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);
|
|
20489
20503
|
var templateObject_1$5, templateObject_2$1;
|
|
20490
20504
|
|
|
20505
|
+
function shouldShowCouponEditor(quote, activeCouponsExist, upgradingSubscription) {
|
|
20506
|
+
var _a;
|
|
20507
|
+
var upgradingFromTrial = ((_a = upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL;
|
|
20508
|
+
function upgradingFromFree() {
|
|
20509
|
+
var totalPrice = upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.charges.reduce(function (acc, charge) { return acc + Number((charge === null || charge === void 0 ? void 0 : charge.discountedPrice) || 0); }, 0);
|
|
20510
|
+
return totalPrice === 0;
|
|
20511
|
+
}
|
|
20512
|
+
var quoteKindIsValid = quote.kind === common.QuoteChangeKind.SUBSCRIBE ||
|
|
20513
|
+
quote.kind === common.QuoteChangeKind.ADJUSTMENT ||
|
|
20514
|
+
quote.kind === common.QuoteChangeKind.ACTIVATE;
|
|
20515
|
+
if (quoteKindIsValid) {
|
|
20516
|
+
console.log(activeCouponsExist && (upgradingFromTrial || upgradingFromFree()));
|
|
20517
|
+
return activeCouponsExist && (upgradingFromTrial || upgradingFromFree());
|
|
20518
|
+
}
|
|
20519
|
+
return false;
|
|
20520
|
+
}
|
|
20521
|
+
|
|
20491
20522
|
function CouponEditor(_a) {
|
|
20492
20523
|
var className = _a.className, onAddCoupon = _a.onAddCoupon, isAddingCoupon = _a.isAddingCoupon, couponCode = _a.couponCode, setCouponCode = _a.setCouponCode;
|
|
20493
20524
|
function handleAddCoupon() {
|
|
@@ -20501,10 +20532,13 @@ function CouponEditor(_a) {
|
|
|
20501
20532
|
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, size: "small" }), jsxRuntime.jsx(antd.Button, __assign({ loading: isAddingCoupon, type: "primary", onClick: handleAddCoupon, disabled: couponCode.length === 0 }, { children: "Apply" }))] })) })));
|
|
20502
20533
|
}
|
|
20503
20534
|
|
|
20504
|
-
var
|
|
20535
|
+
var SubscriptionsContext = react.createContext({});
|
|
20536
|
+
|
|
20537
|
+
var Text$g = antd.Typography.Text;
|
|
20505
20538
|
function CheckoutSummary(_a) {
|
|
20506
20539
|
var quote = _a.quote, className = _a.className, onAddCoupon = _a.onAddCoupon, onRemoveCoupon = _a.onRemoveCoupon, isRemovingCoupon = _a.isRemovingCoupon, priceListData = _a.priceListData, isAddingCoupon = _a.isAddingCoupon, couponCode = _a.couponCode, setCouponCode = _a.setCouponCode, activeCouponsExist = _a.activeCouponsExist;
|
|
20507
|
-
|
|
20540
|
+
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
20541
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className, " bunny-space-y-4") }, { children: [jsxRuntime.jsxs(Text$g, { 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) {
|
|
20508
20542
|
return quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.map(function (charge) {
|
|
20509
20543
|
var _a;
|
|
20510
20544
|
var multiplier = charge.kind === 'COUPON' ? -1 : 1;
|
|
@@ -20519,7 +20553,8 @@ function CheckoutSummary(_a) {
|
|
|
20519
20553
|
onRemoveCoupon((_b = charge.coupon) === null || _b === void 0 ? void 0 : _b.couponCode);
|
|
20520
20554
|
}, className: "bunny-text-orange-500 hover:bunny-text-orange-400 bunny-cursor-pointer" }, { children: "Remove" }))) : (jsxRuntime.jsx("div", { children: charge.quantity })) })), jsxRuntime.jsx("div", __assign({ className: "bunny-col-span-1 bunny-text-right" }, { children: common.formatCurrency(multiplier * (charge.subtotal || 0), charge.currencyId) }))] }), charge.id));
|
|
20521
20555
|
});
|
|
20522
|
-
}) })), 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.subtotal, 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.currencyId) })] }))] }),
|
|
20556
|
+
}) })), 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.subtotal, 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.currencyId) })] }))] }), upgradingSubscription &&
|
|
20557
|
+
shouldShowCouponEditor(quote, activeCouponsExist, upgradingSubscription) && (jsxRuntime.jsx(CouponEditor, { className: "bunny-w-full", quote: quote, onAddCoupon: onAddCoupon, isAddingCoupon: isAddingCoupon, couponCode: couponCode, setCouponCode: setCouponCode }))] })));
|
|
20523
20558
|
}
|
|
20524
20559
|
var CheckoutSummaryDivider = function () {
|
|
20525
20560
|
return (jsxRuntime.jsx("div", __assign({ className: "bunny-my-2" }, { children: jsxRuntime.jsx(antd.Divider, { className: "m-0" }) })));
|
|
@@ -20528,8 +20563,7 @@ var CheckoutSummaryDivider = function () {
|
|
|
20528
20563
|
var Title$1 = antd.Typography.Title;
|
|
20529
20564
|
function PaymentForms(_a) {
|
|
20530
20565
|
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, defaultValues = _a.defaultValues;
|
|
20531
|
-
|
|
20532
|
-
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("div", __assign({ className: "bunny-overflow-y-auto bunny-max-h-[calc(100vh-10rem)]" }, { children: jsxRuntime.jsx(PaymentForm, { entityId: entityId, 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, defaultValues: defaultValues })] })) }));
|
|
20566
|
+
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("div", __assign({ className: "bunny-overflow-y-auto bunny-max-h-[calc(100vh-10rem)]" }, { children: 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, defaultValues: defaultValues })] })) }));
|
|
20533
20567
|
}
|
|
20534
20568
|
function InitialSignupForm(_a) {
|
|
20535
20569
|
var className = _a.className, onSubmit = _a.onSubmit, submitting = _a.submitting, defaultValues = _a.defaultValues;
|
|
@@ -20566,18 +20600,18 @@ function InitialSignupForm(_a) {
|
|
|
20566
20600
|
} }) })) })) })), 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" })) })] })) })));
|
|
20567
20601
|
}
|
|
20568
20602
|
|
|
20569
|
-
var Title = antd.Typography.Title, Text$
|
|
20603
|
+
var Title = antd.Typography.Title, Text$f = antd.Typography.Text;
|
|
20570
20604
|
function PaymentSuccessDisplay(_a) {
|
|
20571
20605
|
var amountPaid = _a.amountPaid, className = _a.className, companyName = _a.companyName, returnUrl = _a.returnUrl, style = _a.style, currencyId = _a.currencyId;
|
|
20572
|
-
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$
|
|
20606
|
+
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$f, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
|
|
20573
20607
|
}
|
|
20574
20608
|
|
|
20575
|
-
var Text$
|
|
20609
|
+
var Text$e = antd.Typography.Text;
|
|
20576
20610
|
function PriceListDisplay(_a) {
|
|
20577
20611
|
var priceListData = _a.priceListData;
|
|
20578
20612
|
if (!priceListData)
|
|
20579
20613
|
return null;
|
|
20580
|
-
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$
|
|
20614
|
+
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$e, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: [priceListData.product.name, " ", priceListData.name] })), jsxRuntime.jsxs(Text$e, __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$e, __assign({ style: { fontSize: '16px' }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$e, __assign({ className: "bunny-text-slate-500", style: { fontSize: '12px' } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })));
|
|
20581
20615
|
}
|
|
20582
20616
|
|
|
20583
20617
|
var showErrorNotification = common.useErrorNotification();
|
|
@@ -20782,19 +20816,14 @@ function Signup(_a) {
|
|
|
20782
20816
|
} }) }))) }))] })));
|
|
20783
20817
|
}
|
|
20784
20818
|
|
|
20785
|
-
var
|
|
20786
|
-
var
|
|
20787
|
-
return
|
|
20788
|
-
|
|
20789
|
-
|
|
20790
|
-
|
|
20791
|
-
|
|
20792
|
-
|
|
20793
|
-
data = _a.sent();
|
|
20794
|
-
return [2 /*return*/, data];
|
|
20795
|
-
}
|
|
20796
|
-
});
|
|
20797
|
-
}); };
|
|
20819
|
+
var quoteSubscriptionUpgrade = function (_a) {
|
|
20820
|
+
var subscriptionId = _a.subscriptionId, priceListId = _a.priceListId, apiHost = _a.apiHost, token = _a.token;
|
|
20821
|
+
return gqlRequest({
|
|
20822
|
+
query: "mutation QuoteSubscriptionUpgrade($subscriptionId: ID!, $priceListId: ID!) {\n quoteSubscriptionUpgrade(\n subscriptionId: $subscriptionId\n priceListId: $priceListId\n ) {\n quote {\n id\n }\n }\n }",
|
|
20823
|
+
vars: { subscriptionId: subscriptionId, priceListId: priceListId },
|
|
20824
|
+
apiHost: apiHost,
|
|
20825
|
+
token: token,
|
|
20826
|
+
});
|
|
20798
20827
|
};
|
|
20799
20828
|
var useCreateSubscriptionQuote = function () {
|
|
20800
20829
|
var graphQLRequest = useGraphQLRequest();
|
|
@@ -20840,8 +20869,31 @@ var useQuoteDelete = function () {
|
|
|
20840
20869
|
});
|
|
20841
20870
|
}); };
|
|
20842
20871
|
};
|
|
20872
|
+
var quoteSubscriptionAddon = function (_a) {
|
|
20873
|
+
var subscriptionId = _a.subscriptionId, priceListId = _a.priceListId, apiHost = _a.apiHost, token = _a.token;
|
|
20874
|
+
return gqlRequest({
|
|
20875
|
+
query: "mutation QuoteSubscriptionAddon($subscriptionId: ID!, $priceListId: ID) {\n quoteSubscriptionAddon(subscriptionId: $subscriptionId, priceListId: $priceListId) {\n errors\n quote {\n id\n }\n }\n }",
|
|
20876
|
+
vars: {
|
|
20877
|
+
subscriptionId: subscriptionId,
|
|
20878
|
+
priceListId: priceListId,
|
|
20879
|
+
},
|
|
20880
|
+
apiHost: apiHost,
|
|
20881
|
+
token: token,
|
|
20882
|
+
});
|
|
20883
|
+
};
|
|
20884
|
+
var quoteSubscriptionActivate = function (_a) {
|
|
20885
|
+
var subscriptionId = _a.subscriptionId, apiHost = _a.apiHost, token = _a.token;
|
|
20886
|
+
return gqlRequest({
|
|
20887
|
+
query: "mutation QuoteSubscriptionActivate($subscriptionId: ID!) {\n quoteSubscriptionActivate(subscriptionId: $subscriptionId) {\n quote {\n id\n }\n }\n }",
|
|
20888
|
+
vars: {
|
|
20889
|
+
subscriptionId: subscriptionId,
|
|
20890
|
+
},
|
|
20891
|
+
apiHost: apiHost,
|
|
20892
|
+
token: token,
|
|
20893
|
+
});
|
|
20894
|
+
};
|
|
20843
20895
|
|
|
20844
|
-
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
|
|
20896
|
+
var SUBSCRIPTIONS_QUERY = "\nquery subscriptions {\n subscriptions {\n nodes {\n addonSubscriptions {\n id\n }\n cancellationDate\n currencyId\n endDate\n evergreen\n id\n period\n plan { id name selfServiceBuy selfServiceCancel selfServiceRenew }\n priceList {\n id\n periodMonths\n name\n plan {\n id\n addon\n addonPlans { id }\n }\n }\n product { id name showProductNameOnLineItem }\n startDate\n state\n trialEndDate\n trialPeriod\n trialStartDate\n account { id }\n daysLeftInTrial\n trialExpirationAction\n charges {\n priceListCharge {\n priceListChargeTiers {\n price\n starts\n }\n featureAddon\n id\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 }";
|
|
20845
20897
|
var getSubscriptions = function (_a) {
|
|
20846
20898
|
var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, token = _a.token;
|
|
20847
20899
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -20927,7 +20979,7 @@ var accountUpdate = function (_a) {
|
|
|
20927
20979
|
});
|
|
20928
20980
|
};
|
|
20929
20981
|
|
|
20930
|
-
var COUNTRIES_REQUIRING_STATE = [
|
|
20982
|
+
var COUNTRIES_REQUIRING_STATE = ['US', 'CA'];
|
|
20931
20983
|
var TaxationForm = function (_a) {
|
|
20932
20984
|
var account = _a.account, quote = _a.quote;
|
|
20933
20985
|
// Hooks
|
|
@@ -20955,19 +21007,18 @@ var TaxationForm = function (_a) {
|
|
|
20955
21007
|
}); },
|
|
20956
21008
|
onSuccess: function () {
|
|
20957
21009
|
queryClient.invalidateQueries({
|
|
20958
|
-
queryKey: [
|
|
21010
|
+
queryKey: ['getTaxationRequiredAccountFields', token],
|
|
20959
21011
|
});
|
|
20960
21012
|
},
|
|
20961
21013
|
}), updateAccount = _b.mutate, isUpdatingAccount = _b.isPending;
|
|
20962
|
-
return (jsxRuntime.jsxs(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4", form: form, initialValues: account, layout: "vertical", onFinish: updateAccount }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing street", name: "billingStreet" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Street" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing city", name: "billingCity" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "City" }) })), jsxRuntime.jsx(FormBillingState, {
|
|
21014
|
+
return (jsxRuntime.jsxs(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4", form: form, initialValues: account, layout: "vertical", onFinish: updateAccount }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing street", name: "billingStreet" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Street" }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing city", name: "billingCity" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "City" }) })), jsxRuntime.jsx(FormBillingState, {}), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing country", name: "billingCountry", rules: [{ required: true }] }, { children: jsxRuntime.jsx(antd.Select, { options: common.Lists.COUNTRY_LIST, placeholder: "Select a country", showSearch: true, filterOption: function (input, option) {
|
|
20963
21015
|
var _a, _b;
|
|
20964
|
-
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a :
|
|
20965
|
-
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b :
|
|
21016
|
+
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : '').toLowerCase().includes(input.toLowerCase()) ||
|
|
21017
|
+
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b : '').toLowerCase().includes(input.toLowerCase());
|
|
20966
21018
|
} }) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing zip", name: "billingZip" }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "Zip" }) })), jsxRuntime.jsx(antd.Form.Item, { children: jsxRuntime.jsx(antd.Button, __assign({ className: "bunny-w-full", disabled: isUpdatingAccount, htmlType: "submit", type: "primary" }, { children: "Submit" })) })] })));
|
|
20967
21019
|
};
|
|
20968
|
-
var FormBillingState = function (
|
|
20969
|
-
|
|
20970
|
-
var billingCountry = antd.Form.useWatch("billingCountry");
|
|
21020
|
+
var FormBillingState = function () {
|
|
21021
|
+
var billingCountry = antd.Form.useWatch('billingCountry');
|
|
20971
21022
|
var billingStateRequired = COUNTRIES_REQUIRING_STATE.includes(billingCountry);
|
|
20972
21023
|
return (jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Billing state", name: "billingState", rules: [{ required: billingStateRequired }] }, { children: jsxRuntime.jsx(antd.Input, { placeholder: "State" }) })));
|
|
20973
21024
|
};
|
|
@@ -20977,11 +21028,11 @@ var QuoteCheckout = function (_a) {
|
|
|
20977
21028
|
var _b, _c;
|
|
20978
21029
|
var account = _a.account, onSuccess = _a.onSuccess, onFail = _a.onFail, quote = _a.quote, taxationRequiredAccountFields = _a.taxationRequiredAccountFields, onRecalculateTaxes = _a.onRecalculateTaxes;
|
|
20979
21030
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
21031
|
+
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
20980
21032
|
var token = useToken();
|
|
20981
21033
|
var isMobile = common.useIsMobile();
|
|
20982
21034
|
var _d = react.useState(false), isSaving = _d[0], setIsSaving = _d[1];
|
|
20983
21035
|
var paymentRequired = getQuoteAmountDue(quote) > 0;
|
|
20984
|
-
var entityId = useCurrentUserData().entityId;
|
|
20985
21036
|
var queryClient = reactQuery.useQueryClient();
|
|
20986
21037
|
var _e = react.useState(''), couponCode = _e[0], setCouponCode = _e[1];
|
|
20987
21038
|
var _f = useUpdateCoupons({
|
|
@@ -21042,7 +21093,8 @@ var QuoteCheckout = function (_a) {
|
|
|
21042
21093
|
}
|
|
21043
21094
|
if (taxationRequiredAccountFields)
|
|
21044
21095
|
return (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsx(TaxationForm, { account: account, quote: quote }) })));
|
|
21045
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: paymentRequired ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 bunny-w-full" }, { children: [jsxRuntime.jsx(PaymentForm, {
|
|
21096
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: paymentRequired ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 bunny-w-full" }, { children: [jsxRuntime.jsx(PaymentForm, { onFail: onFail, onPaymentSuccess: onSuccess, quote: quote }), (couponsOnQuote === null || couponsOnQuote === void 0 ? void 0 : couponsOnQuote.length) === 0 ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: upgradingSubscription &&
|
|
21097
|
+
shouldShowCouponEditor(quote, activeCouponsExist, upgradingSubscription) && (jsxRuntime.jsx(CouponEditor, { className: "bunny-px-4 bunny-pt-1", quote: quote, onAddCoupon: addCoupon, isAddingCoupon: isAddingCoupon, couponCode: couponCode, setCouponCode: setCouponCode })) })) : (jsxRuntime.jsx(antd.Button, __assign({ type: "link", loading: isRemovingCoupon, onClick: function () {
|
|
21046
21098
|
couponsOnQuote === null || couponsOnQuote === void 0 ? void 0 : couponsOnQuote.forEach(function (couponCharge) {
|
|
21047
21099
|
var _a;
|
|
21048
21100
|
var couponCode = (_a = couponCharge === null || couponCharge === void 0 ? void 0 : couponCharge.coupon) === null || _a === void 0 ? void 0 : _a.couponCode;
|
|
@@ -21167,13 +21219,9 @@ var QuotePreviewContext = react.createContext({});
|
|
|
21167
21219
|
function QuotePreviewProvider(_a) {
|
|
21168
21220
|
var children = _a.children;
|
|
21169
21221
|
var _b = react.useState(), quotePreviewData = _b[0], setQuotePreviewData = _b[1];
|
|
21170
|
-
function handleSetEditingQuote(editingQuoteId) {
|
|
21171
|
-
setQuotePreviewData(__assign(__assign({}, quotePreviewData), { editingQuoteId: editingQuoteId }));
|
|
21172
|
-
}
|
|
21173
21222
|
return (jsxRuntime.jsx(QuotePreviewContext.Provider, __assign({ value: {
|
|
21174
21223
|
quotePreviewData: quotePreviewData,
|
|
21175
21224
|
setQuotePreviewData: setQuotePreviewData,
|
|
21176
|
-
handleSetEditingQuote: handleSetEditingQuote,
|
|
21177
21225
|
} }, { children: children })));
|
|
21178
21226
|
}
|
|
21179
21227
|
|
|
@@ -21191,7 +21239,167 @@ var PageTitle = function (_a) {
|
|
|
21191
21239
|
} })), title] })));
|
|
21192
21240
|
};
|
|
21193
21241
|
|
|
21194
|
-
var
|
|
21242
|
+
var useQuoteCreate = function (_a) {
|
|
21243
|
+
var editingQuote = _a.editingQuote, setEditingQuoteData = _a.setEditingQuoteData, upgradingSubscription = _a.upgradingSubscription, selectedPriceList = _a.selectedPriceList, token = _a.token;
|
|
21244
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
21245
|
+
// Queries
|
|
21246
|
+
var quote = reactQuery.useQuery({
|
|
21247
|
+
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
21248
|
+
objectName: 'editingQuote',
|
|
21249
|
+
id: editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id,
|
|
21250
|
+
token: token,
|
|
21251
|
+
}),
|
|
21252
|
+
queryFn: function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
21253
|
+
var quote;
|
|
21254
|
+
return __generator(this, function (_a) {
|
|
21255
|
+
switch (_a.label) {
|
|
21256
|
+
case 0:
|
|
21257
|
+
if (!(editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id)) {
|
|
21258
|
+
throw new Error('editingQuote is undefined');
|
|
21259
|
+
}
|
|
21260
|
+
return [4 /*yield*/, getQuote({
|
|
21261
|
+
id: editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id,
|
|
21262
|
+
token: token,
|
|
21263
|
+
apiHost: apiHost,
|
|
21264
|
+
removeFormattedQuoteField: false,
|
|
21265
|
+
})];
|
|
21266
|
+
case 1:
|
|
21267
|
+
quote = _a.sent();
|
|
21268
|
+
return [2 /*return*/, quote];
|
|
21269
|
+
}
|
|
21270
|
+
});
|
|
21271
|
+
}); },
|
|
21272
|
+
enabled: Boolean(editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id),
|
|
21273
|
+
}).data;
|
|
21274
|
+
var _b = reactQuery.useMutation({
|
|
21275
|
+
mutationFn: function (_a) {
|
|
21276
|
+
var subscriptionId = _a.subscriptionId, priceListId = _a.priceListId;
|
|
21277
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
21278
|
+
return __generator(this, function (_b) {
|
|
21279
|
+
switch (_b.label) {
|
|
21280
|
+
case 0: return [4 /*yield*/, quoteSubscriptionUpgrade({ subscriptionId: subscriptionId, priceListId: priceListId, apiHost: apiHost, token: token })];
|
|
21281
|
+
case 1: return [2 /*return*/, _b.sent()];
|
|
21282
|
+
}
|
|
21283
|
+
});
|
|
21284
|
+
});
|
|
21285
|
+
},
|
|
21286
|
+
onSuccess: function (subscriptionUpdateData) {
|
|
21287
|
+
var _a;
|
|
21288
|
+
var quote = (_a = subscriptionUpdateData === null || subscriptionUpdateData === void 0 ? void 0 : subscriptionUpdateData.quoteSubscriptionUpgrade) === null || _a === void 0 ? void 0 : _a.quote;
|
|
21289
|
+
setEditingQuoteData === null || setEditingQuoteData === void 0 ? void 0 : setEditingQuoteData(quote.id);
|
|
21290
|
+
},
|
|
21291
|
+
}), createQuote = _b.mutate, isCreatingQuote = _b.isPending;
|
|
21292
|
+
var _c = reactQuery.useMutation({
|
|
21293
|
+
mutationFn: function (_a) {
|
|
21294
|
+
var subscriptionId = _a.subscriptionId;
|
|
21295
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
21296
|
+
return __generator(this, function (_b) {
|
|
21297
|
+
switch (_b.label) {
|
|
21298
|
+
case 0: return [4 /*yield*/, quoteSubscriptionAddon({ subscriptionId: subscriptionId, apiHost: apiHost, token: token })];
|
|
21299
|
+
case 1: return [2 /*return*/, _b.sent()];
|
|
21300
|
+
}
|
|
21301
|
+
});
|
|
21302
|
+
});
|
|
21303
|
+
},
|
|
21304
|
+
onSuccess: function (subscriptionAddonUpdateData) {
|
|
21305
|
+
var _a;
|
|
21306
|
+
var quote = (_a = subscriptionAddonUpdateData === null || subscriptionAddonUpdateData === void 0 ? void 0 : subscriptionAddonUpdateData.quoteSubscriptionAddon) === null || _a === void 0 ? void 0 : _a.quote;
|
|
21307
|
+
setEditingQuoteData === null || setEditingQuoteData === void 0 ? void 0 : setEditingQuoteData(quote.id);
|
|
21308
|
+
},
|
|
21309
|
+
}), createEmptyQuote = _c.mutate, isCreatingEmptyQuote = _c.isPending;
|
|
21310
|
+
var subscriptionActivate = reactQuery.useMutation({
|
|
21311
|
+
mutationFn: function (_a) {
|
|
21312
|
+
var subscriptionId = _a.subscriptionId;
|
|
21313
|
+
return __awaiter(void 0, void 0, void 0, function () { return __generator(this, function (_b) {
|
|
21314
|
+
switch (_b.label) {
|
|
21315
|
+
case 0: return [4 /*yield*/, quoteSubscriptionActivate({ subscriptionId: subscriptionId, apiHost: apiHost, token: token })];
|
|
21316
|
+
case 1: return [2 /*return*/, _b.sent()];
|
|
21317
|
+
}
|
|
21318
|
+
}); });
|
|
21319
|
+
},
|
|
21320
|
+
onSuccess: function (response) {
|
|
21321
|
+
var _a;
|
|
21322
|
+
var quote = (_a = response === null || response === void 0 ? void 0 : response.quoteSubscriptionActivate) === null || _a === void 0 ? void 0 : _a.quote;
|
|
21323
|
+
setEditingQuoteData === null || setEditingQuoteData === void 0 ? void 0 : setEditingQuoteData(quote.id);
|
|
21324
|
+
},
|
|
21325
|
+
}).mutate;
|
|
21326
|
+
react.useEffect(function () {
|
|
21327
|
+
var _a;
|
|
21328
|
+
if (!(upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id)) {
|
|
21329
|
+
return;
|
|
21330
|
+
}
|
|
21331
|
+
if (!(selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id)) {
|
|
21332
|
+
return;
|
|
21333
|
+
}
|
|
21334
|
+
var buyingAddonsForCurrentSubscription = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id) === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id);
|
|
21335
|
+
var isActivatingTrialSubscription = ((_a = upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL &&
|
|
21336
|
+
upgradingSubscription.priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id);
|
|
21337
|
+
if (isActivatingTrialSubscription) {
|
|
21338
|
+
subscriptionActivate({
|
|
21339
|
+
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
21340
|
+
});
|
|
21341
|
+
}
|
|
21342
|
+
else if (buyingAddonsForCurrentSubscription) {
|
|
21343
|
+
createEmptyQuote({
|
|
21344
|
+
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
21345
|
+
});
|
|
21346
|
+
}
|
|
21347
|
+
else {
|
|
21348
|
+
createQuote({
|
|
21349
|
+
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
21350
|
+
priceListId: selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id,
|
|
21351
|
+
});
|
|
21352
|
+
}
|
|
21353
|
+
}, [selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id, upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id]);
|
|
21354
|
+
return { quote: quote, isQuotePending: isCreatingQuote || isCreatingEmptyQuote };
|
|
21355
|
+
};
|
|
21356
|
+
|
|
21357
|
+
var PlanManagerQuoteContext = react.createContext({});
|
|
21358
|
+
function useFeatureAddonsPending() {
|
|
21359
|
+
var _a = react.useState([]), featureAddonsLoading = _a[0], setFeatureAddonsLoading = _a[1];
|
|
21360
|
+
var addFeatureAddonLoading = function (featureAddonId) {
|
|
21361
|
+
setFeatureAddonsLoading(__spreadArray(__spreadArray([], featureAddonsLoading, true), [featureAddonId], false));
|
|
21362
|
+
};
|
|
21363
|
+
var removeFeatureAddonLoading = function (featureAddonId) {
|
|
21364
|
+
setFeatureAddonsLoading(featureAddonsLoading.filter(function (id) { return id !== featureAddonId; }));
|
|
21365
|
+
};
|
|
21366
|
+
return {
|
|
21367
|
+
isFeatureAddonsLoading: featureAddonsLoading.length > 0,
|
|
21368
|
+
addFeatureAddonLoading: addFeatureAddonLoading,
|
|
21369
|
+
removeFeatureAddonLoading: removeFeatureAddonLoading,
|
|
21370
|
+
};
|
|
21371
|
+
}
|
|
21372
|
+
function PlanManagerQuoteProvider(_a) {
|
|
21373
|
+
var children = _a.children, editingQuoteData = _a.editingQuoteData, setEditingQuoteData = _a.setEditingQuoteData;
|
|
21374
|
+
// Contexts
|
|
21375
|
+
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
21376
|
+
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
21377
|
+
// Hooks
|
|
21378
|
+
var token = useToken();
|
|
21379
|
+
var _b = react.useState(false), isAddonPlanLoading = _b[0], setIsAddonPlanLoading = _b[1];
|
|
21380
|
+
var _c = useFeatureAddonsPending(), isFeatureAddonsLoading = _c.isFeatureAddonsLoading, addFeatureAddonLoading = _c.addFeatureAddonLoading, removeFeatureAddonLoading = _c.removeFeatureAddonLoading;
|
|
21381
|
+
var _d = useQuoteCreate({
|
|
21382
|
+
editingQuote: editingQuoteData,
|
|
21383
|
+
setEditingQuoteData: function (quoteId, isTrial) {
|
|
21384
|
+
setEditingQuoteData({
|
|
21385
|
+
id: quoteId || (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) || '',
|
|
21386
|
+
isTrial: isTrial || (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial) || false,
|
|
21387
|
+
});
|
|
21388
|
+
},
|
|
21389
|
+
upgradingSubscription: upgradingSubscription,
|
|
21390
|
+
selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList,
|
|
21391
|
+
token: token,
|
|
21392
|
+
}), quote = _d.quote, isQuotePending = _d.isQuotePending;
|
|
21393
|
+
return (jsxRuntime.jsx(PlanManagerQuoteContext.Provider, __assign({ value: {
|
|
21394
|
+
quote: quote,
|
|
21395
|
+
isQuotePending: isQuotePending,
|
|
21396
|
+
isAddonPlanLoading: isAddonPlanLoading,
|
|
21397
|
+
setIsAddonPlanLoading: setIsAddonPlanLoading,
|
|
21398
|
+
isFeatureAddonsLoading: isFeatureAddonsLoading,
|
|
21399
|
+
addFeatureAddonLoading: addFeatureAddonLoading,
|
|
21400
|
+
removeFeatureAddonLoading: removeFeatureAddonLoading,
|
|
21401
|
+
} }, { children: children })));
|
|
21402
|
+
}
|
|
21195
21403
|
|
|
21196
21404
|
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";
|
|
21197
21405
|
var quoteChargeUpdate = function (_a) {
|
|
@@ -21259,6 +21467,21 @@ var QuantityLabel = function (_a) {
|
|
|
21259
21467
|
return (jsxRuntime.jsx("span", __assign({ className: "bunny-text-slate-500 bunny-font-medium", style: { fontSize: "11px" } }, { children: pluralizedFeatureName.toUpperCase() })));
|
|
21260
21468
|
};
|
|
21261
21469
|
|
|
21470
|
+
function isAddonPurchased(featureAddon, currentSubscription) {
|
|
21471
|
+
var purchasedFeatureAddons = currentSubscription === null || currentSubscription === void 0 ? void 0 : currentSubscription.charges.filter(function (charge) { var _a; return (_a = charge.priceListCharge) === null || _a === void 0 ? void 0 : _a.featureAddon; });
|
|
21472
|
+
if (!purchasedFeatureAddons)
|
|
21473
|
+
return false;
|
|
21474
|
+
return purchasedFeatureAddons.some(function (addon) { var _a; return ((_a = addon.priceListCharge) === null || _a === void 0 ? void 0 : _a.id) === featureAddon.id; });
|
|
21475
|
+
}
|
|
21476
|
+
function priceListHasUnpurchasedFeatureAddons(priceList, currentSubscription) {
|
|
21477
|
+
var featureAddons = priceList.charges.filter(function (charge) { return charge.featureAddon; });
|
|
21478
|
+
var purchasedFeatureAddons = currentSubscription === null || currentSubscription === void 0 ? void 0 : currentSubscription.charges.filter(function (charge) { var _a; return (_a = charge.priceListCharge) === null || _a === void 0 ? void 0 : _a.featureAddon; });
|
|
21479
|
+
var unpurchasedFeatureAddons = featureAddons.filter(function (charge) {
|
|
21480
|
+
return !(purchasedFeatureAddons === null || purchasedFeatureAddons === void 0 ? void 0 : purchasedFeatureAddons.some(function (purchasedCharge) { var _a; return ((_a = purchasedCharge.priceListCharge) === null || _a === void 0 ? void 0 : _a.id) === charge.id; }));
|
|
21481
|
+
});
|
|
21482
|
+
return unpurchasedFeatureAddons.length > 0;
|
|
21483
|
+
}
|
|
21484
|
+
|
|
21262
21485
|
var periodMonthsConverter = function (period) {
|
|
21263
21486
|
if (period === 0)
|
|
21264
21487
|
return common.BillingPeriod.ONCE;
|
|
@@ -21284,28 +21507,130 @@ var billingPeriodConverter = function (period) {
|
|
|
21284
21507
|
return 12;
|
|
21285
21508
|
};
|
|
21286
21509
|
|
|
21287
|
-
var
|
|
21288
|
-
//
|
|
21289
|
-
|
|
21290
|
-
|
|
21291
|
-
|
|
21292
|
-
|
|
21510
|
+
var canShowQuantitiesInput = function (charge, subscription) {
|
|
21511
|
+
// Check if the subscription is active, pending, or in trial,
|
|
21512
|
+
// the pricing model is not flat,
|
|
21513
|
+
// and if it's not a trial, also check if the current charge is the last one in the subscription.
|
|
21514
|
+
var _a, _b, _c;
|
|
21515
|
+
var isActiveSubscription = ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.ACTIVE;
|
|
21516
|
+
var isPendingSubscription = ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.PENDING;
|
|
21517
|
+
var isTrialSubscription = ((_c = subscription.state) === null || _c === void 0 ? void 0 : _c.toUpperCase()) === common.SubscriptionState.TRIAL;
|
|
21518
|
+
var isFlatPricing = charge.pricingModel === 'FLAT';
|
|
21519
|
+
var shouldProcessCharge = (isActiveSubscription || isPendingSubscription || isTrialSubscription) &&
|
|
21520
|
+
!isFlatPricing &&
|
|
21521
|
+
charge.selfServiceQuantity &&
|
|
21522
|
+
!charge.expired;
|
|
21523
|
+
// Now you can use the value of shouldProcessCharge to determine whether to process the charge.
|
|
21524
|
+
return shouldProcessCharge;
|
|
21293
21525
|
};
|
|
21294
|
-
var
|
|
21295
|
-
|
|
21296
|
-
|
|
21297
|
-
|
|
21298
|
-
|
|
21299
|
-
|
|
21300
|
-
|
|
21301
|
-
|
|
21302
|
-
|
|
21303
|
-
|
|
21304
|
-
|
|
21305
|
-
|
|
21306
|
-
|
|
21307
|
-
|
|
21308
|
-
|
|
21526
|
+
var createQuoteParams = function (quote, subscriptionQuantity, editedSubscription) {
|
|
21527
|
+
var quoteChange = quote.quoteChanges.find(function (quoteChange) { return quoteChange.priceList.id === (editedSubscription === null || editedSubscription === void 0 ? void 0 : editedSubscription.subscription.priceList.id); });
|
|
21528
|
+
var quoteChangeCharge = quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.find(function (charge) { return charge.priceListCharge.id === editedSubscription.chargeId; });
|
|
21529
|
+
var charges = [
|
|
21530
|
+
{
|
|
21531
|
+
id: quoteChangeCharge.id,
|
|
21532
|
+
quantity: editedSubscription.quantity - subscriptionQuantity,
|
|
21533
|
+
},
|
|
21534
|
+
];
|
|
21535
|
+
return { charges: charges, quoteChange: quoteChange };
|
|
21536
|
+
};
|
|
21537
|
+
var canShowChangeQuantities = function (_a) {
|
|
21538
|
+
var subscriptions = _a.subscriptions;
|
|
21539
|
+
return subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.some(function (subscription) {
|
|
21540
|
+
return subscription.charges.some(function (charge) {
|
|
21541
|
+
return canShowQuantitiesInput(charge, subscription);
|
|
21542
|
+
});
|
|
21543
|
+
});
|
|
21544
|
+
};
|
|
21545
|
+
var canSubscriptionUpgradeFromTrial = function (subscription) {
|
|
21546
|
+
var _a;
|
|
21547
|
+
return (((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL &&
|
|
21548
|
+
subscription.plan.selfServiceBuy) ||
|
|
21549
|
+
false;
|
|
21550
|
+
};
|
|
21551
|
+
var isSubscriptionNotActive = function (subscription) {
|
|
21552
|
+
var _a, _b;
|
|
21553
|
+
return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.EXPIRED ||
|
|
21554
|
+
((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.CANCELED;
|
|
21555
|
+
};
|
|
21556
|
+
var isSubscriptionActiveOrPending = function (subscription) {
|
|
21557
|
+
var _a, _b;
|
|
21558
|
+
return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.ACTIVE ||
|
|
21559
|
+
((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.PENDING;
|
|
21560
|
+
};
|
|
21561
|
+
var isSubscriptionTrial = function (subscription) { var _a; return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL; };
|
|
21562
|
+
// Helper function to check if charge is a discount
|
|
21563
|
+
var isDiscount = function (kind) {
|
|
21564
|
+
return kind === common.QuoteChangeKind.DISCOUNT || kind === common.QuoteChangeKind.FREE_PERIOD_DISCOUNT;
|
|
21565
|
+
};
|
|
21566
|
+
var hasPriceTiers = function (charge) {
|
|
21567
|
+
var _a;
|
|
21568
|
+
return Boolean((_a = charge === null || charge === void 0 ? void 0 : charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length);
|
|
21569
|
+
};
|
|
21570
|
+
var hasMultiplePriceTiers = function (charge) {
|
|
21571
|
+
var _a;
|
|
21572
|
+
return ((_a = charge === null || charge === void 0 ? void 0 : charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length) > 1;
|
|
21573
|
+
};
|
|
21574
|
+
var getApplicablePriceTier = function (charge, currencyId, priceDecimals) {
|
|
21575
|
+
var _a;
|
|
21576
|
+
if (!((_a = charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length))
|
|
21577
|
+
return '';
|
|
21578
|
+
var selectedTier;
|
|
21579
|
+
// For TIERED pricing model: always show the first tier
|
|
21580
|
+
if (charge.pricingModel === common.PricingModel.TIERED) {
|
|
21581
|
+
selectedTier = charge.priceTiers[0];
|
|
21582
|
+
}
|
|
21583
|
+
// For VOLUME and BANDS pricing models: find the tier that contains the current quantity
|
|
21584
|
+
else if (charge.pricingModel === common.PricingModel.VOLUME ||
|
|
21585
|
+
charge.pricingModel === common.PricingModel.BANDS) {
|
|
21586
|
+
// Find the appropriate tier based on quantity
|
|
21587
|
+
selectedTier = charge.priceTiers.find(function (tier, index) {
|
|
21588
|
+
var nextTier = charge.priceTiers[index + 1];
|
|
21589
|
+
var tierStart = tier.starts;
|
|
21590
|
+
var tierEnd = nextTier ? nextTier.starts - 1 : Infinity;
|
|
21591
|
+
return charge.quantity >= tierStart && charge.quantity <= tierEnd;
|
|
21592
|
+
});
|
|
21593
|
+
// Fallback to first tier if no tier found (shouldn't happen with proper data)
|
|
21594
|
+
selectedTier = selectedTier || charge.priceTiers[0];
|
|
21595
|
+
}
|
|
21596
|
+
// Default fallback for any other pricing models
|
|
21597
|
+
else {
|
|
21598
|
+
selectedTier = charge.priceTiers[0];
|
|
21599
|
+
}
|
|
21600
|
+
if (!selectedTier)
|
|
21601
|
+
return '';
|
|
21602
|
+
// Calculate the tier range for display
|
|
21603
|
+
var tierIndex = charge.priceTiers.indexOf(selectedTier);
|
|
21604
|
+
var starts = selectedTier.starts;
|
|
21605
|
+
var nextTier = charge.priceTiers[tierIndex + 1];
|
|
21606
|
+
var ends = nextTier ? nextTier.starts - 1 : '∞';
|
|
21607
|
+
return hasMultiplePriceTiers(charge)
|
|
21608
|
+
? "".concat(starts, "-").concat(ends, ": ").concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals))
|
|
21609
|
+
: "".concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals));
|
|
21610
|
+
};
|
|
21611
|
+
|
|
21612
|
+
var removeHTMLTagsRegex = /<br>(?=(?:\s*<[^>]*>)*$)|(<br>)|<[^>]*>/gi;
|
|
21613
|
+
// Description is a string that can contain HTML tags. We want to remove all HTML tags except <br> tags.
|
|
21614
|
+
var createPlanDescription = function (priceList) {
|
|
21615
|
+
return (priceList.plan.description || '').replace(removeHTMLTagsRegex, function (_, y) {
|
|
21616
|
+
return y ? ' & ' : '';
|
|
21617
|
+
});
|
|
21618
|
+
};
|
|
21619
|
+
var getActivePlanPriceData = function (priceList, selectedPriceList) {
|
|
21620
|
+
if (!priceList) {
|
|
21621
|
+
return;
|
|
21622
|
+
}
|
|
21623
|
+
// If a period option is selected, return the charge that matches the selected period option
|
|
21624
|
+
var activeBillingPLCharge;
|
|
21625
|
+
// Default to first price list charge
|
|
21626
|
+
var lowestPLCharge;
|
|
21627
|
+
// Find the lowest price list charge with a billing period that matches the selected period option
|
|
21628
|
+
if (priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id)) {
|
|
21629
|
+
activeBillingPLCharge = priceList.charges[0];
|
|
21630
|
+
}
|
|
21631
|
+
for (var j = 0; j < priceList.charges.length; j++) {
|
|
21632
|
+
var charge = priceList.charges[j];
|
|
21633
|
+
if (charge.chargeType === common.ChargeType.USAGE)
|
|
21309
21634
|
continue;
|
|
21310
21635
|
if (activeBillingPLCharge) {
|
|
21311
21636
|
// If we already found a charge with the same billing period check if this charge is lower
|
|
@@ -21329,33 +21654,36 @@ var getActivePlanPriceData = function (priceList, selectedPriceList) {
|
|
|
21329
21654
|
};
|
|
21330
21655
|
};
|
|
21331
21656
|
var isPriceListDisabled = function (_a) {
|
|
21332
|
-
var
|
|
21333
|
-
|
|
21334
|
-
var
|
|
21335
|
-
|
|
21336
|
-
|
|
21337
|
-
|
|
21338
|
-
|
|
21339
|
-
|
|
21340
|
-
|
|
21341
|
-
|
|
21342
|
-
|
|
21343
|
-
|
|
21344
|
-
|
|
21345
|
-
|
|
21346
|
-
|
|
21347
|
-
return true;
|
|
21348
|
-
}
|
|
21349
|
-
if (isUpgradingPriceList && !canPurchaseFeatureAddons) {
|
|
21350
|
-
return true;
|
|
21657
|
+
var _b;
|
|
21658
|
+
var priceList = _a.priceList, upgradingSubscription = _a.upgradingSubscription;
|
|
21659
|
+
var canPurchaseFeatureAddons = priceListHasUnpurchasedFeatureAddons(priceList, upgradingSubscription);
|
|
21660
|
+
// TODO: rename hasPlanAddons to canPurchasePlanAddons and check whether we can purchase plan addons
|
|
21661
|
+
var hasPlanAddons = (((_b = priceList.plan.addonPlans) === null || _b === void 0 ? void 0 : _b.length) || 0) > 0;
|
|
21662
|
+
var existingSubscriptionInTrial = upgradingSubscription && canSubscriptionUpgradeFromTrial(upgradingSubscription);
|
|
21663
|
+
var isUpgradingSubscriptionPriceList = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id) === priceList.id;
|
|
21664
|
+
// When should priceList be disabled?
|
|
21665
|
+
// if upgradingSubscription?.priceList.id === priceList.id
|
|
21666
|
+
// AND the upgradingSubscription is not in trial
|
|
21667
|
+
// AND cannot purchase feature addons
|
|
21668
|
+
// AND cannot purchase add-on plans
|
|
21669
|
+
// AND selfServiceBuy is false
|
|
21670
|
+
if (isUpgradingSubscriptionPriceList) {
|
|
21671
|
+
return !existingSubscriptionInTrial && !canPurchaseFeatureAddons && !hasPlanAddons;
|
|
21351
21672
|
}
|
|
21352
21673
|
return false;
|
|
21353
21674
|
};
|
|
21354
21675
|
|
|
21355
21676
|
var CheckoutButton = function (_a) {
|
|
21356
|
-
var checkoutButtonDisabled = _a.checkoutButtonDisabled, onClickCheckout = _a.onClickCheckout, loading = _a.loading;
|
|
21677
|
+
var checkoutButtonDisabled = _a.checkoutButtonDisabled, onClickCheckout = _a.onClickCheckout, loading = _a.loading, tooltipText = _a.tooltipText;
|
|
21357
21678
|
var isMobile = common.useIsMobile();
|
|
21358
|
-
|
|
21679
|
+
var TooltipWrapper = function (_a) {
|
|
21680
|
+
var children = _a.children;
|
|
21681
|
+
if (tooltipText) {
|
|
21682
|
+
return jsxRuntime.jsx(antd.Tooltip, __assign({ title: tooltipText }, { children: children }));
|
|
21683
|
+
}
|
|
21684
|
+
return jsxRuntime.jsx("div", { children: children });
|
|
21685
|
+
};
|
|
21686
|
+
return (jsxRuntime.jsx(TooltipWrapper, { children: jsxRuntime.jsx(antd.Button, __assign({ className: isMobile ? 'w-full' : '', disabled: checkoutButtonDisabled, onClick: onClickCheckout, size: isMobile ? 'large' : 'middle', type: "primary", loading: loading }, { children: "Proceed to checkout" })) }));
|
|
21359
21687
|
};
|
|
21360
21688
|
|
|
21361
21689
|
var CheckoutPrice = function (_a) {
|
|
@@ -21372,15 +21700,18 @@ var CheckoutPrice = function (_a) {
|
|
|
21372
21700
|
|
|
21373
21701
|
var CheckoutBarSummarySection = function (_a) {
|
|
21374
21702
|
var _b;
|
|
21375
|
-
var open = _a.open,
|
|
21703
|
+
var open = _a.open, selectedPriceList = _a.selectedPriceList, onClickCheckout = _a.onClickCheckout, upgradingSubscription = _a.upgradingSubscription;
|
|
21376
21704
|
// Context
|
|
21377
21705
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
21378
21706
|
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
21707
|
+
var _c = react.useContext(PlanManagerQuoteContext), quote = _c.quote, isQuotePending = _c.isQuotePending, isAddonPlanLoading = _c.isAddonPlanLoading, isFeatureAddonsLoading = _c.isFeatureAddonsLoading;
|
|
21708
|
+
var accountId = react.useContext(PaymentContext).accountId;
|
|
21379
21709
|
// Hooks
|
|
21380
21710
|
var token = useToken();
|
|
21381
21711
|
var paymentPlugins = usePaymentPlugins({
|
|
21382
21712
|
apiHost: apiHost,
|
|
21383
21713
|
token: token,
|
|
21714
|
+
accountId: accountId,
|
|
21384
21715
|
}).paymentPlugins;
|
|
21385
21716
|
var queryClient = reactQuery.useQueryClient();
|
|
21386
21717
|
var isMobile = common.useIsMobile();
|
|
@@ -21391,39 +21722,42 @@ var CheckoutBarSummarySection = function (_a) {
|
|
|
21391
21722
|
token: token,
|
|
21392
21723
|
}),
|
|
21393
21724
|
});
|
|
21394
|
-
|
|
21725
|
+
// When should checkout button be disabled?
|
|
21726
|
+
var isUpgradingSubscription = selectedPriceList.id !== (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id);
|
|
21395
21727
|
var disableCheckoutButton = Boolean(!(quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity) ||
|
|
21396
21728
|
!selectedPriceList ||
|
|
21397
|
-
// quantityLocal !== quotePreviewData.quantity ||
|
|
21398
21729
|
isFetching ||
|
|
21399
|
-
|
|
21730
|
+
!isUpgradingSubscription ||
|
|
21400
21731
|
open);
|
|
21401
21732
|
var checkoutButtonDisabled = (quote === null || quote === void 0 ? void 0 : quote.amountDue) && (quote === null || quote === void 0 ? void 0 : quote.amountDue) > 0 ? false : disableCheckoutButton;
|
|
21402
21733
|
var activeCharge = (_b = getActivePlanPriceData(selectedPriceList, selectedPriceList)) === null || _b === void 0 ? void 0 : _b.activeCharge;
|
|
21403
21734
|
var isUsage = (activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.chargeType) === common.ChargeType.USAGE;
|
|
21404
|
-
var
|
|
21405
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-4 ".concat(isMobile ? 'bunny-flex-col' : '') }, { children: [quote && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'items-center justify-between w-full' : 'flex-col') }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-text-slate-500 bunny-font-medium bunny-text-right", style: { fontSize: '11px' } }, { children: "TOTAL" })), jsxRuntime.jsx(CheckoutPrice, { isUsage: isUsage, quote: quote, selectedPriceList: selectedPriceList })] }))),
|
|
21735
|
+
var hasPaymentPlugins = Boolean(paymentPlugins === null || paymentPlugins === void 0 ? void 0 : paymentPlugins.length);
|
|
21736
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-4 ".concat(isMobile ? 'bunny-flex-col' : '') }, { children: [quote && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'items-center justify-between w-full' : 'flex-col') }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-text-slate-500 bunny-font-medium bunny-text-right", style: { fontSize: '11px' } }, { children: "TOTAL" })), jsxRuntime.jsx(CheckoutPrice, { isUsage: isUsage, quote: quote, selectedPriceList: selectedPriceList })] }))), jsxRuntime.jsx(CheckoutButton, { checkoutButtonDisabled: checkoutButtonDisabled || !hasPaymentPlugins, onClickCheckout: onClickCheckout, loading: !quote || isQuotePending || isAddonPlanLoading || isFeatureAddonsLoading, tooltipText: !hasPaymentPlugins
|
|
21737
|
+
? 'Cannot checkout. No valid payment plugins found. Please contact your administrator.'
|
|
21738
|
+
: undefined })] })));
|
|
21406
21739
|
};
|
|
21407
21740
|
|
|
21408
21741
|
var PlanPickerCheckoutBarWrapper = function (_a) {
|
|
21409
|
-
var editingQuote = _a.editingQuote,
|
|
21742
|
+
var editingQuote = _a.editingQuote, handlePortalErrors = _a.handlePortalErrors, onCheckoutSuccess = _a.onCheckoutSuccess;
|
|
21410
21743
|
// Context
|
|
21411
21744
|
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
21412
21745
|
var selectedPriceList = quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList;
|
|
21413
21746
|
if (!selectedPriceList)
|
|
21414
21747
|
return null;
|
|
21415
|
-
return (jsxRuntime.jsx(PlanPickerCheckoutBar, { editingQuote: editingQuote,
|
|
21748
|
+
return (jsxRuntime.jsx(PlanPickerCheckoutBar, { editingQuote: editingQuote, handlePortalErrors: handlePortalErrors, selectedPriceList: selectedPriceList, onCheckoutSuccess: onCheckoutSuccess }));
|
|
21416
21749
|
};
|
|
21417
21750
|
var PlanPickerCheckoutBar = function (_a) {
|
|
21418
|
-
var editingQuote = _a.editingQuote,
|
|
21751
|
+
var editingQuote = _a.editingQuote, selectedPriceList = _a.selectedPriceList, handlePortalErrors = _a.handlePortalErrors, onCheckoutSuccess = _a.onCheckoutSuccess;
|
|
21419
21752
|
// Context
|
|
21420
|
-
var token = useToken();
|
|
21421
21753
|
var _b = react.useContext(SubscriptionsContext), upgradingSubscription = _b.upgradingSubscription, shadow = _b.shadow;
|
|
21422
|
-
var
|
|
21754
|
+
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
21423
21755
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
21756
|
+
var quote = react.useContext(PlanManagerQuoteContext).quote;
|
|
21424
21757
|
// Local state
|
|
21425
|
-
var
|
|
21758
|
+
var _c = react.useState(false), payModalVisible = _c[0], setPayModalVisible = _c[1];
|
|
21426
21759
|
// Hooks
|
|
21760
|
+
var token = useToken();
|
|
21427
21761
|
var showSuccessNotification = common.useSuccessNotification();
|
|
21428
21762
|
var queryClient = reactQuery.useQueryClient();
|
|
21429
21763
|
var isMobile = common.useIsMobile();
|
|
@@ -21431,33 +21765,7 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
21431
21765
|
token: token,
|
|
21432
21766
|
apiHost: apiHost,
|
|
21433
21767
|
}).defaultPaymentMethod;
|
|
21434
|
-
var createSubscriptionUpgradeQuote = useQuoteSubscriptionUpgrade();
|
|
21435
|
-
var createSubscriptionUpdateQuote = useCreateSubscriptionQuote();
|
|
21436
21768
|
// Mutations
|
|
21437
|
-
var createQuote = reactQuery.useMutation({
|
|
21438
|
-
mutationFn: function (_a) {
|
|
21439
|
-
var subscriptionId = _a.subscriptionId, priceListId = _a.priceListId;
|
|
21440
|
-
return createSubscriptionUpgradeQuote(subscriptionId, priceListId, apiHost, token);
|
|
21441
|
-
},
|
|
21442
|
-
onSuccess: function (subscriptionUpdateData) {
|
|
21443
|
-
var _a;
|
|
21444
|
-
var quote = (_a = subscriptionUpdateData === null || subscriptionUpdateData === void 0 ? void 0 : subscriptionUpdateData.quoteSubscriptionUpgrade) === null || _a === void 0 ? void 0 : _a.quote;
|
|
21445
|
-
setEditingQuoteData === null || setEditingQuoteData === void 0 ? void 0 : setEditingQuoteData(quote.id);
|
|
21446
|
-
handleSetEditingQuote(quote.id);
|
|
21447
|
-
},
|
|
21448
|
-
});
|
|
21449
|
-
var createEmptyQuote = reactQuery.useMutation({
|
|
21450
|
-
mutationFn: function (_a) {
|
|
21451
|
-
var subscriptionId = _a.subscriptionId;
|
|
21452
|
-
return createSubscriptionUpdateQuote([subscriptionId], apiHost, token);
|
|
21453
|
-
},
|
|
21454
|
-
onSuccess: function (subscriptionUpdateData) {
|
|
21455
|
-
var _a;
|
|
21456
|
-
var quote = (_a = subscriptionUpdateData === null || subscriptionUpdateData === void 0 ? void 0 : subscriptionUpdateData.quoteSubscriptionUpdate) === null || _a === void 0 ? void 0 : _a.quote;
|
|
21457
|
-
setEditingQuoteData === null || setEditingQuoteData === void 0 ? void 0 : setEditingQuoteData(quote.id);
|
|
21458
|
-
handleSetEditingQuote(quote.id);
|
|
21459
|
-
},
|
|
21460
|
-
});
|
|
21461
21769
|
var updateCharge = reactQuery.useMutation({
|
|
21462
21770
|
mutationFn: quoteChargeUpdate,
|
|
21463
21771
|
onSuccess: function () {
|
|
@@ -21470,64 +21778,6 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
21470
21778
|
});
|
|
21471
21779
|
},
|
|
21472
21780
|
}).mutate;
|
|
21473
|
-
// Queries
|
|
21474
|
-
var quote = reactQuery.useQuery({
|
|
21475
|
-
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
21476
|
-
objectName: 'editingQuote',
|
|
21477
|
-
id: editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id,
|
|
21478
|
-
token: token,
|
|
21479
|
-
}),
|
|
21480
|
-
queryFn: function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
21481
|
-
var quote;
|
|
21482
|
-
return __generator(this, function (_a) {
|
|
21483
|
-
switch (_a.label) {
|
|
21484
|
-
case 0:
|
|
21485
|
-
if (!(editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id)) {
|
|
21486
|
-
throw new Error('editingQuote is undefined');
|
|
21487
|
-
}
|
|
21488
|
-
return [4 /*yield*/, getQuote({
|
|
21489
|
-
id: editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id,
|
|
21490
|
-
token: token,
|
|
21491
|
-
apiHost: apiHost,
|
|
21492
|
-
})];
|
|
21493
|
-
case 1:
|
|
21494
|
-
quote = _a.sent();
|
|
21495
|
-
return [2 /*return*/, quote];
|
|
21496
|
-
}
|
|
21497
|
-
});
|
|
21498
|
-
}); },
|
|
21499
|
-
enabled: Boolean(editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.id),
|
|
21500
|
-
}).data;
|
|
21501
|
-
react.useEffect(function () {
|
|
21502
|
-
if (!(upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id)) {
|
|
21503
|
-
console.error('upgradingSubscription is undefined');
|
|
21504
|
-
return;
|
|
21505
|
-
}
|
|
21506
|
-
var upgradingCurrentSubscription = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id) === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id);
|
|
21507
|
-
if (upgradingCurrentSubscription) {
|
|
21508
|
-
createEmptyQuote.mutate({
|
|
21509
|
-
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
21510
|
-
});
|
|
21511
|
-
}
|
|
21512
|
-
else {
|
|
21513
|
-
createQuote.mutate({
|
|
21514
|
-
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
21515
|
-
priceListId: selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id,
|
|
21516
|
-
});
|
|
21517
|
-
}
|
|
21518
|
-
}, [selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id]);
|
|
21519
|
-
// Reset query key on unmount
|
|
21520
|
-
react.useEffect(function () {
|
|
21521
|
-
return function () {
|
|
21522
|
-
queryClient.invalidateQueries({
|
|
21523
|
-
queryKey: common.QueryKeyFactory.default.calculatedPricesKey({
|
|
21524
|
-
priceListId: selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id,
|
|
21525
|
-
quantity: (quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity) || 0,
|
|
21526
|
-
token: token,
|
|
21527
|
-
}),
|
|
21528
|
-
});
|
|
21529
|
-
};
|
|
21530
|
-
}, [queryClient, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity, token]);
|
|
21531
21781
|
var handleCheckoutSuccess = function () {
|
|
21532
21782
|
queryClient.invalidateQueries({
|
|
21533
21783
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
@@ -21542,9 +21792,6 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
21542
21792
|
showSuccessNotification('Your subscription has been created', 'Checkout successful');
|
|
21543
21793
|
onCheckoutSuccess();
|
|
21544
21794
|
};
|
|
21545
|
-
var onCheckoutFail = function (error) {
|
|
21546
|
-
handlePortalErrors === null || handlePortalErrors === void 0 ? void 0 : handlePortalErrors(error);
|
|
21547
|
-
};
|
|
21548
21795
|
function onChangeQuantity(chargeId, quantity) {
|
|
21549
21796
|
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); });
|
|
21550
21797
|
var quoteCharge = quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.find(function (charge) {
|
|
@@ -21566,6 +21813,18 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
21566
21813
|
token: token,
|
|
21567
21814
|
});
|
|
21568
21815
|
}
|
|
21816
|
+
// Reset query key on unmount
|
|
21817
|
+
react.useEffect(function () {
|
|
21818
|
+
return function () {
|
|
21819
|
+
queryClient.invalidateQueries({
|
|
21820
|
+
queryKey: common.QueryKeyFactory.default.calculatedPricesKey({
|
|
21821
|
+
priceListId: selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id,
|
|
21822
|
+
quantity: (quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity) || 0,
|
|
21823
|
+
token: token,
|
|
21824
|
+
}),
|
|
21825
|
+
});
|
|
21826
|
+
};
|
|
21827
|
+
}, [queryClient, selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id, quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity, token]);
|
|
21569
21828
|
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) {
|
|
21570
21829
|
var _a;
|
|
21571
21830
|
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); });
|
|
@@ -21579,13 +21838,13 @@ var PlanPickerCheckoutBar = function (_a) {
|
|
|
21579
21838
|
return (jsxRuntime.jsx(CheckoutBarInput, { disabled: !chargeQuantity, charge: charge, quantity: chargeQuantity !== null && chargeQuantity !== void 0 ? chargeQuantity : 0, selectedPriceList: selectedPriceList, onQuantityChanged: function (quantity) {
|
|
21580
21839
|
onChangeQuantity(charge.id, quantity);
|
|
21581
21840
|
} }, index));
|
|
21582
|
-
}) })), jsxRuntime.jsx(CheckoutBarSummarySection, { onClickCheckout: function () { return setPayModalVisible(true); }, open: payModalVisible,
|
|
21841
|
+
}) })), jsxRuntime.jsx(CheckoutBarSummarySection, { onClickCheckout: function () { return setPayModalVisible(true); }, open: payModalVisible, selectedPriceList: selectedPriceList, upgradingSubscription: upgradingSubscription }), jsxRuntime.jsx(Checkout, { onCancel: function () { return setPayModalVisible(false); }, onFail: function (error) { return handlePortalErrors === null || handlePortalErrors === void 0 ? void 0 : handlePortalErrors(error); }, onSuccess: handleCheckoutSuccess, open: payModalVisible, quote: quote, selectedPriceList: selectedPriceList, storedPaymentMethod: defaultPaymentMethod, token: token })] })));
|
|
21583
21842
|
};
|
|
21584
21843
|
|
|
21585
21844
|
// WARNING: There is a preview button on APP that will need to be changed if this query is changed
|
|
21586
|
-
var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n products {\n everythingInPlus\n id\n name\n plansToDisplay\n features(sort: \"position asc\") {\n description\n id\n isVisible\n kind\n name\n position\n }\n }\n priceLists {\n showPriceAsMonthly\n basePrice\n currencyId\n id\n monthlyBasePrice\n periodMonths\n plan {\n code\n contactUsLabel\n contactUsUrl\n description\n id\n name\n position\n pricingDescription\n pricingStyle\n planFeatures {\n featureId\n value\n feature {\n name\n }\n }\n }\n product {\n id\n }\n charges {\n featureAddon\n basePrice\n billingPeriod\n chargeType\n id\n name\n priceDecimals\n pricingModel\n quantityMax\n quantityMin\n selfServiceQuantity\n priceList {\n id\n }\n feature {\n name\n unitName\n }\n }\n }\n }\n }";
|
|
21845
|
+
var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n products {\n everythingInPlus\n id\n name\n plansToDisplay\n features(sort: \"position asc\") {\n description\n id\n isVisible\n kind\n name\n position\n }\n }\n priceLists {\n showPriceAsMonthly\n basePrice\n currencyId\n id\n monthlyBasePrice\n periodMonths\n addonPlans {\n addon\n availableFrom\n availableTo\n basePrice\n code\n contactUsLabel\n contactUsUrl\n createdAt\n description\n id\n internalNotes\n isAvailableNow\n isVisible\n name\n position\n pricingDescription\n pricingStyle\n productId\n productPlanName\n selfServiceBuy\n selfServiceCancel\n selfServiceRenew\n updatedAt\n priceLists {\n id\n periodMonths\n showPriceAsMonthly\n monthlyBasePrice\n basePrice\n currencyId\n plan {\n pricingStyle\n }\n }\n planFeatures {\n featureId\n value\n feature {\n name\n }\n }\n }\n plan {\n code\n contactUsLabel\n contactUsUrl\n description\n id\n name\n position\n pricingDescription\n pricingStyle\n addon\n addonPlans {\n id\n name\n code\n contactUsLabel\n contactUsUrl\n description\n position\n pricingDescription\n pricingStyle\n addon\n basePrice\n priceLists {\n id\n basePrice\n periodMonths\n isVisible\n }\n }\n compatiblePlans {\n id\n name\n code\n contactUsLabel\n contactUsUrl\n description\n position\n pricingDescription\n pricingStyle\n addon\n }\n planFeatures {\n featureId\n value\n feature {\n name\n }\n }\n }\n product {\n id\n }\n charges {\n featureAddon\n basePrice\n billingPeriod\n chargeType\n id\n name\n priceDecimals\n pricingModel\n quantityMax\n quantityMin\n selfServiceQuantity\n priceList {\n id\n }\n feature {\n name\n unitName\n }\n }\n }\n }\n }";
|
|
21587
21846
|
var getPriceListChangeOptions = function (_a) {
|
|
21588
|
-
var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, token = _a.token, upgradingSubscription = _a.upgradingSubscription;
|
|
21847
|
+
var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, token = _a.token, upgradingSubscription = _a.upgradingSubscription, accountCurrencyId = _a.accountCurrencyId;
|
|
21589
21848
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
21590
21849
|
var response, priceListChangeOptions;
|
|
21591
21850
|
return __generator(this, function (_b) {
|
|
@@ -21606,6 +21865,8 @@ var getPriceListChangeOptions = function (_a) {
|
|
|
21606
21865
|
if (priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) {
|
|
21607
21866
|
priceListChangeOptions.priceLists.sort(function (a, b) { return a.plan.position - b.plan.position; });
|
|
21608
21867
|
}
|
|
21868
|
+
// Filter out price lists that don't have the same currency as the account
|
|
21869
|
+
priceListChangeOptions.priceLists = priceListChangeOptions.priceLists.filter(function (priceList) { return priceList.currencyId === accountCurrencyId; });
|
|
21609
21870
|
return [2 /*return*/, priceListChangeOptions];
|
|
21610
21871
|
}
|
|
21611
21872
|
});
|
|
@@ -21617,6 +21878,34 @@ var ErrorView = function (_a) {
|
|
|
21617
21878
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full", style: { marginTop: "80px" } }, { children: [jsxRuntime.jsx("div", __assign({ style: { fontSize: "32px" } }, { children: message })), children] })));
|
|
21618
21879
|
};
|
|
21619
21880
|
|
|
21881
|
+
var Text$d = antd.Typography.Text;
|
|
21882
|
+
var BillingPeriodSelector = function (_a) {
|
|
21883
|
+
var availableBillingPeriods = _a.availableBillingPeriods, onChangeBillingPeriod = _a.onChangeBillingPeriod, products = _a.products, selectedBillingPeriod = _a.selectedBillingPeriod, selectedProduct = _a.selectedProduct, onChangeProduct = _a.onChangeProduct;
|
|
21884
|
+
var _b = react.useContext(BrandContext), secondaryColor = _b.secondaryColor, brandColor = _b.brandColor;
|
|
21885
|
+
var isMobile = common.useIsMobile();
|
|
21886
|
+
if (!availableBillingPeriods || (availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.length) < 2)
|
|
21887
|
+
return null;
|
|
21888
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-8 bunny-pb-6" }, { children: [(products === null || products === void 0 ? void 0 : products.length) && products.length > 1 && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-xs", style: {
|
|
21889
|
+
color: secondaryColor,
|
|
21890
|
+
} }, { children: "Select product" })), jsxRuntime.jsx(ProductRadioStyled, __assign({ brandColor: brandColor }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
|
|
21891
|
+
onChangeProduct(products === null || products === void 0 ? void 0 : products.find(function (product) { return product.id === e.target.value; }));
|
|
21892
|
+
}, value: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id, buttonStyle: "solid" }, { children: jsxRuntime.jsx(antd.Space, __assign({ className: "bunny-gap-2" }, { children: products === null || products === void 0 ? void 0 : products.map(function (product) { return (jsxRuntime.jsx(antd.Radio.Button, __assign({ value: product.id }, { children: product.name }), product.id)); }) })) })) }))] }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-gap-2" }, { children: [!isMobile && (jsxRuntime.jsx(Text$d, __assign({ className: "bunny-font-medium bunny-text-xs", style: {
|
|
21893
|
+
color: secondaryColor,
|
|
21894
|
+
} }, { children: "Subscription term" }))), jsxRuntime.jsx(StyledRadioGroup, __assign({ className: "bunny-w-full", "$isMobile": isMobile }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
|
|
21895
|
+
onChangeBillingPeriod(e.target.value);
|
|
21896
|
+
}, value: selectedBillingPeriod, size: "small", buttonStyle: "solid" }, { children: availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.map(function (periodMonth, index) {
|
|
21897
|
+
return (jsxRuntime.jsx(antd.Radio.Button, __assign({ value: periodMonthsConverter(periodMonth) }, { children: periodMonthsConverter(periodMonth) }), index));
|
|
21898
|
+
}) })) }))] }))] })));
|
|
21899
|
+
};
|
|
21900
|
+
var ProductRadioStyled = styled__default["default"].div.withConfig({
|
|
21901
|
+
shouldForwardProp: function (prop) { return !['brandColor'].includes(prop); },
|
|
21902
|
+
})(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n border-color: ", " !important;\n color: ", " !important;\n }\n"], ["\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n border-color: ", " !important;\n color: ", " !important;\n }\n"])), function (props) { return (props.brandColor ? props.brandColor : 'black'); }, function (props) { return (props.brandColor ? props.brandColor : 'black'); });
|
|
21903
|
+
var StyledRadioGroup = styled__default["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n .ant-radio-group {\n display: flex !important;\n align-items: center !important;\n padding: 4px !important;\n background-color: ", " !important;\n border-radius: 6px !important;\n width: ", " !important;\n border: none !important;\n }\n .ant-radio-button-wrapper {\n flex-grow: 1 !important;\n z-index: 0 !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-color: transparent !important;\n border-radius: 4px !important;\n > span {\n font-size: 11px !important;\n }\n }\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n background: transparent !important;\n }\n .ant-radio-button-wrapper::before {\n display: none !important;\n }\n"], ["\n .ant-radio-group {\n display: flex !important;\n align-items: center !important;\n padding: 4px !important;\n background-color: ", " !important;\n border-radius: 6px !important;\n width: ", " !important;\n border: none !important;\n }\n .ant-radio-button-wrapper {\n flex-grow: 1 !important;\n z-index: 0 !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-color: transparent !important;\n border-radius: 4px !important;\n > span {\n font-size: 11px !important;\n }\n }\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n background: transparent !important;\n }\n .ant-radio-button-wrapper::before {\n display: none !important;\n }\n"])), common.GRAY_200, function (_a) {
|
|
21904
|
+
var $isMobile = _a.$isMobile;
|
|
21905
|
+
return ($isMobile ? '100%' : 'min-content');
|
|
21906
|
+
});
|
|
21907
|
+
var templateObject_1$4, templateObject_2;
|
|
21908
|
+
|
|
21620
21909
|
var calculateNewQuantity = function (priceList, currentQuantity) {
|
|
21621
21910
|
if (currentQuantity === void 0) { currentQuantity = 1; }
|
|
21622
21911
|
var priceListRecurringCharge = priceList === null || priceList === void 0 ? void 0 : priceList.charges.find(function (priceListCharge) {
|
|
@@ -21648,48 +21937,6 @@ var calculateNewQuantity = function (priceList, currentQuantity) {
|
|
|
21648
21937
|
}
|
|
21649
21938
|
};
|
|
21650
21939
|
|
|
21651
|
-
function isAddonPurchased(featureAddon, currentSubscription) {
|
|
21652
|
-
var purchasedFeatureAddons = currentSubscription === null || currentSubscription === void 0 ? void 0 : currentSubscription.charges.filter(function (charge) { var _a; return (_a = charge.priceListCharge) === null || _a === void 0 ? void 0 : _a.featureAddon; });
|
|
21653
|
-
if (!purchasedFeatureAddons)
|
|
21654
|
-
return false;
|
|
21655
|
-
return purchasedFeatureAddons.some(function (addon) { var _a; return ((_a = addon.priceListCharge) === null || _a === void 0 ? void 0 : _a.id) === featureAddon.id; });
|
|
21656
|
-
}
|
|
21657
|
-
function priceListHasUnpurchasedFeatureAddons(priceList, currentSubscription) {
|
|
21658
|
-
var featureAddons = priceList.charges.filter(function (charge) { return charge.featureAddon; });
|
|
21659
|
-
var purchasedFeatureAddons = currentSubscription === null || currentSubscription === void 0 ? void 0 : currentSubscription.charges.filter(function (charge) { var _a; return (_a = charge.priceListCharge) === null || _a === void 0 ? void 0 : _a.featureAddon; });
|
|
21660
|
-
var unpurchasedFeatureAddons = featureAddons.filter(function (charge) {
|
|
21661
|
-
return !(purchasedFeatureAddons === null || purchasedFeatureAddons === void 0 ? void 0 : purchasedFeatureAddons.some(function (purchasedCharge) { var _a; return ((_a = purchasedCharge.priceListCharge) === null || _a === void 0 ? void 0 : _a.id) === charge.id; }));
|
|
21662
|
-
});
|
|
21663
|
-
return unpurchasedFeatureAddons.length > 0;
|
|
21664
|
-
}
|
|
21665
|
-
|
|
21666
|
-
var BillingPeriodSelector = function (_a) {
|
|
21667
|
-
var availableBillingPeriods = _a.availableBillingPeriods, onChangeBillingPeriod = _a.onChangeBillingPeriod, products = _a.products, selectedBillingPeriod = _a.selectedBillingPeriod, selectedProduct = _a.selectedProduct, onChangeProduct = _a.onChangeProduct;
|
|
21668
|
-
var _b = react.useContext(BrandContext), secondaryColor = _b.secondaryColor, brandColor = _b.brandColor;
|
|
21669
|
-
var isMobile = common.useIsMobile();
|
|
21670
|
-
if (!availableBillingPeriods || (availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.length) < 2)
|
|
21671
|
-
return null;
|
|
21672
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-8 bunny-pb-6" }, { children: [(products === null || products === void 0 ? void 0 : products.length) && products.length > 1 && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-xs", style: {
|
|
21673
|
-
color: secondaryColor,
|
|
21674
|
-
} }, { children: "Select product" })), jsxRuntime.jsx(ProductRadioStyled, __assign({ brandColor: brandColor }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
|
|
21675
|
-
onChangeProduct(products === null || products === void 0 ? void 0 : products.find(function (product) { return product.id === e.target.value; }));
|
|
21676
|
-
}, value: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id, buttonStyle: "solid" }, { children: jsxRuntime.jsx(antd.Space, __assign({ className: "bunny-gap-2" }, { children: products === null || products === void 0 ? void 0 : products.map(function (product) { return (jsxRuntime.jsx(antd.Radio.Button, __assign({ value: product.id }, { children: product.name }), product.id)); }) })) })) }))] }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-gap-2" }, { children: [!isMobile && (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-xs", style: {
|
|
21677
|
-
color: secondaryColor,
|
|
21678
|
-
} }, { children: "Subscription term" }))), jsxRuntime.jsx(StyledRadioGroup, __assign({ className: "bunny-w-full", "$isMobile": isMobile }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
|
|
21679
|
-
onChangeBillingPeriod(e.target.value);
|
|
21680
|
-
}, value: selectedBillingPeriod, size: "small", buttonStyle: "solid" }, { children: availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.map(function (periodMonth, index) {
|
|
21681
|
-
return (jsxRuntime.jsx(antd.Radio.Button, __assign({ value: periodMonthsConverter(periodMonth) }, { children: periodMonthsConverter(periodMonth) }), index));
|
|
21682
|
-
}) })) }))] }))] })));
|
|
21683
|
-
};
|
|
21684
|
-
var ProductRadioStyled = styled__default["default"].div.withConfig({
|
|
21685
|
-
shouldForwardProp: function (prop) { return !['brandColor'].includes(prop); },
|
|
21686
|
-
})(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n border-color: ", " !important;\n color: ", " !important;\n }\n"], ["\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n border-color: ", " !important;\n color: ", " !important;\n }\n"])), function (props) { return (props.brandColor ? props.brandColor : 'black'); }, function (props) { return (props.brandColor ? props.brandColor : 'black'); });
|
|
21687
|
-
var StyledRadioGroup = styled__default["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n .ant-radio-group {\n display: flex !important;\n align-items: center !important;\n padding: 4px !important;\n background-color: ", " !important;\n border-radius: 6px !important;\n width: ", " !important;\n border: none !important;\n }\n .ant-radio-button-wrapper {\n flex-grow: 1 !important;\n z-index: 0 !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-color: transparent !important;\n border-radius: 4px !important;\n > span {\n font-size: 11px !important;\n }\n }\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n background: transparent !important;\n }\n .ant-radio-button-wrapper::before {\n display: none !important;\n }\n"], ["\n .ant-radio-group {\n display: flex !important;\n align-items: center !important;\n padding: 4px !important;\n background-color: ", " !important;\n border-radius: 6px !important;\n width: ", " !important;\n border: none !important;\n }\n .ant-radio-button-wrapper {\n flex-grow: 1 !important;\n z-index: 0 !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-color: transparent !important;\n border-radius: 4px !important;\n > span {\n font-size: 11px !important;\n }\n }\n .ant-radio-button-wrapper:not(.ant-radio-button-wrapper-checked) {\n background: transparent !important;\n }\n .ant-radio-button-wrapper::before {\n display: none !important;\n }\n"])), common.GRAY_200, function (_a) {
|
|
21688
|
-
var $isMobile = _a.$isMobile;
|
|
21689
|
-
return ($isMobile ? '100%' : 'min-content');
|
|
21690
|
-
});
|
|
21691
|
-
var templateObject_1$4, templateObject_2;
|
|
21692
|
-
|
|
21693
21940
|
var NextPriceListButton = function (_a) {
|
|
21694
21941
|
var availablePriceLists = _a.availablePriceLists, priceListStart = _a.priceListStart, setPriceListStart = _a.setPriceListStart, numberOfPlansToDisplay = _a.numberOfPlansToDisplay;
|
|
21695
21942
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-absolute bunny-flex bunny-gap-1", style: { top: '12px', right: '8px' } }, { children: [priceListStart > 0 && (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-center bunny-rounded-full bunny-shadow bunny-p-1 bunny-cursor-pointer", onClick: function () {
|
|
@@ -21714,6 +21961,8 @@ var NextPriceListButton = function (_a) {
|
|
|
21714
21961
|
var getAvailablePlansAndPriceLists = function (_a) {
|
|
21715
21962
|
var availablePriceLists = _a.availablePriceLists, priceListChangeOptions = _a.priceListChangeOptions, priceListStart = _a.priceListStart, plansToDisplay = _a.plansToDisplay;
|
|
21716
21963
|
var displayPriceLists = availablePriceLists.slice(priceListStart, priceListStart + plansToDisplay);
|
|
21964
|
+
// displayPriceLists don't have enough data in them, so we're finding the same price list within
|
|
21965
|
+
// priceListChangeOptions which has more data in it.
|
|
21717
21966
|
var availablePriceListsArray = displayPriceLists === null || displayPriceLists === void 0 ? void 0 : displayPriceLists.map(function (displayPriceList) {
|
|
21718
21967
|
var _a;
|
|
21719
21968
|
var foundPriceList = (_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _a === void 0 ? void 0 : _a.find(function (priceList) { return priceList.plan.id === displayPriceList.plan.id; });
|
|
@@ -21730,14 +21979,13 @@ var everythingInPlusString = function (_a) {
|
|
|
21730
21979
|
};
|
|
21731
21980
|
|
|
21732
21981
|
var PriceListCardButton = function (_a) {
|
|
21733
|
-
var
|
|
21734
|
-
// Context
|
|
21982
|
+
var disableSelectCurrentPlan = _a.disableSelectCurrentPlan, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, isSelected = _a.isSelected, priceList = _a.priceList, subscriptionPlan = _a.subscriptionPlan;
|
|
21735
21983
|
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
21736
|
-
var showBuyAddonsButton = isPriceListCurrentSubscription &&
|
|
21737
|
-
subscriptionPlan &&
|
|
21738
|
-
priceListHasUnpurchasedFeatureAddons(priceList, upgradingSubscription);
|
|
21739
21984
|
var isPriceListNonSubscribedCurrentPlan = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.plan.id) === priceList.plan.id && !isPriceListCurrentSubscription;
|
|
21985
|
+
var canUpgradeFromTrial = upgradingSubscription && canSubscriptionUpgradeFromTrial(upgradingSubscription);
|
|
21740
21986
|
var createButtonText = function () {
|
|
21987
|
+
if (isPriceListCurrentSubscription && canUpgradeFromTrial)
|
|
21988
|
+
return 'Upgrade from trial';
|
|
21741
21989
|
if (isPriceListCurrentSubscription)
|
|
21742
21990
|
return 'Current';
|
|
21743
21991
|
if (isSelected)
|
|
@@ -21748,11 +21996,9 @@ var PriceListCardButton = function (_a) {
|
|
|
21748
21996
|
return priceList.plan.contactUsLabel;
|
|
21749
21997
|
return 'Select';
|
|
21750
21998
|
};
|
|
21751
|
-
return (jsxRuntime.
|
|
21752
|
-
|
|
21753
|
-
|
|
21754
|
-
maxWidth: '240px',
|
|
21755
|
-
}, type: isSelected ? 'primary' : 'default' }, { children: createButtonText() })) }))] })));
|
|
21999
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-grow bunny-w-full bunny-justify-end bunny-gap-3" }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-w-full" }, { children: jsxRuntime.jsx(antd.Button, __assign({ className: "bunny-w-full", disabled: disableSelectCurrentPlan, style: {
|
|
22000
|
+
maxWidth: '240px',
|
|
22001
|
+
}, type: isSelected ? 'primary' : 'default' }, { children: createButtonText() })) })) })));
|
|
21756
22002
|
};
|
|
21757
22003
|
|
|
21758
22004
|
var Text$c = antd.Typography.Text;
|
|
@@ -21781,9 +22027,9 @@ var calculatePriceDecimals = function (priceList) {
|
|
|
21781
22027
|
return 0;
|
|
21782
22028
|
};
|
|
21783
22029
|
var PriceListCardPrice = function (_a) {
|
|
21784
|
-
var priceList = _a.priceList;
|
|
22030
|
+
var priceList = _a.priceList, _b = _a.fontSize, fontSize = _b === void 0 ? '32px' : _b;
|
|
21785
22031
|
var priceDecimals = calculatePriceDecimals(priceList);
|
|
21786
|
-
return (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center bunny-text-gray-900", style: { fontSize:
|
|
22032
|
+
return (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center bunny-text-gray-900", style: { fontSize: fontSize } }, { children: !priceList.plan.pricingStyle || priceList.plan.pricingStyle === common.PricingStyle.PRICED
|
|
21787
22033
|
? common.formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
|
|
21788
22034
|
: priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US
|
|
21789
22035
|
? ''
|
|
@@ -21827,11 +22073,36 @@ function PriceDescriptionString(_a) {
|
|
|
21827
22073
|
var PriceListCardTitle = function (_a) {
|
|
21828
22074
|
var priceList = _a.priceList, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, trialRemainingDays = _a.trialRemainingDays;
|
|
21829
22075
|
var isMobile = common.useIsMobile();
|
|
21830
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-4" }, { children: [Boolean(trialRemainingDays) && (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-secondary", style: { height:
|
|
21831
|
-
? "Trial ends in ".concat(trialRemainingDays, " day").concat(trialRemainingDays === 1 ?
|
|
21832
|
-
:
|
|
22076
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-4" }, { children: [Boolean(trialRemainingDays) && (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-secondary", style: { height: '1rem' } }, { children: isPriceListCurrentSubscription
|
|
22077
|
+
? "Trial ends in ".concat(trialRemainingDays, " day").concat(trialRemainingDays === 1 ? '' : 's')
|
|
22078
|
+
: ' ' }))), jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center ".concat(isMobile ? 'bunny-text-slate-500' : 'bunny-text-orange-600'), style: { fontSize: '20px' } }, { children: priceList.plan.name }))] })));
|
|
21833
22079
|
};
|
|
21834
22080
|
|
|
22081
|
+
var PriceListSelectorContext = react.createContext({});
|
|
22082
|
+
var showInfoNotification = common.useInfoNotification();
|
|
22083
|
+
function PriceListSelectorProvider(_a) {
|
|
22084
|
+
var children = _a.children;
|
|
22085
|
+
// Context
|
|
22086
|
+
var isInPreviewMode = react.useContext(SubscriptionsContext).isInPreviewMode;
|
|
22087
|
+
var _b = react.useContext(QuotePreviewContext), quotePreviewData = _b.quotePreviewData, setQuotePreviewData = _b.setQuotePreviewData;
|
|
22088
|
+
// Handlers
|
|
22089
|
+
var onChangePriceList = react.useCallback(function (selectedPriceList) {
|
|
22090
|
+
if (isInPreviewMode)
|
|
22091
|
+
return showInfoNotification('You are in preview mode');
|
|
22092
|
+
return setQuotePreviewData({
|
|
22093
|
+
priceList: selectedPriceList,
|
|
22094
|
+
quantity: calculateNewQuantity(selectedPriceList, quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity),
|
|
22095
|
+
});
|
|
22096
|
+
}, [isInPreviewMode, setQuotePreviewData, showInfoNotification]);
|
|
22097
|
+
// Reset quote preview data when parent (should be PlanPicker) is unmounted
|
|
22098
|
+
react.useEffect(function () {
|
|
22099
|
+
return function () {
|
|
22100
|
+
setQuotePreviewData({});
|
|
22101
|
+
};
|
|
22102
|
+
}, [setQuotePreviewData]);
|
|
22103
|
+
return (jsxRuntime.jsx(PriceListSelectorContext.Provider, __assign({ value: { onChangePriceList: onChangePriceList } }, { children: children })));
|
|
22104
|
+
}
|
|
22105
|
+
|
|
21835
22106
|
var PLAN_GRID_PADDING = 4;
|
|
21836
22107
|
var PlanPickerGridCell = function (_a) {
|
|
21837
22108
|
var children = _a.children, noBorder = _a.noBorder;
|
|
@@ -21842,18 +22113,23 @@ var PlanPickerGridCell = function (_a) {
|
|
|
21842
22113
|
};
|
|
21843
22114
|
|
|
21844
22115
|
var PriceListCardDesktop = function (_a) {
|
|
21845
|
-
var description = _a.description,
|
|
21846
|
-
|
|
21847
|
-
|
|
22116
|
+
var hideButton = _a.hideButton, description = _a.description, disableSelectCurrentPlan = _a.disableSelectCurrentPlan, feature = _a.feature, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, isSelected = _a.isSelected, priceList = _a.priceList, subscriptionPlan = _a.subscriptionPlan, trialRemainingDays = _a.trialRemainingDays, noBorder = _a.noBorder;
|
|
22117
|
+
var onChangePriceList = react.useContext(PriceListSelectorContext).onChangePriceList;
|
|
22118
|
+
function handleChangePriceList(priceList) {
|
|
22119
|
+
onChangePriceList(priceList);
|
|
22120
|
+
}
|
|
22121
|
+
return (jsxRuntime.jsx(PlanPickerGridCell, __assign({ noBorder: noBorder }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-justify-between bunny-w-full bunny-rounded-md bunny-gap-4 bunny-pt-6 bunny-px-4 ".concat(disableSelectCurrentPlan ? '' : 'cursor-pointer'), onClick: function () {
|
|
22122
|
+
if (!disableSelectCurrentPlan) {
|
|
21848
22123
|
if (priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US) {
|
|
21849
22124
|
window.open(priceList.plan.contactUsUrl, '_blank');
|
|
21850
22125
|
}
|
|
21851
|
-
else
|
|
21852
|
-
|
|
22126
|
+
else {
|
|
22127
|
+
handleChangePriceList(priceList);
|
|
22128
|
+
}
|
|
21853
22129
|
}
|
|
21854
22130
|
}, style: {
|
|
21855
22131
|
height: '100%',
|
|
21856
|
-
} }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-3" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsxRuntime.jsx(PriceListCardDescription, { description: description })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardPrice, { priceList: priceList }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] }))] })), jsxRuntime.jsx(PriceListCardButton, {
|
|
22132
|
+
} }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-3" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsxRuntime.jsx(PriceListCardDescription, { description: description })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardPrice, { priceList: priceList }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] }))] })), !hideButton && (jsxRuntime.jsx(PriceListCardButton, { disableSelectCurrentPlan: disableSelectCurrentPlan, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, subscriptionPlan: subscriptionPlan }))] })) })));
|
|
21857
22133
|
};
|
|
21858
22134
|
|
|
21859
22135
|
var CheckIcon = function (_a) {
|
|
@@ -21862,23 +22138,24 @@ var CheckIcon = function (_a) {
|
|
|
21862
22138
|
};
|
|
21863
22139
|
|
|
21864
22140
|
var PriceListCardMobile = function (_a) {
|
|
21865
|
-
var description = _a.description, disableOnClick = _a.disableOnClick, feature = _a.feature, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, isSelected = _a.isSelected,
|
|
22141
|
+
var description = _a.description, disableOnClick = _a.disableOnClick, feature = _a.feature, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, isSelected = _a.isSelected, priceList = _a.priceList, subscriptionPlan = _a.subscriptionPlan, trialRemainingDays = _a.trialRemainingDays;
|
|
21866
22142
|
var brandColor = react.useContext(BrandContext).brandColor;
|
|
22143
|
+
var onChangePriceList = react.useContext(PriceListSelectorContext).onChangePriceList;
|
|
21867
22144
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-relative bunny-flex bunny-flex-col bunny-border-2 bunny-border-solid bunny-rounded-lg bunny-p-4", onClick: function () {
|
|
21868
22145
|
if (!disableOnClick)
|
|
21869
|
-
|
|
22146
|
+
onChangePriceList(priceList);
|
|
21870
22147
|
}, style: {
|
|
21871
22148
|
minWidth: '220px',
|
|
21872
22149
|
borderColor: isSelected ? brandColor : common.SLATE_200,
|
|
21873
22150
|
} }, { children: [isSelected && (jsxRuntime.jsx("div", __assign({ className: "bunny-absolute", style: {
|
|
21874
22151
|
top: '10px',
|
|
21875
22152
|
right: '10px',
|
|
21876
|
-
} }, { children: jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "20px" }) }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-grow bunny-gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsxRuntime.jsx(PriceListCardDescription, { description: description })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardPrice, { priceList: priceList }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] })), jsxRuntime.jsx(PriceListCardButton, {
|
|
22153
|
+
} }, { children: jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "20px" }) }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-grow bunny-gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsxRuntime.jsx(PriceListCardDescription, { description: description })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardPrice, { priceList: priceList }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] })), jsxRuntime.jsx(PriceListCardButton, { disableSelectCurrentPlan: disableOnClick, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, subscriptionPlan: subscriptionPlan })] }))] })));
|
|
21877
22154
|
};
|
|
21878
22155
|
|
|
21879
22156
|
var PriceListCard = function (_a) {
|
|
21880
22157
|
var _b;
|
|
21881
|
-
var
|
|
22158
|
+
var hideButton = _a.hideButton, isSelected = _a.isSelected, priceList = _a.priceList, subscriptions = _a.subscriptions, trialRemainingDays = _a.trialRemainingDays, noBorder = _a.noBorder;
|
|
21882
22159
|
// Context
|
|
21883
22160
|
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
21884
22161
|
var isMobile = common.useIsMobile();
|
|
@@ -21888,12 +22165,9 @@ var PriceListCard = function (_a) {
|
|
|
21888
22165
|
var activeCharge = (_b = getActivePlanPriceData(priceList, priceList)) === null || _b === void 0 ? void 0 : _b.activeCharge;
|
|
21889
22166
|
// Is the price list the current price list for the upgradingSubscription
|
|
21890
22167
|
var isPriceListCurrentSubscription = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id) === priceList.id;
|
|
21891
|
-
var
|
|
21892
|
-
var disableOnClick = isPriceListDisabled({
|
|
22168
|
+
var disableSelectCurrentPlan = isPriceListDisabled({
|
|
21893
22169
|
priceList: priceList,
|
|
21894
|
-
subscriptions: subscriptions,
|
|
21895
22170
|
upgradingSubscription: upgradingSubscription,
|
|
21896
|
-
canPurchaseFeatureAddons: canPurchaseFeatureAddons,
|
|
21897
22171
|
});
|
|
21898
22172
|
var subscriptionPlan = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) {
|
|
21899
22173
|
var _a, _b;
|
|
@@ -21905,22 +22179,19 @@ var PriceListCard = function (_a) {
|
|
|
21905
22179
|
return null;
|
|
21906
22180
|
}
|
|
21907
22181
|
var feature = activeCharge.feature;
|
|
21908
|
-
return isMobile ? (jsxRuntime.jsx(PriceListCardMobile, { description: description, disableOnClick:
|
|
22182
|
+
return isMobile ? (jsxRuntime.jsx(PriceListCardMobile, { description: description, disableOnClick: disableSelectCurrentPlan, feature: feature, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, trialRemainingDays: trialRemainingDays, subscriptionPlan: subscriptionPlan })) : (jsxRuntime.jsx(PriceListCardDesktop, { hideButton: hideButton, description: description, disableSelectCurrentPlan: disableSelectCurrentPlan, feature: feature, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, trialRemainingDays: trialRemainingDays, subscriptionPlan: subscriptionPlan, noBorder: noBorder }));
|
|
21909
22183
|
};
|
|
21910
22184
|
|
|
21911
|
-
var QUOTE_CHARGE_CREATE
|
|
22185
|
+
var QUOTE_CHARGE_CREATE = "\n".concat(QUOTE_FIELDS(), "\nmutation QuoteChargeCreate ($quoteChangeId: ID!, $startDate: ISO8601Date!, $endDate: ISO8601Date, $priceListChargeId: ID, $subscriptionChargeId: ID, $price: Float, $quantity: Int) {\n quoteChargeCreate(\n endDate: $endDate\n price: $price\n priceListChargeId: $priceListChargeId\n quantity: $quantity\n quoteChangeId: $quoteChangeId\n startDate: $startDate\n subscriptionChargeId: $subscriptionChargeId\n ) {\n quoteCharge {\n quoteChange {\n id\n quoteId\n quote {\n ...QuoteFields\n }\n }\n id\n }\n }\n}\n\n");
|
|
21912
22186
|
var quoteChargeCreate = function (_a) {
|
|
21913
|
-
var
|
|
21914
|
-
// endDate,
|
|
21915
|
-
price = _a.price, priceListChargeId = _a.priceListChargeId, quantity = _a.quantity, quoteChangeId = _a.quoteChangeId, startDate = _a.startDate, subscriptionChargeId = _a.subscriptionChargeId, token = _a.token, apiHost = _a.apiHost;
|
|
22187
|
+
var price = _a.price, priceListChargeId = _a.priceListChargeId, quantity = _a.quantity, quoteChangeId = _a.quoteChangeId, startDate = _a.startDate, subscriptionChargeId = _a.subscriptionChargeId, token = _a.token, apiHost = _a.apiHost;
|
|
21916
22188
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
21917
22189
|
var response;
|
|
21918
22190
|
return __generator(this, function (_b) {
|
|
21919
22191
|
switch (_b.label) {
|
|
21920
22192
|
case 0: return [4 /*yield*/, gqlRequest({
|
|
21921
|
-
query: QUOTE_CHARGE_CREATE
|
|
22193
|
+
query: QUOTE_CHARGE_CREATE,
|
|
21922
22194
|
vars: {
|
|
21923
|
-
// endDate,
|
|
21924
22195
|
price: price,
|
|
21925
22196
|
priceListChargeId: priceListChargeId,
|
|
21926
22197
|
quantity: quantity,
|
|
@@ -21942,32 +22213,38 @@ var quoteChargeCreate = function (_a) {
|
|
|
21942
22213
|
});
|
|
21943
22214
|
};
|
|
21944
22215
|
|
|
21945
|
-
var
|
|
22216
|
+
var QUOTE_CHARGE_DELETE = "\n".concat(QUOTE_FIELDS(), "\nmutation QuoteChargeDelete ($quoteChargeId: ID!) {\n quoteChargeDelete(\n quoteChargeId: $quoteChargeId\n ) {\n errors\n quoteCharge {\n quoteChange {\n id\n quoteId\n quote {\n ...QuoteFields\n }\n }\n }\n }\n}\n\n");
|
|
21946
22217
|
var quoteChargeDelete = function (_a) {
|
|
21947
22218
|
var quoteChargeId = _a.quoteChargeId, token = _a.token, apiHost = _a.apiHost;
|
|
21948
|
-
return
|
|
21949
|
-
|
|
21950
|
-
|
|
21951
|
-
|
|
21952
|
-
|
|
21953
|
-
|
|
21954
|
-
|
|
22219
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
22220
|
+
var response;
|
|
22221
|
+
return __generator(this, function (_b) {
|
|
22222
|
+
switch (_b.label) {
|
|
22223
|
+
case 0: return [4 /*yield*/, gqlRequest({
|
|
22224
|
+
query: QUOTE_CHARGE_DELETE,
|
|
22225
|
+
vars: {
|
|
22226
|
+
quoteChargeId: quoteChargeId,
|
|
22227
|
+
},
|
|
22228
|
+
apiHost: apiHost,
|
|
22229
|
+
token: token,
|
|
22230
|
+
})];
|
|
22231
|
+
case 1:
|
|
22232
|
+
response = _b.sent();
|
|
22233
|
+
if (response.errors) {
|
|
22234
|
+
throw new Error(response.errors[0].message);
|
|
22235
|
+
}
|
|
22236
|
+
return [2 /*return*/, response.quoteChargeDelete.quoteCharge];
|
|
22237
|
+
}
|
|
22238
|
+
});
|
|
21955
22239
|
});
|
|
21956
22240
|
};
|
|
21957
22241
|
|
|
21958
|
-
var useQuoteUpdateFeatureAddon = function (
|
|
22242
|
+
var useQuoteUpdateFeatureAddon = function (quote, featureAddon) {
|
|
21959
22243
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
22244
|
+
var _a = react.useContext(PlanManagerQuoteContext), addFeatureAddonLoading = _a.addFeatureAddonLoading, removeFeatureAddonLoading = _a.removeFeatureAddonLoading;
|
|
21960
22245
|
var token = useToken();
|
|
21961
22246
|
var queryClient = reactQuery.useQueryClient();
|
|
21962
22247
|
var addedQuoteChargeId = react.useRef();
|
|
21963
|
-
var editingQuote = reactQuery.useQuery({
|
|
21964
|
-
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
21965
|
-
objectName: 'editingQuote',
|
|
21966
|
-
id: quoteId,
|
|
21967
|
-
}),
|
|
21968
|
-
queryFn: function () { return (quoteId ? getQuote({ id: quoteId, token: token, apiHost: apiHost }) : undefined); },
|
|
21969
|
-
enabled: Boolean(quoteId),
|
|
21970
|
-
}).data;
|
|
21971
22248
|
function handleAddFeatureAddon() {
|
|
21972
22249
|
quoteChargeCreateMutation();
|
|
21973
22250
|
}
|
|
@@ -21976,7 +22253,7 @@ var useQuoteUpdateFeatureAddon = function (quoteId, featureAddon) {
|
|
|
21976
22253
|
return;
|
|
21977
22254
|
quoteChargeDeleteMutation({ quoteChargeId: addedQuoteChargeId.current });
|
|
21978
22255
|
}
|
|
21979
|
-
var
|
|
22256
|
+
var _b = reactQuery.useMutation({
|
|
21980
22257
|
mutationFn: function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
21981
22258
|
var quoteCharge;
|
|
21982
22259
|
return __generator(this, function (_a) {
|
|
@@ -21984,12 +22261,13 @@ var useQuoteUpdateFeatureAddon = function (quoteId, featureAddon) {
|
|
|
21984
22261
|
case 0:
|
|
21985
22262
|
if (!token)
|
|
21986
22263
|
throw new Error('Token is required');
|
|
21987
|
-
if (!
|
|
22264
|
+
if (!quote)
|
|
21988
22265
|
throw new Error('Editing quote is required');
|
|
21989
22266
|
return [4 /*yield*/, quoteChargeCreate({
|
|
21990
|
-
|
|
22267
|
+
// TODO: get the correct quoteChangeId
|
|
22268
|
+
quoteChangeId: quote === null || quote === void 0 ? void 0 : quote.quoteChanges[quote.quoteChanges.length - 1].id,
|
|
21991
22269
|
priceListChargeId: featureAddon.id,
|
|
21992
|
-
startDate:
|
|
22270
|
+
startDate: quote === null || quote === void 0 ? void 0 : quote.startDate,
|
|
21993
22271
|
apiHost: apiHost,
|
|
21994
22272
|
token: token,
|
|
21995
22273
|
})];
|
|
@@ -22002,40 +22280,62 @@ var useQuoteUpdateFeatureAddon = function (quoteId, featureAddon) {
|
|
|
22002
22280
|
onSuccess: function (_a) {
|
|
22003
22281
|
var quoteCharge = _a.quoteCharge;
|
|
22004
22282
|
addedQuoteChargeId.current = quoteCharge.id;
|
|
22005
|
-
queryClient.
|
|
22006
|
-
|
|
22007
|
-
|
|
22008
|
-
|
|
22009
|
-
});
|
|
22283
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.createObjectKey({
|
|
22284
|
+
objectName: 'editingQuote',
|
|
22285
|
+
id: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
22286
|
+
token: token,
|
|
22287
|
+
}), quoteCharge.quoteChange.quote);
|
|
22010
22288
|
},
|
|
22011
|
-
}), quoteChargeCreateMutation =
|
|
22012
|
-
var
|
|
22289
|
+
}), quoteChargeCreateMutation = _b.mutate, isCreatingFeatureAddon = _b.isPending;
|
|
22290
|
+
var _c = reactQuery.useMutation({
|
|
22013
22291
|
mutationFn: function (_a) {
|
|
22014
22292
|
var quoteChargeId = _a.quoteChargeId;
|
|
22015
|
-
return
|
|
22293
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
22294
|
+
var response;
|
|
22295
|
+
return __generator(this, function (_b) {
|
|
22296
|
+
switch (_b.label) {
|
|
22297
|
+
case 0: return [4 /*yield*/, quoteChargeDelete({ quoteChargeId: quoteChargeId, token: token, apiHost: apiHost })];
|
|
22298
|
+
case 1:
|
|
22299
|
+
response = _b.sent();
|
|
22300
|
+
return [2 /*return*/, { quoteCharge: response }];
|
|
22301
|
+
}
|
|
22302
|
+
});
|
|
22303
|
+
});
|
|
22016
22304
|
},
|
|
22017
|
-
onSuccess: function () {
|
|
22305
|
+
onSuccess: function (_a) {
|
|
22306
|
+
var quoteCharge = _a.quoteCharge;
|
|
22018
22307
|
addedQuoteChargeId.current = undefined;
|
|
22019
|
-
queryClient.
|
|
22020
|
-
|
|
22021
|
-
|
|
22022
|
-
|
|
22023
|
-
});
|
|
22308
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.createObjectKey({
|
|
22309
|
+
objectName: 'editingQuote',
|
|
22310
|
+
id: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
22311
|
+
token: token,
|
|
22312
|
+
}), quoteCharge.quoteChange.quote);
|
|
22024
22313
|
},
|
|
22025
|
-
}), quoteChargeDeleteMutation =
|
|
22314
|
+
}), quoteChargeDeleteMutation = _c.mutate, isDeletingFeatureAddon = _c.isPending;
|
|
22315
|
+
var isPending = isCreatingFeatureAddon || isDeletingFeatureAddon;
|
|
22026
22316
|
react.useEffect(function () {
|
|
22027
22317
|
// If the quoteId changes, then its because we changed pricelists, so we need to reset the addedQuoteChargeId
|
|
22028
22318
|
// so that isChecked becomes false
|
|
22029
22319
|
addedQuoteChargeId.current = undefined;
|
|
22030
|
-
}, [
|
|
22320
|
+
}, [quote === null || quote === void 0 ? void 0 : quote.id]);
|
|
22321
|
+
react.useEffect(function () {
|
|
22322
|
+
if (isPending) {
|
|
22323
|
+
addFeatureAddonLoading(featureAddon.id);
|
|
22324
|
+
}
|
|
22325
|
+
else {
|
|
22326
|
+
removeFeatureAddonLoading(featureAddon.id);
|
|
22327
|
+
}
|
|
22328
|
+
return function () {
|
|
22329
|
+
removeFeatureAddonLoading(featureAddon.id);
|
|
22330
|
+
};
|
|
22331
|
+
}, [isPending]);
|
|
22031
22332
|
return {
|
|
22032
22333
|
handleAddFeatureAddon: handleAddFeatureAddon,
|
|
22033
22334
|
handleRemoveFeatureAddon: handleRemoveFeatureAddon,
|
|
22034
|
-
isPending:
|
|
22335
|
+
isPending: isPending,
|
|
22035
22336
|
isChecked: isDeletingFeatureAddon
|
|
22036
22337
|
? false
|
|
22037
22338
|
: Boolean(addedQuoteChargeId.current || isCreatingFeatureAddon),
|
|
22038
|
-
editingQuoteLoaded: editingQuote !== undefined,
|
|
22039
22339
|
};
|
|
22040
22340
|
};
|
|
22041
22341
|
|
|
@@ -22077,7 +22377,8 @@ function FeatureAddonRow(_a) {
|
|
|
22077
22377
|
var featureAddon = _a.featureAddon, priceList = _a.priceList;
|
|
22078
22378
|
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
22079
22379
|
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
22080
|
-
var
|
|
22380
|
+
var quote = react.useContext(PlanManagerQuoteContext).quote;
|
|
22381
|
+
var _d = useQuoteUpdateFeatureAddon(quote, featureAddon), handleAddFeatureAddon = _d.handleAddFeatureAddon, handleRemoveFeatureAddon = _d.handleRemoveFeatureAddon, isPending = _d.isPending, isChecked = _d.isChecked;
|
|
22081
22382
|
var brandColor = react.useContext(BrandContext).brandColor;
|
|
22082
22383
|
var isPriceListSelected = ((_b = quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList) === null || _b === void 0 ? void 0 : _b.id) === priceList.id;
|
|
22083
22384
|
var isPurchased = isAddonPurchased(featureAddon, upgradingSubscription);
|
|
@@ -22089,7 +22390,7 @@ function FeatureAddonRow(_a) {
|
|
|
22089
22390
|
periodMonths: priceList.periodMonths,
|
|
22090
22391
|
doesPlanHaveFlatFeeCharges: false,
|
|
22091
22392
|
}) }))] }));
|
|
22092
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-flex-wrap bunny-items-center bunny-justify-between bunny-gap-1" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center bunny-gap-1" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-1 bunny-text-gray-600", style: { fontSize: '13px' } }, { children: [checked ? (jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "15px" })) : (jsxRuntime.jsx(CheckIcon, { backgroundColor: common.SLATE_200, size: "15px" })), featureAddon.name] })), jsxRuntime.jsx(antd.Tooltip, __assign({ title: tooltipContent }, { children: jsxRuntime.jsx(icons.InfoCircleOutlined, { className: "bunny-text-gray-500", size: 15 }) }))] })), jsxRuntime.jsx(antd.Switch, { size: "small", loading: isPending, disabled: isDisabled || !
|
|
22393
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-flex-wrap bunny-items-center bunny-justify-between bunny-gap-1" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center bunny-gap-1" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-1 bunny-text-gray-600", style: { fontSize: '13px' } }, { children: [checked ? (jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "15px" })) : (jsxRuntime.jsx(CheckIcon, { backgroundColor: common.SLATE_200, size: "15px" })), featureAddon.name] })), jsxRuntime.jsx(antd.Tooltip, __assign({ title: tooltipContent }, { children: jsxRuntime.jsx(icons.InfoCircleOutlined, { className: "bunny-text-gray-500", size: 15 }) }))] })), jsxRuntime.jsx(antd.Switch, { size: "small", loading: isPending, disabled: isDisabled || !quote, checked: checked, onChange: function (checked) {
|
|
22093
22394
|
if (checked) {
|
|
22094
22395
|
handleAddFeatureAddon();
|
|
22095
22396
|
}
|
|
@@ -22119,23 +22420,169 @@ var filterUniqueFeatures = function (_a) {
|
|
|
22119
22420
|
return updatedPriceLists;
|
|
22120
22421
|
};
|
|
22121
22422
|
var EverythingPlanFeatures = function (_a) {
|
|
22122
|
-
var displayPriceLists = _a.displayPriceLists, selectedProduct = _a.selectedProduct, plansToDisplay = _a.plansToDisplay;
|
|
22423
|
+
var displayPriceLists = _a.displayPriceLists, selectedProduct = _a.selectedProduct, plansToDisplay = _a.plansToDisplay, _b = _a.hideBorder, hideBorder = _b === void 0 ? false : _b;
|
|
22123
22424
|
var brandColor = react.useContext(BrandContext).brandColor;
|
|
22124
22425
|
var uniquePlanFeatures = filterUniqueFeatures({ availablePriceLists: displayPriceLists });
|
|
22125
22426
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: __spreadArray([], Array(plansToDisplay), true).map(function (_, planIndex) {
|
|
22126
22427
|
var priceList = uniquePlanFeatures[planIndex];
|
|
22127
22428
|
var prevPriceList = displayPriceLists[planIndex - 1];
|
|
22128
22429
|
if (!priceList)
|
|
22129
|
-
return (jsxRuntime.jsx("div", { style: prevPriceList ? { borderLeft: "1px solid ".concat(common.SLATE_200) } : {} }, planIndex));
|
|
22430
|
+
return (jsxRuntime.jsx("div", { style: prevPriceList && !hideBorder ? { borderLeft: "1px solid ".concat(common.SLATE_200) } : {} }, planIndex));
|
|
22130
22431
|
if (!priceList.plan.planFeatures)
|
|
22131
22432
|
return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(FeatureAddonsList, { priceList: priceList }), ";"] }, planIndex));
|
|
22132
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4", style: { borderLeft: "1px solid ".concat(common.SLATE_200) } }, { children: [priceList.plan.planFeatures.map(function (planFeature, planFeatureIndex) {
|
|
22433
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4", style: !hideBorder ? { borderLeft: "1px solid ".concat(common.SLATE_200) } : {} }, { children: [priceList.plan.planFeatures.map(function (planFeature, planFeatureIndex) {
|
|
22133
22434
|
var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
|
|
22134
22435
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-contents" }, { children: [prevPriceList && everythingInPlus && planIndex > 0 && planFeatureIndex === 0 && (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium", style: { fontSize: '13px' } }, { children: everythingInPlusString({ priceList: prevPriceList }) }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-1 bunny-text-gray-600", style: { fontSize: '13px' } }, { children: [jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "15px" }), planFeature.feature.name] }))] }), planFeatureIndex));
|
|
22135
22436
|
}), jsxRuntime.jsx(FeatureAddonsList, { priceList: priceList })] }), planIndex));
|
|
22136
22437
|
}) }));
|
|
22137
22438
|
};
|
|
22138
22439
|
|
|
22440
|
+
var QUOTE_CHANGE_DELETE = "\n".concat(QUOTE_FIELDS(), "\n mutation QuoteChangeDelete($id: ID!) {\n quoteChangeDelete(id: $id) {\n errors\n quoteChange {\n quote {\n ...QuoteFields\n }\n }\n }\n }\n");
|
|
22441
|
+
var quoteChangeDelete = function (_a) {
|
|
22442
|
+
var id = _a.id, apiHost = _a.apiHost, token = _a.token;
|
|
22443
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
22444
|
+
var vars, response, errors;
|
|
22445
|
+
var _b;
|
|
22446
|
+
return __generator(this, function (_c) {
|
|
22447
|
+
switch (_c.label) {
|
|
22448
|
+
case 0:
|
|
22449
|
+
vars = {
|
|
22450
|
+
id: id,
|
|
22451
|
+
};
|
|
22452
|
+
return [4 /*yield*/, gqlRequest({
|
|
22453
|
+
query: QUOTE_CHANGE_DELETE,
|
|
22454
|
+
token: token,
|
|
22455
|
+
vars: vars,
|
|
22456
|
+
apiHost: apiHost,
|
|
22457
|
+
})];
|
|
22458
|
+
case 1:
|
|
22459
|
+
response = _c.sent();
|
|
22460
|
+
errors = (_b = response === null || response === void 0 ? void 0 : response.quoteChangeDelete) === null || _b === void 0 ? void 0 : _b.errors;
|
|
22461
|
+
if (errors)
|
|
22462
|
+
throw errors;
|
|
22463
|
+
return [2 /*return*/, response.quoteChangeDelete];
|
|
22464
|
+
}
|
|
22465
|
+
});
|
|
22466
|
+
});
|
|
22467
|
+
};
|
|
22468
|
+
|
|
22469
|
+
var QUOTE_CHANGE_CREATE = "\n".concat(QUOTE_FIELDS(), "\nmutation QuoteChangeCreate(\n $quoteId: ID!\n $priceListId: ID!\n $parentQuoteChangeId: ID!\n) {\n quoteChangeCreate(\n quoteId: $quoteId\n priceListId: $priceListId\n parentQuoteChangeId: $parentQuoteChangeId\n ) {\n errors\n quoteChange {\n id\n quote {\n ...QuoteFields\n }\n }\n }\n}\n");
|
|
22470
|
+
var quoteChangeCreate = function (_a) {
|
|
22471
|
+
var parentQuoteChangeId = _a.parentQuoteChangeId, priceListId = _a.priceListId, apiHost = _a.apiHost, token = _a.token, quoteId = _a.quoteId;
|
|
22472
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
22473
|
+
var vars, response, errors;
|
|
22474
|
+
var _b;
|
|
22475
|
+
return __generator(this, function (_c) {
|
|
22476
|
+
switch (_c.label) {
|
|
22477
|
+
case 0:
|
|
22478
|
+
vars = {
|
|
22479
|
+
parentQuoteChangeId: parentQuoteChangeId,
|
|
22480
|
+
priceListId: priceListId,
|
|
22481
|
+
quoteId: quoteId,
|
|
22482
|
+
};
|
|
22483
|
+
return [4 /*yield*/, gqlRequest({
|
|
22484
|
+
query: QUOTE_CHANGE_CREATE,
|
|
22485
|
+
token: token,
|
|
22486
|
+
vars: vars,
|
|
22487
|
+
apiHost: apiHost,
|
|
22488
|
+
})];
|
|
22489
|
+
case 1:
|
|
22490
|
+
response = _c.sent();
|
|
22491
|
+
errors = (_b = response === null || response === void 0 ? void 0 : response.quoteChangeCreate) === null || _b === void 0 ? void 0 : _b.errors;
|
|
22492
|
+
if (errors)
|
|
22493
|
+
throw errors;
|
|
22494
|
+
return [2 /*return*/, response.quoteChangeCreate];
|
|
22495
|
+
}
|
|
22496
|
+
});
|
|
22497
|
+
});
|
|
22498
|
+
};
|
|
22499
|
+
|
|
22500
|
+
var useToggleAddonPlan = function (quote, plan, billingPeriod, selectedPriceList, setIsAddonPlanLoading) {
|
|
22501
|
+
var token = useToken();
|
|
22502
|
+
var isAdded = react.useRef(false);
|
|
22503
|
+
var queryClient = reactQuery.useQueryClient();
|
|
22504
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
22505
|
+
var parentQuoteChange = react.useMemo(function () {
|
|
22506
|
+
return quote === null || quote === void 0 ? void 0 : quote.quoteChanges.find(function (qc) { return qc.priceList.id === selectedPriceList.id; });
|
|
22507
|
+
}, [quote, selectedPriceList]);
|
|
22508
|
+
var _a = reactQuery.useMutation({
|
|
22509
|
+
mutationFn: quoteChangeCreate,
|
|
22510
|
+
onSuccess: function (quoteChangeCreate) {
|
|
22511
|
+
isAdded.current = true;
|
|
22512
|
+
var updatedQuote = quoteChangeCreate.quoteChange.quote;
|
|
22513
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.createObjectKey({
|
|
22514
|
+
objectName: 'editingQuote',
|
|
22515
|
+
id: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
22516
|
+
token: token,
|
|
22517
|
+
}), updatedQuote);
|
|
22518
|
+
},
|
|
22519
|
+
}), addAddonQuoteChange = _a.mutate, isAddingAddonQuoteChange = _a.isPending;
|
|
22520
|
+
var _b = reactQuery.useMutation({
|
|
22521
|
+
mutationFn: quoteChangeDelete,
|
|
22522
|
+
onSuccess: function (quoteChangeDelete) {
|
|
22523
|
+
isAdded.current = false;
|
|
22524
|
+
var updatedQuote = quoteChangeDelete.quoteChange.quote;
|
|
22525
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.createObjectKey({
|
|
22526
|
+
objectName: 'editingQuote',
|
|
22527
|
+
id: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
22528
|
+
token: token,
|
|
22529
|
+
}), updatedQuote);
|
|
22530
|
+
},
|
|
22531
|
+
}), deleteQuoteChange = _b.mutate, isDeletingQuoteChange = _b.isPending;
|
|
22532
|
+
function handleAddAddonQuoteChange() {
|
|
22533
|
+
if (!parentQuoteChange) {
|
|
22534
|
+
throw new Error('Parent quote change not found');
|
|
22535
|
+
}
|
|
22536
|
+
var priceList = plan.priceLists.find(function (pl) { return pl.periodMonths === billingPeriod; });
|
|
22537
|
+
if (!priceList) {
|
|
22538
|
+
throw new Error('Price list not found');
|
|
22539
|
+
}
|
|
22540
|
+
if (!(quote === null || quote === void 0 ? void 0 : quote.id)) {
|
|
22541
|
+
throw new Error('Quote ID not found');
|
|
22542
|
+
}
|
|
22543
|
+
addAddonQuoteChange({
|
|
22544
|
+
parentQuoteChangeId: parentQuoteChange.id,
|
|
22545
|
+
priceListId: priceList.id,
|
|
22546
|
+
apiHost: apiHost,
|
|
22547
|
+
token: token,
|
|
22548
|
+
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
22549
|
+
});
|
|
22550
|
+
}
|
|
22551
|
+
function handleDeleteQuoteChange() {
|
|
22552
|
+
var priceList = plan.priceLists.find(function (pl) { return pl.periodMonths === billingPeriod; });
|
|
22553
|
+
if (!priceList) {
|
|
22554
|
+
throw new Error('Price list not found');
|
|
22555
|
+
}
|
|
22556
|
+
var quoteChange = quote === null || quote === void 0 ? void 0 : quote.quoteChanges.find(function (qc) { return qc.priceList.id === priceList.id; });
|
|
22557
|
+
if (!quoteChange) {
|
|
22558
|
+
throw new Error('Quote change not found');
|
|
22559
|
+
}
|
|
22560
|
+
deleteQuoteChange({
|
|
22561
|
+
id: quoteChange.id,
|
|
22562
|
+
apiHost: apiHost,
|
|
22563
|
+
token: token,
|
|
22564
|
+
});
|
|
22565
|
+
}
|
|
22566
|
+
react.useEffect(function () {
|
|
22567
|
+
if (isAddingAddonQuoteChange || isDeletingQuoteChange) {
|
|
22568
|
+
setIsAddonPlanLoading(true);
|
|
22569
|
+
}
|
|
22570
|
+
else {
|
|
22571
|
+
setIsAddonPlanLoading(false);
|
|
22572
|
+
}
|
|
22573
|
+
}, [isAddingAddonQuoteChange, isDeletingQuoteChange]);
|
|
22574
|
+
react.useEffect(function () {
|
|
22575
|
+
isAdded.current = false;
|
|
22576
|
+
setIsAddonPlanLoading(false);
|
|
22577
|
+
}, [selectedPriceList]);
|
|
22578
|
+
return {
|
|
22579
|
+
isPending: isAddingAddonQuoteChange || isDeletingQuoteChange || parentQuoteChange === undefined,
|
|
22580
|
+
addedQuoteChange: isAdded.current,
|
|
22581
|
+
deleteQuoteChange: handleDeleteQuoteChange,
|
|
22582
|
+
addAddonQuoteChange: handleAddAddonQuoteChange,
|
|
22583
|
+
};
|
|
22584
|
+
};
|
|
22585
|
+
|
|
22139
22586
|
var Text$a = antd.Typography.Text;
|
|
22140
22587
|
var PlanFeatures = function (_a) {
|
|
22141
22588
|
var _b;
|
|
@@ -22186,32 +22633,85 @@ var FeatureTitle = function (_a) {
|
|
|
22186
22633
|
return (jsxRuntime.jsx(Text$a, __assign({ className: " ".concat(isFeatureGroup ? 'bunny-text-slate-500 bunny-font-medium bunny-pt-4' : ''), style: __assign({}, (isFeatureGroup ? { fontSize: '11px' } : {})) }, { children: isFeatureGroup ? (_b = feature === null || feature === void 0 ? void 0 : feature.name) === null || _b === void 0 ? void 0 : _b.toUpperCase() : feature === null || feature === void 0 ? void 0 : feature.name })));
|
|
22187
22634
|
};
|
|
22188
22635
|
|
|
22636
|
+
var PlanAddonsCard = function (_a) {
|
|
22637
|
+
var selectedPriceList = _a.selectedPriceList, subscriptions = _a.subscriptions, addonPlans = _a.addonPlans, selectedProduct = _a.selectedProduct, priceListChangeOptions = _a.priceListChangeOptions, selectedBillingPeriod = _a.selectedBillingPeriod;
|
|
22638
|
+
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
22639
|
+
var _b = react.useState(), selectedAddonPriceList = _b[0], setSelectedAddonPriceList = _b[1];
|
|
22640
|
+
function isAddonPlanPurchased(plan) {
|
|
22641
|
+
var isChangingPlans = selectedPriceList.plan.id !== (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.plan.id);
|
|
22642
|
+
if (isChangingPlans) {
|
|
22643
|
+
return false;
|
|
22644
|
+
}
|
|
22645
|
+
var currentSubscription = subscriptions.find(function (subscription) { return subscription.id === (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id); });
|
|
22646
|
+
var addonSubscriptionIds = currentSubscription === null || currentSubscription === void 0 ? void 0 : currentSubscription.addonSubscriptions;
|
|
22647
|
+
var addonSubscriptions = addonSubscriptionIds === null || addonSubscriptionIds === void 0 ? void 0 : addonSubscriptionIds.map(function (addonSubscription) {
|
|
22648
|
+
return subscriptions.find(function (subscription) { return subscription.id === addonSubscription.id; });
|
|
22649
|
+
});
|
|
22650
|
+
// filter out cancelled addons
|
|
22651
|
+
var activeAddonSubscriptions = addonSubscriptions === null || addonSubscriptions === void 0 ? void 0 : addonSubscriptions.filter(function (addonSubscription) { return (addonSubscription === null || addonSubscription === void 0 ? void 0 : addonSubscription.state) !== common.SubscriptionState.CANCELED; });
|
|
22652
|
+
return activeAddonSubscriptions === null || activeAddonSubscriptions === void 0 ? void 0 : activeAddonSubscriptions.some(function (addonSubscription) { return (addonSubscription === null || addonSubscription === void 0 ? void 0 : addonSubscription.plan.id) === plan.id; });
|
|
22653
|
+
}
|
|
22654
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-overflow-hidden" }, { children: [jsxRuntime.jsx(AddonPlanModal, { onClose: function () { return setSelectedAddonPriceList(undefined); }, selectedProduct: selectedProduct, priceList: selectedAddonPriceList }), addonPlans.length > 0 && (jsxRuntime.jsx("div", __assign({ className: "bunny-text-black bunny-pt-2 bunny-pb-4 bunny-font-bold" }, { children: "Add-on plans" }))), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: addonPlans.map(function (plan) {
|
|
22655
|
+
var isPurchased = isAddonPlanPurchased(plan);
|
|
22656
|
+
if (selectedBillingPeriod === undefined) {
|
|
22657
|
+
return null;
|
|
22658
|
+
}
|
|
22659
|
+
return (jsxRuntime.jsx(PlanAddonsCardRow, { plan: plan, selectedPriceList: selectedPriceList, setSelectedAddonPriceList: setSelectedAddonPriceList, isPurchased: isPurchased || false, selectedBillingPeriod: selectedBillingPeriod, priceListChangeOptions: priceListChangeOptions }));
|
|
22660
|
+
}) }))] })));
|
|
22661
|
+
};
|
|
22662
|
+
function PlanAddonsCardRow(_a) {
|
|
22663
|
+
var _b, _c;
|
|
22664
|
+
var plan = _a.plan, selectedPriceList = _a.selectedPriceList, setSelectedAddonPriceList = _a.setSelectedAddonPriceList, isPurchased = _a.isPurchased, selectedBillingPeriod = _a.selectedBillingPeriod, priceListChangeOptions = _a.priceListChangeOptions;
|
|
22665
|
+
var _d = react.useContext(PlanManagerQuoteContext), quote = _d.quote, setIsAddonPlanLoading = _d.setIsAddonPlanLoading;
|
|
22666
|
+
var _e = useToggleAddonPlan(quote, plan, billingPeriodConverter(selectedBillingPeriod), selectedPriceList, setIsAddonPlanLoading), isPending = _e.isPending, addedQuoteChange = _e.addedQuoteChange, addAddonQuoteChange = _e.addAddonQuoteChange, deleteQuoteChange = _e.deleteQuoteChange;
|
|
22667
|
+
var addonPriceListId = (_b = plan.priceLists.find(function (priceList) { return priceList.periodMonths === billingPeriodConverter(selectedBillingPeriod); })) === null || _b === void 0 ? void 0 : _b.id;
|
|
22668
|
+
var addonPriceList = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists.find(function (priceList) { return priceList.id === addonPriceListId; });
|
|
22669
|
+
var activeCharge = (_c = getActivePlanPriceData(addonPriceList, addonPriceList)) === null || _c === void 0 ? void 0 : _c.activeCharge;
|
|
22670
|
+
if (!addonPriceList) {
|
|
22671
|
+
return null;
|
|
22672
|
+
}
|
|
22673
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-justify-between bunny-items-center bunny-w-full bunny-p-4 bunny-rounded-md bunny-border bunny-bg-white bunny-shadow bunny-mb-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center" }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center bunny-text-orange-600", style: { fontSize: '16px' } }, { children: plan.name })), jsxRuntime.jsx(PriceListCardDescription, { description: plan.description }), jsxRuntime.jsx(PriceListCardPrice, { priceList: addonPriceList, fontSize: "16px" }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.feature, priceList: addonPriceList }), jsxRuntime.jsx(antd.Button, __assign({ type: "link", onClick: function () { return setSelectedAddonPriceList(addonPriceList); } }, { children: jsxRuntime.jsx(icons.InfoCircleOutlined, {}) }))] })), jsxRuntime.jsx(antd.Switch, { loading: isPending, checked: addedQuoteChange || isPurchased, onChange: function (checked) {
|
|
22674
|
+
if (checked) {
|
|
22675
|
+
addAddonQuoteChange();
|
|
22676
|
+
}
|
|
22677
|
+
else {
|
|
22678
|
+
deleteQuoteChange();
|
|
22679
|
+
}
|
|
22680
|
+
}, disabled: isPurchased })] }), plan.id));
|
|
22681
|
+
}
|
|
22682
|
+
function AddonPlanModal(_a) {
|
|
22683
|
+
var onClose = _a.onClose, selectedProduct = _a.selectedProduct, priceList = _a.priceList;
|
|
22684
|
+
var displayPriceLists = priceList ? [priceList] : [];
|
|
22685
|
+
var plansToDisplay = 1;
|
|
22686
|
+
return (jsxRuntime.jsx(antd.Modal, __assign({ open: !!priceList, onCancel: onClose, footer: null }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-w-full", style: {
|
|
22687
|
+
gridTemplateColumns: "minmax(auto, 200px) repeat(".concat(plansToDisplay, ", minmax(200px, 1fr))"),
|
|
22688
|
+
} }, { children: [jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), priceList && (jsxRuntime.jsx(PriceListCard, { isSelected: true, priceList: priceList, noBorder: true, hideButton: true })), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsxRuntime.jsx(EverythingPlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: 1, selectedProduct: selectedProduct, hideBorder: true })) : (jsxRuntime.jsx(PlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: 1, selectedProduct: selectedProduct }))] })) })));
|
|
22689
|
+
}
|
|
22690
|
+
|
|
22189
22691
|
var PriceListGridDesktop = function (_a) {
|
|
22190
|
-
var availablePriceLists = _a.availablePriceLists,
|
|
22191
|
-
var
|
|
22692
|
+
var availablePriceLists = _a.availablePriceLists, priceListChangeOptions = _a.priceListChangeOptions, priceListStart = _a.priceListStart, selectedPriceList = _a.selectedPriceList, selectedProduct = _a.selectedProduct, setPriceListStart = _a.setPriceListStart, subscriptions = _a.subscriptions, trialRemainingDays = _a.trialRemainingDays, selectedBillingPeriod = _a.selectedBillingPeriod;
|
|
22693
|
+
var addonPlans = selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.addonPlans;
|
|
22694
|
+
var displayPriceLists = react.useMemo(function () {
|
|
22192
22695
|
return getAvailablePlansAndPriceLists({
|
|
22193
22696
|
availablePriceLists: availablePriceLists,
|
|
22194
22697
|
priceListChangeOptions: priceListChangeOptions,
|
|
22195
22698
|
priceListStart: priceListStart,
|
|
22196
22699
|
plansToDisplay: (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.plansToDisplay) || 3,
|
|
22197
22700
|
});
|
|
22198
|
-
}, [availablePriceLists, priceListChangeOptions, priceListStart])
|
|
22701
|
+
}, [availablePriceLists, priceListChangeOptions, priceListStart]).displayPriceLists;
|
|
22199
22702
|
var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
|
|
22200
22703
|
var plansToDisplay = Math.min((selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.plansToDisplay) || 3, availablePriceLists.length);
|
|
22201
|
-
|
|
22202
|
-
|
|
22203
|
-
|
|
22204
|
-
|
|
22205
|
-
|
|
22206
|
-
|
|
22207
|
-
|
|
22208
|
-
|
|
22209
|
-
|
|
22210
|
-
|
|
22211
|
-
|
|
22212
|
-
return jsxRuntime.jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index);
|
|
22213
|
-
return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.plan.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan.id), onClick: onChangePriceList, priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
|
|
22214
|
-
}), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsxRuntime.jsx(EverythingPlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, selectedProduct: selectedProduct })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(PlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, selectedProduct: selectedProduct }), hasFeatureAddons && (jsxRuntime.jsx(PlanFeatureAddons, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay }))] }))] }))] })));
|
|
22704
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-relative bunny-flex bunny-flex-col bunny-rounded-md bunny-shadow bunny-overflow-hidden bunny-bg-white" }, { children: [jsxRuntime.jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, numberOfPlansToDisplay: plansToDisplay, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-w-full", style: {
|
|
22705
|
+
gridTemplateColumns: everythingInPlus
|
|
22706
|
+
? "repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))")
|
|
22707
|
+
: "minmax(auto, 400px) repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))"),
|
|
22708
|
+
} }, { children: [!everythingInPlus && jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(plansToDisplay), true).map(function (_, index) {
|
|
22709
|
+
var priceList = displayPriceLists[index];
|
|
22710
|
+
var doesPrevPriceListExist = displayPriceLists[index - 1];
|
|
22711
|
+
if (!priceList)
|
|
22712
|
+
return jsxRuntime.jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index);
|
|
22713
|
+
return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id), priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
|
|
22714
|
+
}), (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus) ? (jsxRuntime.jsx(EverythingPlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, selectedProduct: selectedProduct })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(PlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, selectedProduct: selectedProduct }), jsxRuntime.jsx(PlanFeatureAddons, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay })] }))] }))] })), selectedPriceList && addonPlans ? (jsxRuntime.jsx(PlanAddonsCard, { selectedPriceList: selectedPriceList, subscriptions: subscriptions, addonPlans: addonPlans, selectedProduct: selectedProduct, priceListChangeOptions: priceListChangeOptions, selectedBillingPeriod: selectedBillingPeriod })) : null] })));
|
|
22215
22715
|
};
|
|
22216
22716
|
|
|
22217
22717
|
var Text$9 = antd.Typography.Text;
|
|
@@ -22225,42 +22725,43 @@ var PriceListCardFeature = function (_a) {
|
|
|
22225
22725
|
|
|
22226
22726
|
var PriceListGridMobile = function (_a) {
|
|
22227
22727
|
var _b, _c, _d, _e;
|
|
22228
|
-
var availablePriceLists = _a.availablePriceLists,
|
|
22728
|
+
var availablePriceLists = _a.availablePriceLists, priceListChangeOptions = _a.priceListChangeOptions, selectedPriceList = _a.selectedPriceList, selectedProduct = _a.selectedProduct, subscriptions = _a.subscriptions, trialRemainingDays = _a.trialRemainingDays;
|
|
22229
22729
|
var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
|
|
22230
22730
|
var prevPriceListIndex = availablePriceLists.findIndex(function (priceList) { return priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id); });
|
|
22231
22731
|
var prevPriceListId = (_b = availablePriceLists[prevPriceListIndex - 1]) === null || _b === void 0 ? void 0 : _b.id;
|
|
22232
22732
|
var prevPriceList = (_c = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _c === void 0 ? void 0 : _c.find(function (priceList) { return priceList.id === prevPriceListId; });
|
|
22233
22733
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-gap-4 bunny-overflow-auto bunny-shadow-padding-xb", style: { flexShrink: 0 } }, { children: availablePriceLists.map(function (priceList, index) {
|
|
22234
|
-
return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id),
|
|
22734
|
+
return (jsxRuntime.jsx(PriceListCard, { isSelected: priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id), priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
|
|
22235
22735
|
}) })), jsxRuntime.jsx("div", __assign({ className: "bunny-text-slate-500 bunny-pt-5 bunny-pb-4 bunny-shadow-padding-x" }, { children: everythingInPlus && prevPriceList
|
|
22236
22736
|
? everythingInPlusString({ priceList: prevPriceList })
|
|
22237
|
-
:
|
|
22737
|
+
: 'Features' })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-overflow-auto bunny-shadow-padding-x" }, { children: (_e = (_d = selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.plan) === null || _d === void 0 ? void 0 : _d.planFeatures) === null || _e === void 0 ? void 0 : _e.map(function (planFeature, index) { return (jsxRuntime.jsx(PriceListCardFeature, { planFeature: planFeature, index: index }, index)); }) }))] }));
|
|
22238
22738
|
};
|
|
22239
22739
|
|
|
22240
22740
|
var PriceListGrid = function (_a) {
|
|
22241
22741
|
var _b, _c;
|
|
22242
|
-
var availablePriceLists = _a.availablePriceLists,
|
|
22742
|
+
var availablePriceLists = _a.availablePriceLists, priceListChangeOptions = _a.priceListChangeOptions, priceListStart = _a.priceListStart, selectedPriceList = _a.selectedPriceList, selectedProduct = _a.selectedProduct, setPriceListStart = _a.setPriceListStart, subscriptions = _a.subscriptions, upgradingSubscriptionState = _a.upgradingSubscriptionState, selectedBillingPeriod = _a.selectedBillingPeriod;
|
|
22243
22743
|
// Hooks
|
|
22244
22744
|
var isMobile = common.useIsMobile();
|
|
22245
22745
|
// Derived state
|
|
22246
22746
|
var currentPriceList = (_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _b === void 0 ? void 0 : _b.find(function (priceList) { var _a; return priceList.id === ((_a = upgradingSubscriptionState === null || upgradingSubscriptionState === void 0 ? void 0 : upgradingSubscriptionState.plan) === null || _a === void 0 ? void 0 : _a.id); });
|
|
22247
22747
|
var trialRemainingDays = dayjs((_c = currentPriceList === null || currentPriceList === void 0 ? void 0 : currentPriceList.plan) === null || _c === void 0 ? void 0 : _c.trialEndDate).diff(dayjs(), 'days');
|
|
22248
|
-
return isMobile ? (jsxRuntime.jsx(PriceListGridMobile, { availablePriceLists: availablePriceLists,
|
|
22748
|
+
return isMobile ? (jsxRuntime.jsx(PriceListGridMobile, { availablePriceLists: availablePriceLists, priceListChangeOptions: priceListChangeOptions, selectedPriceList: selectedPriceList, selectedProduct: selectedProduct, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays })) : (jsxRuntime.jsx(PriceListGridDesktop, { availablePriceLists: availablePriceLists, priceListChangeOptions: priceListChangeOptions, priceListStart: priceListStart, selectedPriceList: selectedPriceList, selectedProduct: selectedProduct, setPriceListStart: setPriceListStart, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays, selectedBillingPeriod: selectedBillingPeriod }));
|
|
22249
22749
|
};
|
|
22250
22750
|
|
|
22251
22751
|
var createAvailableBillingPeriods = function (priceLists, selectedProduct) {
|
|
22252
22752
|
return priceLists === null || priceLists === void 0 ? void 0 : priceLists.filter(function (priceList) { return priceList.product.id === (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id); }).map(function (priceList) { return priceList.periodMonths; }).sort(function (a, b) { return a - b; }).filter(function (currentValue, index, array) { return index === array.indexOf(currentValue); });
|
|
22253
22753
|
};
|
|
22254
22754
|
var PriceListSelector = function (_a) {
|
|
22255
|
-
var
|
|
22755
|
+
var _b;
|
|
22756
|
+
var arePlanChangeOptionsLoading = _a.arePlanChangeOptionsLoading, areSubscriptionsLoading = _a.areSubscriptionsLoading, priceListChangeOptions = _a.priceListChangeOptions, selectedPriceList = _a.selectedPriceList, subscriptions = _a.subscriptions;
|
|
22256
22757
|
// Context
|
|
22257
22758
|
var isInPreviewMode = react.useContext(SubscriptionsContext).isInPreviewMode;
|
|
22258
|
-
var
|
|
22759
|
+
var _c = react.useContext(QuotePreviewContext), quotePreviewData = _c.quotePreviewData, setQuotePreviewData = _c.setQuotePreviewData;
|
|
22259
22760
|
var upgradingSubscription = react.useContext(SubscriptionsContext).upgradingSubscription;
|
|
22260
22761
|
// Local state
|
|
22261
|
-
var
|
|
22262
|
-
var
|
|
22263
|
-
var
|
|
22762
|
+
var _d = react.useState(), selectedProduct = _d[0], setSelectedProduct = _d[1];
|
|
22763
|
+
var _e = react.useState(), selectedBillingPeriod = _e[0], setSelectedBillingPeriod = _e[1];
|
|
22764
|
+
var _f = react.useState(0), priceListStart = _f[0], setPriceListStart = _f[1];
|
|
22264
22765
|
// Derived state
|
|
22265
22766
|
var availableBillingPeriods = react.useMemo(function () { return createAvailableBillingPeriods(priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists, selectedProduct); }, [priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists, selectedProduct]);
|
|
22266
22767
|
var availablePriceLists = react.useMemo(function () {
|
|
@@ -22268,7 +22769,7 @@ var PriceListSelector = function (_a) {
|
|
|
22268
22769
|
return (((_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _a === void 0 ? void 0 : _a.filter(function (priceList) {
|
|
22269
22770
|
return periodMonthsConverter(priceList.periodMonths) === selectedBillingPeriod &&
|
|
22270
22771
|
priceList.product.id === (selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id);
|
|
22271
|
-
})) || []);
|
|
22772
|
+
}).filter(function (priceList) { return priceList.plan.addon !== true; })) || []);
|
|
22272
22773
|
}, [priceListChangeOptions, selectedBillingPeriod, selectedProduct]);
|
|
22273
22774
|
// Handlers
|
|
22274
22775
|
var onChangeBillingPeriod = react.useCallback(function (billingPeriod) {
|
|
@@ -22284,9 +22785,7 @@ var PriceListSelector = function (_a) {
|
|
|
22284
22785
|
priceList.plan.id === ((_a = quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList) === null || _a === void 0 ? void 0 : _a.plan.id) &&
|
|
22285
22786
|
!isPriceListDisabled({
|
|
22286
22787
|
priceList: priceList,
|
|
22287
|
-
subscriptions: subscriptions,
|
|
22288
22788
|
upgradingSubscription: upgradingSubscription,
|
|
22289
|
-
canPurchaseFeatureAddons: priceListHasUnpurchasedFeatureAddons(quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, upgradingSubscription),
|
|
22290
22789
|
});
|
|
22291
22790
|
});
|
|
22292
22791
|
var isPriceListCurrentSubscription = newSelectedPriceList && (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList.id) === newSelectedPriceList.id;
|
|
@@ -22298,17 +22797,12 @@ var PriceListSelector = function (_a) {
|
|
|
22298
22797
|
}
|
|
22299
22798
|
else if (isPriceListCurrentSubscription) {
|
|
22300
22799
|
setQuotePreviewData({
|
|
22800
|
+
priceList: newSelectedPriceList,
|
|
22301
22801
|
quantity: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity,
|
|
22302
22802
|
});
|
|
22303
22803
|
}
|
|
22304
22804
|
}
|
|
22305
|
-
}, [
|
|
22306
|
-
quotePreviewData,
|
|
22307
|
-
priceListChangeOptions,
|
|
22308
|
-
subscriptions,
|
|
22309
|
-
upgradingSubscription,
|
|
22310
|
-
setQuotePreviewData,
|
|
22311
|
-
]);
|
|
22805
|
+
}, [quotePreviewData, priceListChangeOptions, upgradingSubscription, setQuotePreviewData]);
|
|
22312
22806
|
var onChangeProduct = react.useCallback(function (product) {
|
|
22313
22807
|
var newAvailableBillingPeriods = createAvailableBillingPeriods(priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists, product);
|
|
22314
22808
|
if (!(newAvailableBillingPeriods === null || newAvailableBillingPeriods === void 0 ? void 0 : newAvailableBillingPeriods.includes(billingPeriodConverter(selectedBillingPeriod)))) {
|
|
@@ -22317,8 +22811,19 @@ var PriceListSelector = function (_a) {
|
|
|
22317
22811
|
setSelectedProduct(product);
|
|
22318
22812
|
}, [priceListChangeOptions, selectedBillingPeriod, onChangeBillingPeriod]);
|
|
22319
22813
|
// Default settings
|
|
22814
|
+
var initialProduct = (_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.products) === null || _b === void 0 ? void 0 : _b[0];
|
|
22815
|
+
var initialBillingPeriod = react.useMemo(function () {
|
|
22816
|
+
var initialAvailableBillingPeriods = createAvailableBillingPeriods(priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists, initialProduct);
|
|
22817
|
+
if ((upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList) &&
|
|
22818
|
+
(initialAvailableBillingPeriods === null || initialAvailableBillingPeriods === void 0 ? void 0 : initialAvailableBillingPeriods.includes(billingPeriodConverter(periodMonthsConverter(upgradingSubscription.priceList.periodMonths))))) {
|
|
22819
|
+
return periodMonthsConverter(upgradingSubscription.priceList.periodMonths);
|
|
22820
|
+
}
|
|
22821
|
+
else {
|
|
22822
|
+
return periodMonthsConverter((initialAvailableBillingPeriods === null || initialAvailableBillingPeriods === void 0 ? void 0 : initialAvailableBillingPeriods[0]) || 1);
|
|
22823
|
+
}
|
|
22824
|
+
}, [upgradingSubscription]);
|
|
22825
|
+
// Set initial billing period and initial product
|
|
22320
22826
|
react.useEffect(function () {
|
|
22321
|
-
var _a, _b, _c, _d;
|
|
22322
22827
|
if (arePlanChangeOptionsLoading ||
|
|
22323
22828
|
areSubscriptionsLoading ||
|
|
22324
22829
|
!priceListChangeOptions ||
|
|
@@ -22326,55 +22831,46 @@ var PriceListSelector = function (_a) {
|
|
|
22326
22831
|
selectedProduct ||
|
|
22327
22832
|
selectedPriceList)
|
|
22328
22833
|
return;
|
|
22329
|
-
var initialProduct = (_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.products) === null || _a === void 0 ? void 0 : _a[0];
|
|
22330
|
-
var initialAvailableBillingPeriods = createAvailableBillingPeriods(priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists, initialProduct);
|
|
22331
|
-
var initialBillingPeriod;
|
|
22332
|
-
if ((upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList) &&
|
|
22333
|
-
(initialAvailableBillingPeriods === null || initialAvailableBillingPeriods === void 0 ? void 0 : initialAvailableBillingPeriods.includes(billingPeriodConverter(periodMonthsConverter(upgradingSubscription.priceList.periodMonths))))) {
|
|
22334
|
-
initialBillingPeriod = periodMonthsConverter(upgradingSubscription.priceList.periodMonths);
|
|
22335
|
-
}
|
|
22336
|
-
else {
|
|
22337
|
-
initialBillingPeriod = periodMonthsConverter((initialAvailableBillingPeriods === null || initialAvailableBillingPeriods === void 0 ? void 0 : initialAvailableBillingPeriods[0]) || 1);
|
|
22338
|
-
}
|
|
22339
|
-
var initialAvailablePriceLists = ((_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _b === void 0 ? void 0 : _b.filter(function (priceList) {
|
|
22340
|
-
return periodMonthsConverter(priceList.periodMonths) === initialBillingPeriod &&
|
|
22341
|
-
priceList.product.id === (initialProduct === null || initialProduct === void 0 ? void 0 : initialProduct.id);
|
|
22342
|
-
})) || [];
|
|
22343
|
-
var initialPriceList;
|
|
22344
|
-
var initialQuantity = (_d = (_c = upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.charges) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.quantity;
|
|
22345
|
-
if (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList) {
|
|
22346
|
-
initialPriceList = initialAvailablePriceLists.find(function (priceList) { return priceList.id === upgradingSubscription.priceList.id; });
|
|
22347
|
-
}
|
|
22348
22834
|
if (initialBillingPeriod)
|
|
22349
22835
|
setSelectedBillingPeriod(initialBillingPeriod);
|
|
22350
22836
|
if (initialProduct)
|
|
22351
22837
|
setSelectedProduct(initialProduct);
|
|
22838
|
+
}, [
|
|
22839
|
+
setSelectedBillingPeriod,
|
|
22840
|
+
setSelectedProduct,
|
|
22841
|
+
selectedBillingPeriod,
|
|
22842
|
+
arePlanChangeOptionsLoading,
|
|
22843
|
+
areSubscriptionsLoading,
|
|
22844
|
+
priceListChangeOptions,
|
|
22845
|
+
selectedPriceList,
|
|
22846
|
+
selectedProduct,
|
|
22847
|
+
]);
|
|
22848
|
+
// Set initial price list and initial quantity in quote preview data
|
|
22849
|
+
// Will also set the initial price list and quantity if the billing period is changed
|
|
22850
|
+
react.useEffect(function () {
|
|
22851
|
+
var _a, _b, _c;
|
|
22852
|
+
var initialAvailablePriceLists = ((_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _a === void 0 ? void 0 : _a.filter(function (priceList) {
|
|
22853
|
+
return periodMonthsConverter(priceList.periodMonths) === initialBillingPeriod &&
|
|
22854
|
+
priceList.product.id === (initialProduct === null || initialProduct === void 0 ? void 0 : initialProduct.id);
|
|
22855
|
+
})) || [];
|
|
22856
|
+
var initialPriceList = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.priceList)
|
|
22857
|
+
? initialAvailablePriceLists.find(function (priceList) { return priceList.id === upgradingSubscription.priceList.id; })
|
|
22858
|
+
: undefined;
|
|
22352
22859
|
if (initialPriceList &&
|
|
22353
22860
|
!isInPreviewMode &&
|
|
22354
22861
|
!isPriceListDisabled({
|
|
22355
22862
|
priceList: initialPriceList,
|
|
22356
|
-
subscriptions: subscriptions,
|
|
22357
22863
|
upgradingSubscription: upgradingSubscription,
|
|
22358
|
-
|
|
22359
|
-
|
|
22864
|
+
}) &&
|
|
22865
|
+
!(quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList)) {
|
|
22866
|
+
var initialQuantity = (_c = (_b = upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.charges) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.quantity;
|
|
22360
22867
|
setQuotePreviewData({
|
|
22361
22868
|
priceList: initialPriceList,
|
|
22362
22869
|
quantity: calculateNewQuantity(initialPriceList, initialQuantity),
|
|
22363
22870
|
});
|
|
22364
22871
|
}
|
|
22365
|
-
}, [
|
|
22366
|
-
|
|
22367
|
-
areSubscriptionsLoading,
|
|
22368
|
-
isInPreviewMode,
|
|
22369
|
-
priceListChangeOptions,
|
|
22370
|
-
selectedBillingPeriod,
|
|
22371
|
-
selectedPriceList,
|
|
22372
|
-
selectedProduct,
|
|
22373
|
-
setQuotePreviewData,
|
|
22374
|
-
subscriptions,
|
|
22375
|
-
upgradingSubscription,
|
|
22376
|
-
]);
|
|
22377
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(BillingPeriodSelector, { availableBillingPeriods: availableBillingPeriods, onChangeBillingPeriod: onChangeBillingPeriod, products: priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.products, selectedBillingPeriod: selectedBillingPeriod, selectedProduct: selectedProduct, onChangeProduct: onChangeProduct }), jsxRuntime.jsx(PriceListGrid, { availablePriceLists: availablePriceLists, onChangePriceList: onChangePriceList, priceListChangeOptions: priceListChangeOptions, priceListStart: priceListStart, selectedPriceList: selectedPriceList, selectedProduct: selectedProduct, setPriceListStart: setPriceListStart, subscriptions: subscriptions, upgradingSubscriptionState: upgradingSubscription })] }));
|
|
22872
|
+
}, [isInPreviewMode, subscriptions, upgradingSubscription, selectedBillingPeriod]);
|
|
22873
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(BillingPeriodSelector, { availableBillingPeriods: availableBillingPeriods, onChangeBillingPeriod: onChangeBillingPeriod, products: priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.products, selectedBillingPeriod: selectedBillingPeriod, selectedProduct: selectedProduct, onChangeProduct: onChangeProduct }), jsxRuntime.jsx(PriceListGrid, { availablePriceLists: availablePriceLists, priceListChangeOptions: priceListChangeOptions, priceListStart: priceListStart, selectedPriceList: selectedPriceList, selectedProduct: selectedProduct, setPriceListStart: setPriceListStart, subscriptions: subscriptions, upgradingSubscriptionState: upgradingSubscription, selectedBillingPeriod: selectedBillingPeriod })] }));
|
|
22378
22874
|
};
|
|
22379
22875
|
|
|
22380
22876
|
var PlanPicker = function () {
|
|
@@ -22383,18 +22879,17 @@ var PlanPicker = function () {
|
|
|
22383
22879
|
var token = useToken();
|
|
22384
22880
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
22385
22881
|
var _b = react.useContext(SubscriptionsContext), isInPreviewMode = _b.isInPreviewMode, productId = _b.productId, upgradingSubscription = _b.upgradingSubscription;
|
|
22386
|
-
var
|
|
22387
|
-
|
|
22388
|
-
var showInfoNotification = common.useInfoNotification();
|
|
22882
|
+
var quotePreviewData = react.useContext(QuotePreviewContext).quotePreviewData;
|
|
22883
|
+
var account = useCurrentUserData(token).account;
|
|
22389
22884
|
// Queries
|
|
22390
|
-
var
|
|
22885
|
+
var _c = reactQuery.useQuery({
|
|
22391
22886
|
queryKey: common.QueryKeyFactory.default.createTableKey({
|
|
22392
22887
|
pluralType: 'subscriptions',
|
|
22393
22888
|
token: token,
|
|
22394
22889
|
}),
|
|
22395
22890
|
queryFn: function () { return getSubscriptions({ isInPreviewMode: isInPreviewMode, token: token, apiHost: apiHost }); },
|
|
22396
|
-
}), subscriptions =
|
|
22397
|
-
var
|
|
22891
|
+
}), subscriptions = _c.data, areSubscriptionsLoading = _c.isLoading;
|
|
22892
|
+
var _d = reactQuery.useQuery({
|
|
22398
22893
|
queryKey: common.QueryKeyFactory.default.planChangeOptionsKey({
|
|
22399
22894
|
subscriptionId: upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id,
|
|
22400
22895
|
token: token,
|
|
@@ -22406,28 +22901,12 @@ var PlanPicker = function () {
|
|
|
22406
22901
|
productId: productId,
|
|
22407
22902
|
token: token,
|
|
22408
22903
|
upgradingSubscription: upgradingSubscription,
|
|
22904
|
+
accountCurrencyId: account === null || account === void 0 ? void 0 : account.currencyId,
|
|
22409
22905
|
});
|
|
22410
22906
|
},
|
|
22411
22907
|
enabled: !areSubscriptionsLoading,
|
|
22412
|
-
}), priceListChangeOptions =
|
|
22413
|
-
|
|
22414
|
-
var onChangePriceList = react.useCallback(function (selectedPriceList) {
|
|
22415
|
-
if (isInPreviewMode)
|
|
22416
|
-
return showInfoNotification('You are in preview mode');
|
|
22417
|
-
return setQuotePreviewData({
|
|
22418
|
-
priceList: selectedPriceList,
|
|
22419
|
-
quantity: calculateNewQuantity(selectedPriceList, quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.quantity),
|
|
22420
|
-
});
|
|
22421
|
-
}, [isInPreviewMode, setQuotePreviewData, showInfoNotification]);
|
|
22422
|
-
// Reset quote preview data when the plan picker is unmounted
|
|
22423
|
-
react.useEffect(function () {
|
|
22424
|
-
return function () {
|
|
22425
|
-
setQuotePreviewData({});
|
|
22426
|
-
};
|
|
22427
|
-
}, [setQuotePreviewData]);
|
|
22428
|
-
if (((_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _a === void 0 ? void 0 : _a.length) === 0)
|
|
22429
|
-
return jsxRuntime.jsx(ErrorView, { message: "There are no plans available" });
|
|
22430
|
-
return (jsxRuntime.jsx(PriceListSelector, { arePlanChangeOptionsLoading: arePlanChangeOptionsLoading, areSubscriptionsLoading: areSubscriptionsLoading, onChangePriceList: onChangePriceList, priceListChangeOptions: priceListChangeOptions, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, subscriptions: subscriptions }));
|
|
22908
|
+
}), priceListChangeOptions = _d.data, arePlanChangeOptionsLoading = _d.isLoading;
|
|
22909
|
+
return (jsxRuntime.jsx(PriceListSelectorProvider, { children: ((_a = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _a === void 0 ? void 0 : _a.length) === 0 ? (jsxRuntime.jsx(ErrorView, { message: "There are no plans available" })) : (jsxRuntime.jsx(PriceListSelector, { arePlanChangeOptionsLoading: arePlanChangeOptionsLoading, areSubscriptionsLoading: areSubscriptionsLoading, priceListChangeOptions: priceListChangeOptions, selectedPriceList: quotePreviewData === null || quotePreviewData === void 0 ? void 0 : quotePreviewData.priceList, subscriptions: subscriptions })) }));
|
|
22431
22910
|
};
|
|
22432
22911
|
|
|
22433
22912
|
var Text$8 = antd.Typography.Text;
|
|
@@ -22467,17 +22946,6 @@ var PlanManager = function (_a) {
|
|
|
22467
22946
|
queryFn: function () { return getSubscriptions({ isInPreviewMode: isInPreviewMode, token: token, apiHost: apiHost }); },
|
|
22468
22947
|
enabled: false,
|
|
22469
22948
|
}), subscriptions = _g.data, subscriptionsAreLoading = _g.isLoading;
|
|
22470
|
-
var quote = reactQuery.useQuery({
|
|
22471
|
-
queryKey: common.QueryKeyFactory.default.createObjectKey({
|
|
22472
|
-
id: editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id,
|
|
22473
|
-
objectName: 'editingQuote',
|
|
22474
|
-
token: token,
|
|
22475
|
-
}),
|
|
22476
|
-
queryFn: function () {
|
|
22477
|
-
return (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) ? getQuote({ token: token, id: editingQuoteData.id, apiHost: apiHost }) : undefined;
|
|
22478
|
-
},
|
|
22479
|
-
enabled: Boolean(editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id),
|
|
22480
|
-
}).data;
|
|
22481
22949
|
react.useEffect(function () {
|
|
22482
22950
|
if (subscriptionUpgradeId && !upgradingSubscription) {
|
|
22483
22951
|
var subscription = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.find(function (subscription) { return subscription.id === subscriptionUpgradeId; });
|
|
@@ -22503,12 +22971,6 @@ var PlanManager = function (_a) {
|
|
|
22503
22971
|
observer.unobserve(el);
|
|
22504
22972
|
};
|
|
22505
22973
|
}, []);
|
|
22506
|
-
function handleSetEditingQuoteData(quoteId, isTrial) {
|
|
22507
|
-
setEditingQuoteData({
|
|
22508
|
-
id: quoteId || (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.id) || '',
|
|
22509
|
-
isTrial: isTrial || (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial) || false,
|
|
22510
|
-
});
|
|
22511
|
-
}
|
|
22512
22974
|
// Handlers
|
|
22513
22975
|
var onSuccess = function () {
|
|
22514
22976
|
setEditingQuoteData(undefined);
|
|
@@ -22532,12 +22994,12 @@ var PlanManager = function (_a) {
|
|
|
22532
22994
|
};
|
|
22533
22995
|
if (subscriptionsAreLoading && !isInPreviewMode)
|
|
22534
22996
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
22535
|
-
return (jsxRuntime.
|
|
22536
|
-
|
|
22537
|
-
|
|
22538
|
-
|
|
22539
|
-
|
|
22540
|
-
|
|
22997
|
+
return (jsxRuntime.jsx("div", __assign({ className: "".concat(className) }, { children: jsxRuntime.jsxs(PlanManagerQuoteProvider, __assign({ editingQuoteData: editingQuoteData, setEditingQuoteData: setEditingQuoteData }, { children: [jsxRuntime.jsx(PreviewModeAdvisary, { isInPreviewMode: isInPreviewMode }), jsxRuntime.jsx(PageTitle, { onGoBack: function () {
|
|
22998
|
+
if (isInPreviewMode)
|
|
22999
|
+
return showInfoNotification('You are in preview mode');
|
|
23000
|
+
setQuotePreviewData(undefined);
|
|
23001
|
+
onChangePlanCancel();
|
|
23002
|
+
}, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, {}), jsxRuntime.jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, token: token, 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, { editingQuote: editingQuoteData, handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } }) }))] })) })));
|
|
22541
23003
|
};
|
|
22542
23004
|
|
|
22543
23005
|
var useCancelSubscription = function () {
|
|
@@ -22556,6 +23018,30 @@ var useCancelSubscription = function () {
|
|
|
22556
23018
|
}); };
|
|
22557
23019
|
};
|
|
22558
23020
|
|
|
23021
|
+
var ADDON_INDENTATION = 64;
|
|
23022
|
+
function findNonAddonSubscriptions(subscriptions) {
|
|
23023
|
+
return subscriptions.filter(function (subscription) {
|
|
23024
|
+
return (subscription.priceList.plan.addon === false || subscription.priceList.plan.addon === null) &&
|
|
23025
|
+
findParentSubscription(subscription, subscriptions) === undefined;
|
|
23026
|
+
});
|
|
23027
|
+
}
|
|
23028
|
+
function findAddonSubscriptions(parentSubscription, subscriptions) {
|
|
23029
|
+
var _a;
|
|
23030
|
+
var addonSubscriptionsIds = (_a = parentSubscription.addonSubscriptions) === null || _a === void 0 ? void 0 : _a.map(function (addonSubscription) { return addonSubscription.id; });
|
|
23031
|
+
return subscriptions.filter(function (subscription) { return addonSubscriptionsIds === null || addonSubscriptionsIds === void 0 ? void 0 : addonSubscriptionsIds.includes(subscription.id); });
|
|
23032
|
+
}
|
|
23033
|
+
function findParentSubscription(subscription, subscriptions) {
|
|
23034
|
+
return subscriptions.find(function (parentSubscription) {
|
|
23035
|
+
var _a;
|
|
23036
|
+
return (_a = parentSubscription.addonSubscriptions) === null || _a === void 0 ? void 0 : _a.some(function (addonSubscription) { return addonSubscription.id === subscription.id; });
|
|
23037
|
+
});
|
|
23038
|
+
}
|
|
23039
|
+
|
|
23040
|
+
var AddonIndentation = function (_a) {
|
|
23041
|
+
var isLast = _a.isLast, indentation = _a.indentation, verticalMargin = _a.verticalMargin;
|
|
23042
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-relative", style: { width: "".concat(indentation, "px") } }, { children: [jsxRuntime.jsx("div", { className: "bunny-flex-1 bunny-bg-gray-300 bunny-w-0.5 bunny-mx-auto", style: { marginTop: verticalMargin } }), jsxRuntime.jsx("div", { className: "bunny-bg-gray-300 bunny-h-0.5 bunny-w-1/2 bunny-ml-auto" }), isLast ? (jsxRuntime.jsx("div", { className: "bunny-flex-1" })) : (jsxRuntime.jsx("div", { className: "bunny-flex-1 bunny-bg-gray-300 bunny-w-0.5 bunny-mx-auto", style: { marginBottom: verticalMargin } }))] })));
|
|
23043
|
+
};
|
|
23044
|
+
|
|
22559
23045
|
var SubscriptionState;
|
|
22560
23046
|
(function (SubscriptionState) {
|
|
22561
23047
|
SubscriptionState["ACTIVE"] = "ACTIVE";
|
|
@@ -22568,7 +23054,7 @@ var SubscriptionState$1 = SubscriptionState;
|
|
|
22568
23054
|
|
|
22569
23055
|
var FEATURE_USAGE_MUTATION = "\nquery GetFeatureUsage($id: ID!) {\n featureUsageHistogram(subscriptionChargeId: $id) {\n subscriptionCharge { \n id\n name\n amount\n currentPeriodPriceByTiers { \n tier { starts price } \n quantity\n amount\n }\n }\n feature { id name }\n periodRange\n dataInterval\n data {\n periodStart\n periodEnd\n intervals {\n intervalStart\n intervalUsage\n }\n intervalsTotal\n }\n }\n}\n";
|
|
22570
23056
|
var getFeatureUsage = function (_a) {
|
|
22571
|
-
var subscriptionChargeId = _a.subscriptionChargeId
|
|
23057
|
+
var subscriptionChargeId = _a.subscriptionChargeId, token = _a.token, apiHost = _a.apiHost;
|
|
22572
23058
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
22573
23059
|
var vars, response;
|
|
22574
23060
|
var _b;
|
|
@@ -22688,362 +23174,16 @@ var FeatureBarChart = function (_a) {
|
|
|
22688
23174
|
var StyledBarChart = defaultStyled(recharts.BarChart)(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n .recharts-surface {\n overflow: visible;\n }\n"], ["\n .recharts-surface {\n overflow: visible;\n }\n"])));
|
|
22689
23175
|
var templateObject_1$2;
|
|
22690
23176
|
|
|
22691
|
-
var canShowQuantitiesInput = function (charge, subscription) {
|
|
22692
|
-
// Check if the subscription is active, pending, or in trial,
|
|
22693
|
-
// the pricing model is not flat,
|
|
22694
|
-
// and if it's not a trial, also check if the current charge is the last one in the subscription.
|
|
22695
|
-
var _a, _b, _c;
|
|
22696
|
-
var isActiveSubscription = ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.ACTIVE;
|
|
22697
|
-
var isPendingSubscription = ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.PENDING;
|
|
22698
|
-
var isTrialSubscription = ((_c = subscription.state) === null || _c === void 0 ? void 0 : _c.toUpperCase()) === common.SubscriptionState.TRIAL;
|
|
22699
|
-
var isFlatPricing = charge.pricingModel === 'FLAT';
|
|
22700
|
-
var shouldProcessCharge = (isActiveSubscription || isPendingSubscription || isTrialSubscription) &&
|
|
22701
|
-
!isFlatPricing &&
|
|
22702
|
-
charge.selfServiceQuantity &&
|
|
22703
|
-
!charge.expired;
|
|
22704
|
-
// Now you can use the value of shouldProcessCharge to determine whether to process the charge.
|
|
22705
|
-
return shouldProcessCharge;
|
|
22706
|
-
};
|
|
22707
|
-
var createQuoteParams = function (quote, subscriptionQuantity, editedSubscription) {
|
|
22708
|
-
var quoteChange = quote.quoteChanges.find(function (quoteChange) { return quoteChange.priceList.id === (editedSubscription === null || editedSubscription === void 0 ? void 0 : editedSubscription.subscription.priceList.id); });
|
|
22709
|
-
var quoteChangeCharge = quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.find(function (charge) { return charge.priceListCharge.id === editedSubscription.chargeId; });
|
|
22710
|
-
var charges = [
|
|
22711
|
-
{
|
|
22712
|
-
id: quoteChangeCharge.id,
|
|
22713
|
-
quantity: editedSubscription.quantity - subscriptionQuantity,
|
|
22714
|
-
},
|
|
22715
|
-
];
|
|
22716
|
-
return { charges: charges, quoteChange: quoteChange };
|
|
22717
|
-
};
|
|
22718
|
-
var canShowChangeQuantities = function (_a) {
|
|
22719
|
-
var subscriptions = _a.subscriptions;
|
|
22720
|
-
return subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.some(function (subscription) {
|
|
22721
|
-
return subscription.charges.some(function (charge, chargeIndex) {
|
|
22722
|
-
return canShowQuantitiesInput(charge, subscription);
|
|
22723
|
-
});
|
|
22724
|
-
});
|
|
22725
|
-
};
|
|
22726
|
-
var isSubscriptionNotActive = function (subscription) {
|
|
22727
|
-
var _a, _b;
|
|
22728
|
-
return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.EXPIRED ||
|
|
22729
|
-
((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.CANCELED;
|
|
22730
|
-
};
|
|
22731
|
-
var isSubscriptionActiveOrPending = function (subscription) {
|
|
22732
|
-
var _a, _b;
|
|
22733
|
-
return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.ACTIVE ||
|
|
22734
|
-
((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.PENDING;
|
|
22735
|
-
};
|
|
22736
|
-
var isSubscriptionTrial = function (subscription) { var _a; return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL; };
|
|
22737
|
-
// Helper function to check if charge is a discount
|
|
22738
|
-
var isDiscount = function (kind) {
|
|
22739
|
-
return kind === common.QuoteChangeKind.DISCOUNT || kind === common.QuoteChangeKind.FREE_PERIOD_DISCOUNT;
|
|
22740
|
-
};
|
|
22741
|
-
var hasPriceTiers = function (charge) {
|
|
22742
|
-
var _a;
|
|
22743
|
-
return Boolean((_a = charge === null || charge === void 0 ? void 0 : charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length);
|
|
22744
|
-
};
|
|
22745
|
-
var hasMultiplePriceTiers = function (charge) {
|
|
22746
|
-
var _a;
|
|
22747
|
-
return ((_a = charge === null || charge === void 0 ? void 0 : charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length) > 1;
|
|
22748
|
-
};
|
|
22749
|
-
var getApplicablePriceTier = function (charge, currencyId, priceDecimals) {
|
|
22750
|
-
var _a;
|
|
22751
|
-
if (!((_a = charge.priceTiers) === null || _a === void 0 ? void 0 : _a.length))
|
|
22752
|
-
return '';
|
|
22753
|
-
var selectedTier;
|
|
22754
|
-
// For TIERED pricing model: always show the first tier
|
|
22755
|
-
if (charge.pricingModel === common.PricingModel.TIERED) {
|
|
22756
|
-
selectedTier = charge.priceTiers[0];
|
|
22757
|
-
}
|
|
22758
|
-
// For VOLUME and BANDS pricing models: find the tier that contains the current quantity
|
|
22759
|
-
else if (charge.pricingModel === common.PricingModel.VOLUME ||
|
|
22760
|
-
charge.pricingModel === common.PricingModel.BANDS) {
|
|
22761
|
-
// Find the appropriate tier based on quantity
|
|
22762
|
-
selectedTier = charge.priceTiers.find(function (tier, index) {
|
|
22763
|
-
var nextTier = charge.priceTiers[index + 1];
|
|
22764
|
-
var tierStart = tier.starts;
|
|
22765
|
-
var tierEnd = nextTier ? nextTier.starts - 1 : Infinity;
|
|
22766
|
-
return charge.quantity >= tierStart && charge.quantity <= tierEnd;
|
|
22767
|
-
});
|
|
22768
|
-
// Fallback to first tier if no tier found (shouldn't happen with proper data)
|
|
22769
|
-
selectedTier = selectedTier || charge.priceTiers[0];
|
|
22770
|
-
}
|
|
22771
|
-
// Default fallback for any other pricing models
|
|
22772
|
-
else {
|
|
22773
|
-
selectedTier = charge.priceTiers[0];
|
|
22774
|
-
}
|
|
22775
|
-
if (!selectedTier)
|
|
22776
|
-
return '';
|
|
22777
|
-
// Calculate the tier range for display
|
|
22778
|
-
var tierIndex = charge.priceTiers.indexOf(selectedTier);
|
|
22779
|
-
var starts = selectedTier.starts;
|
|
22780
|
-
var nextTier = charge.priceTiers[tierIndex + 1];
|
|
22781
|
-
var ends = nextTier ? nextTier.starts - 1 : '∞';
|
|
22782
|
-
return hasMultiplePriceTiers(charge)
|
|
22783
|
-
? "".concat(starts, "-").concat(ends, ": ").concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals))
|
|
22784
|
-
: "".concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals));
|
|
22785
|
-
};
|
|
22786
|
-
|
|
22787
|
-
var MUTATION = "\nmutation BillingDetailsUpdate(\n $attributes: BillingDetailsAttributes!) {\n billingDetailsUpdate(\n attributes: $attributes\n ) {\n billingDetails {\n billingCity\n billingContact {\n email\n }\n billingCountry\n billingState\n billingStreet\n billingZip\n name\n taxNumber\n }\n errors\n }\n }\n";
|
|
22788
|
-
var billingDetailsUpdate = function (_a) {
|
|
22789
|
-
var attributes = _a.attributes, token = _a.token, apiHost = _a.apiHost;
|
|
22790
|
-
return __awaiter(void 0, void 0, void 0, function () {
|
|
22791
|
-
var vars, response, errors;
|
|
22792
|
-
var _b;
|
|
22793
|
-
return __generator(this, function (_c) {
|
|
22794
|
-
switch (_c.label) {
|
|
22795
|
-
case 0:
|
|
22796
|
-
vars = { attributes: attributes };
|
|
22797
|
-
return [4 /*yield*/, gqlRequest({
|
|
22798
|
-
query: MUTATION,
|
|
22799
|
-
token: token,
|
|
22800
|
-
vars: vars,
|
|
22801
|
-
apiHost: apiHost,
|
|
22802
|
-
})];
|
|
22803
|
-
case 1:
|
|
22804
|
-
response = _c.sent();
|
|
22805
|
-
errors = (_b = response === null || response === void 0 ? void 0 : response.billingDetailsUpdate) === null || _b === void 0 ? void 0 : _b.errors;
|
|
22806
|
-
if (errors)
|
|
22807
|
-
throw errors;
|
|
22808
|
-
return [2 /*return*/, response.billingDetailsUpdate];
|
|
22809
|
-
}
|
|
22810
|
-
});
|
|
22811
|
-
});
|
|
22812
|
-
};
|
|
22813
|
-
|
|
22814
|
-
// TODO: move this to common
|
|
22815
|
-
var billingDetailsQuery = function () {
|
|
22816
|
-
return "\nquery BillingDetails {\n billingDetails {\n billingCity\n billingContact {\n email\n }\n billingCountry\n billingState\n billingStreet\n billingZip\n name\n taxNumber\n currency {\n id\n }\n }\n}";
|
|
22817
|
-
};
|
|
22818
|
-
var getBillingDetails = function (_a) {
|
|
22819
|
-
var token = _a.token, apiHost = _a.apiHost;
|
|
22820
|
-
return __awaiter(void 0, void 0, void 0, function () {
|
|
22821
|
-
var response;
|
|
22822
|
-
var _b;
|
|
22823
|
-
return __generator(this, function (_c) {
|
|
22824
|
-
switch (_c.label) {
|
|
22825
|
-
case 0: return [4 /*yield*/, gqlRequest({
|
|
22826
|
-
query: billingDetailsQuery(),
|
|
22827
|
-
token: token,
|
|
22828
|
-
apiHost: apiHost,
|
|
22829
|
-
})];
|
|
22830
|
-
case 1:
|
|
22831
|
-
response = _c.sent();
|
|
22832
|
-
if (response === null || response === void 0 ? void 0 : response.errors) {
|
|
22833
|
-
throw new Error((_b = response === null || response === void 0 ? void 0 : response.errors[0]) === null || _b === void 0 ? void 0 : _b.message);
|
|
22834
|
-
}
|
|
22835
|
-
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.billingDetails];
|
|
22836
|
-
}
|
|
22837
|
-
});
|
|
22838
|
-
});
|
|
22839
|
-
};
|
|
22840
|
-
|
|
22841
|
-
var Text$7 = antd.Typography.Text;
|
|
22842
|
-
function BillingDetailsSection(_a) {
|
|
22843
|
-
var _this = this;
|
|
22844
|
-
var hidePaymentMethodForm = _a.hidePaymentMethodForm, countryListFilter = _a.countryListFilter;
|
|
22845
|
-
// State
|
|
22846
|
-
var _b = react.useState(false), isFormEdited = _b[0], setIsFormEdited = _b[1];
|
|
22847
|
-
var _c = react.useState(false), formIsValid = _c[0], setFormIsValid = _c[1];
|
|
22848
|
-
var form = antd.Form.useForm()[0];
|
|
22849
|
-
var values = antd.Form.useWatch([], form);
|
|
22850
|
-
// Context
|
|
22851
|
-
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
22852
|
-
var token = useToken();
|
|
22853
|
-
// Hooks
|
|
22854
|
-
var isMobile = common.useIsMobile();
|
|
22855
|
-
var queryClient = reactQuery.useQueryClient();
|
|
22856
|
-
var showErrorNotification = common.useErrorNotification();
|
|
22857
|
-
var showSuccessNotification = common.useSuccessNotification();
|
|
22858
|
-
// Queries
|
|
22859
|
-
var _d = reactQuery.useQuery({
|
|
22860
|
-
queryKey: common.QueryKeyFactory.default.billingDetailsKey({ token: token }),
|
|
22861
|
-
queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
|
|
22862
|
-
}), billingDetails = _d.data, isLoadingBillingDetails = _d.isLoading;
|
|
22863
|
-
var _e = reactQuery.useMutation({
|
|
22864
|
-
mutationFn: function (changedFormData) { return __awaiter(_this, void 0, void 0, function () {
|
|
22865
|
-
var updatedBillingDetails;
|
|
22866
|
-
return __generator(this, function (_a) {
|
|
22867
|
-
switch (_a.label) {
|
|
22868
|
-
case 0: return [4 /*yield*/, billingDetailsUpdate({
|
|
22869
|
-
attributes: {
|
|
22870
|
-
name: changedFormData.name,
|
|
22871
|
-
billingStreet: changedFormData.billingStreet,
|
|
22872
|
-
billingCity: changedFormData.billingCity,
|
|
22873
|
-
billingZip: changedFormData.billingZip,
|
|
22874
|
-
billingState: changedFormData.billingState,
|
|
22875
|
-
billingCountry: changedFormData.billingCountry,
|
|
22876
|
-
billingContactEmail: changedFormData.billingContactEmail,
|
|
22877
|
-
taxNumber: changedFormData.taxNumber,
|
|
22878
|
-
},
|
|
22879
|
-
token: token,
|
|
22880
|
-
apiHost: apiHost,
|
|
22881
|
-
})];
|
|
22882
|
-
case 1:
|
|
22883
|
-
updatedBillingDetails = _a.sent();
|
|
22884
|
-
queryClient.setQueryData(common.QueryKeyFactory.default.billingDetailsKey({ token: token }), function (old) {
|
|
22885
|
-
return __assign(__assign({}, old), updatedBillingDetails.billingDetails);
|
|
22886
|
-
});
|
|
22887
|
-
return [2 /*return*/, updatedBillingDetails];
|
|
22888
|
-
}
|
|
22889
|
-
});
|
|
22890
|
-
}); },
|
|
22891
|
-
onSuccess: function () {
|
|
22892
|
-
showSuccessNotification('Your account details have been saved');
|
|
22893
|
-
queryClient.invalidateQueries({
|
|
22894
|
-
queryKey: common.QueryKeyFactory.default.taxationRequiredAccountFieldsKey({
|
|
22895
|
-
token: token,
|
|
22896
|
-
}),
|
|
22897
|
-
});
|
|
22898
|
-
},
|
|
22899
|
-
}), updateBillingDetails = _e.mutate, isUpdatingBillingDetails = _e.isPending;
|
|
22900
|
-
// Set form values when billing details are loaded
|
|
22901
|
-
react.useEffect(function () {
|
|
22902
|
-
var _a;
|
|
22903
|
-
if (billingDetails) {
|
|
22904
|
-
form.setFieldsValue({
|
|
22905
|
-
billingStreet: billingDetails.billingStreet,
|
|
22906
|
-
billingCity: billingDetails.billingCity,
|
|
22907
|
-
billingZip: billingDetails.billingZip,
|
|
22908
|
-
billingState: billingDetails.billingState,
|
|
22909
|
-
billingCountry: billingDetails.billingCountry,
|
|
22910
|
-
billingContactEmail: (_a = billingDetails.billingContact) === null || _a === void 0 ? void 0 : _a.email,
|
|
22911
|
-
taxNumber: billingDetails.taxNumber,
|
|
22912
|
-
});
|
|
22913
|
-
}
|
|
22914
|
-
}, [billingDetails]);
|
|
22915
|
-
react.useEffect(function () {
|
|
22916
|
-
form
|
|
22917
|
-
.validateFields({ validateOnly: true })
|
|
22918
|
-
.then(function () { return setFormIsValid(true); })
|
|
22919
|
-
.catch(function () { return setFormIsValid(false); });
|
|
22920
|
-
var isFormEdited = function () {
|
|
22921
|
-
var _a;
|
|
22922
|
-
if (!billingDetails)
|
|
22923
|
-
return false;
|
|
22924
|
-
var currentValues = form.getFieldsValue();
|
|
22925
|
-
var accountValues = {
|
|
22926
|
-
billingStreet: billingDetails.billingStreet,
|
|
22927
|
-
billingCity: billingDetails.billingCity,
|
|
22928
|
-
billingZip: billingDetails.billingZip,
|
|
22929
|
-
billingState: billingDetails.billingState,
|
|
22930
|
-
billingCountry: billingDetails.billingCountry,
|
|
22931
|
-
billingContactEmail: (_a = billingDetails.billingContact) === null || _a === void 0 ? void 0 : _a.email,
|
|
22932
|
-
taxNumber: billingDetails.taxNumber,
|
|
22933
|
-
};
|
|
22934
|
-
return Object.keys(currentValues).some(function (key) {
|
|
22935
|
-
var value = accountValues[key];
|
|
22936
|
-
return currentValues[key] !== value;
|
|
22937
|
-
});
|
|
22938
|
-
};
|
|
22939
|
-
setIsFormEdited(isFormEdited());
|
|
22940
|
-
}, [form, values, billingDetails]);
|
|
22941
|
-
// Validate form fields when isFormEdited changes
|
|
22942
|
-
react.useEffect(function () {
|
|
22943
|
-
var validateOnly = isFormEdited ? false : true;
|
|
22944
|
-
form.validateFields({ validateOnly: validateOnly });
|
|
22945
|
-
}, [isFormEdited]);
|
|
22946
|
-
var saveBillingDetails = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
22947
|
-
var _this = this;
|
|
22948
|
-
return __generator(this, function (_a) {
|
|
22949
|
-
form.validateFields({ validateOnly: false }).then(function () { return __awaiter(_this, void 0, void 0, function () {
|
|
22950
|
-
var error_1;
|
|
22951
|
-
return __generator(this, function (_a) {
|
|
22952
|
-
switch (_a.label) {
|
|
22953
|
-
case 0:
|
|
22954
|
-
_a.trys.push([0, 2, 3, 4]);
|
|
22955
|
-
return [4 /*yield*/, form.validateFields()];
|
|
22956
|
-
case 1:
|
|
22957
|
-
_a.sent();
|
|
22958
|
-
updateBillingDetails(form.getFieldsValue());
|
|
22959
|
-
return [3 /*break*/, 4];
|
|
22960
|
-
case 2:
|
|
22961
|
-
error_1 = _a.sent();
|
|
22962
|
-
if (error_1 instanceof Error) {
|
|
22963
|
-
showErrorNotification('Failed to update account', error_1.message);
|
|
22964
|
-
}
|
|
22965
|
-
else {
|
|
22966
|
-
showErrorNotification('Please fill out all required fields');
|
|
22967
|
-
}
|
|
22968
|
-
return [3 /*break*/, 4];
|
|
22969
|
-
case 3:
|
|
22970
|
-
setIsFormEdited(false);
|
|
22971
|
-
return [7 /*endfinally*/];
|
|
22972
|
-
case 4: return [2 /*return*/];
|
|
22973
|
-
}
|
|
22974
|
-
});
|
|
22975
|
-
}); });
|
|
22976
|
-
return [2 /*return*/];
|
|
22977
|
-
});
|
|
22978
|
-
}); };
|
|
22979
|
-
var filteredCountryList = react.useMemo(function () {
|
|
22980
|
-
return countryListFilter ? common.Lists.COUNTRY_LIST.filter(countryListFilter) : common.Lists.COUNTRY_LIST;
|
|
22981
|
-
}, [countryListFilter]);
|
|
22982
|
-
return (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile || hidePaymentMethodForm ? 'bunny-w-full' : 'bunny-w-1/2') }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-px-4" }, { children: [jsxRuntime.jsxs(antd.Skeleton, __assign({ loading: isLoadingBillingDetails }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-mb-2" }, { children: jsxRuntime.jsx(Text$7, __assign({ className: "bunny-font-medium bunny-text-lg" }, { children: (billingDetails === null || billingDetails === void 0 ? void 0 : billingDetails.name) || 'No company name' })) })), jsxRuntime.jsxs(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", form: form, layout: "vertical", disabled: isUpdatingBillingDetails, autoComplete: "off" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Street address", name: "billingStreet", rules: [{ required: true, message: 'Street address is required' }] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-4" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: 'City is required' }], className: "bunny-flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: 'Zipcode is required' }], className: "bunny-flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) }))] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'bunny-flex-row bunny-pb-2' : 'bunny-flex-row', " bunny-gap-4") }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex-1 bunny-w-1/2" }, { children: jsxRuntime.jsx(antd.Form.Item, __assign({ label: "State", name: "billingState", rules: [
|
|
22983
|
-
{
|
|
22984
|
-
required: false,
|
|
22985
|
-
},
|
|
22986
|
-
] }, { children: jsxRuntime.jsx(antd.Input, {}) })) })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex-1 bunny-w-1/2" }, { children: jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Country", name: "billingCountry", rules: [{ required: true, message: 'Country is required' }] }, { children: jsxRuntime.jsx(antd.Select, { className: "bunny-w-full", options: filteredCountryList, placeholder: "Select a country", popupMatchSelectWidth: false, showSearch: true, filterOption: function (input, option) {
|
|
22987
|
-
var _a, _b;
|
|
22988
|
-
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : '').toLowerCase().includes(input.toLowerCase()) ||
|
|
22989
|
-
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b : '').toLowerCase().includes(input.toLowerCase());
|
|
22990
|
-
} }) })) }))] })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Email", name: "billingContactEmail", rules: [
|
|
22991
|
-
{
|
|
22992
|
-
required: true,
|
|
22993
|
-
message: 'Email is required',
|
|
22994
|
-
type: 'email',
|
|
22995
|
-
},
|
|
22996
|
-
] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Tax ID", name: "taxNumber", tooltip: "Tax ID will be printed on quotes and invoices below the account's address", rules: [{ required: false }] }, { children: jsxRuntime.jsx(antd.Input, {}) }))] }))] })), jsxRuntime.jsx(antd.Button, __assign({ disabled: !isFormEdited || isUpdatingBillingDetails || !formIsValid, className: "bunny-w-full bunny-mt-4", type: "primary", onClick: saveBillingDetails }, { children: "Save" }))] })) })));
|
|
22997
|
-
}
|
|
22998
|
-
|
|
22999
|
-
var BillingDetails = function (_a) {
|
|
23000
|
-
var className = _a.className, countryListFilter = _a.countryListFilter, _b = _a.hideBillingDetailsForm, hideBillingDetailsForm = _b === void 0 ? false : _b, _c = _a.hidePaymentMethodForm, hidePaymentMethodForm = _c === void 0 ? false : _c, _d = _a.isCardEnabled, isCardEnabled = _d === void 0 ? true : _d, _e = _a.isUpgradeFromTrial, isUpgradeFromTrial = _e === void 0 ? false : _e, _f = _a.shadow, shadow = _f === void 0 ? 'shadow-md' : _f, onSavePaymentMethod = _a.onSavePaymentMethod;
|
|
23001
|
-
// Hooks
|
|
23002
|
-
var isMobile = common.useIsMobile();
|
|
23003
|
-
return (jsxRuntime.jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-py-2 bunny-my-2 ".concat(isMobile ? 'bunny-flex-col bunny-space-y-4' : 'bunny-flex-row', " bunny-gap-4") }, { children: [!hideBillingDetailsForm ? (jsxRuntime.jsx(BillingDetailsSection, { hidePaymentMethodForm: hidePaymentMethodForm, countryListFilter: countryListFilter })) : null, !hideBillingDetailsForm && !hidePaymentMethodForm ? jsxRuntime.jsx(ResponsiveDivider, {}) : null, !hidePaymentMethodForm ? (jsxRuntime.jsx(PaymentFormSection, { hideBillingDetailsForm: hideBillingDetailsForm, isUpgradeFromTrial: isUpgradeFromTrial, onSavePaymentMethod: onSavePaymentMethod })) : null] })) })));
|
|
23004
|
-
};
|
|
23005
|
-
var WrapperComponent = function (_a) {
|
|
23006
|
-
var children = _a.children, isCardEnabled = _a.isCardEnabled, shadow = _a.shadow, className = _a.className;
|
|
23007
|
-
return (jsxRuntime.jsx("div", __assign({ className: "".concat(className) }, { children: isCardEnabled ? jsxRuntime.jsx(Card, __assign({ className: "".concat(shadow) }, { children: children })) : jsxRuntime.jsx("div", { children: children }) })));
|
|
23008
|
-
};
|
|
23009
|
-
var ResponsiveDivider = function () {
|
|
23010
|
-
var isMobile = common.useIsMobile();
|
|
23011
|
-
return isMobile ? (jsxRuntime.jsx("div", __assign({ className: "bunny-mx-4" }, { children: jsxRuntime.jsx(antd.Divider, {}) }))) : (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(antd.Divider, { className: "bunny-h-full", type: "vertical" }) }));
|
|
23012
|
-
};
|
|
23013
|
-
var PaymentFormSection = function (_a) {
|
|
23014
|
-
var hideBillingDetailsForm = _a.hideBillingDetailsForm, isUpgradeFromTrial = _a.isUpgradeFromTrial, onSavePaymentMethod = _a.onSavePaymentMethod;
|
|
23015
|
-
var isMobile = common.useIsMobile();
|
|
23016
|
-
var onTokenExpired = react.useContext(BunnyContext).onTokenExpired;
|
|
23017
|
-
var handleAllErrorFormats = common.useAllErrorFormats(onTokenExpired);
|
|
23018
|
-
var showSuccessNotification = common.useSuccessNotification();
|
|
23019
|
-
var entityId = useCurrentUserData().entityId;
|
|
23020
|
-
return (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile || hideBillingDetailsForm ? 'bunny-w-full' : 'bunny-w-1/2 bunny-pt-4', " bunny-flex bunny-justify-center") }, { children: jsxRuntime.jsx(PaymentForm, { entityId: entityId, onFail: function (error) {
|
|
23021
|
-
handleAllErrorFormats(error);
|
|
23022
|
-
}, onSavePaymentMethod: function () {
|
|
23023
|
-
showSuccessNotification(isUpgradeFromTrial
|
|
23024
|
-
? 'Payment method saved! Your trial will automatically convert to a paid subscription.'
|
|
23025
|
-
: 'Payment method saved successfully!');
|
|
23026
|
-
onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod();
|
|
23027
|
-
} }) })));
|
|
23028
|
-
};
|
|
23029
|
-
|
|
23030
|
-
var UpgradeFromTrial = function (_a) {
|
|
23031
|
-
var onClose = _a.onClose, open = _a.open;
|
|
23032
|
-
return (jsxRuntime.jsx(antd.Modal, __assign({ width: '80vw', open: open, onCancel: onClose, footer: null }, { children: jsxRuntime.jsx(BillingDetails, { isUpgradeFromTrial: true, onSavePaymentMethod: onClose }) })));
|
|
23033
|
-
};
|
|
23034
|
-
|
|
23035
23177
|
var SubscriptionCardActions = function (_a) {
|
|
23036
23178
|
var _b;
|
|
23037
23179
|
var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, priceListChangeOptions = _a.priceListChangeOptions, subscription = _a.subscription;
|
|
23038
23180
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
23039
23181
|
var token = useToken();
|
|
23040
|
-
var
|
|
23182
|
+
var isPaymentMethodLoading = usePaymentMethod({
|
|
23041
23183
|
accountId: subscription.accountId,
|
|
23042
23184
|
token: token,
|
|
23043
23185
|
apiHost: apiHost,
|
|
23044
|
-
})
|
|
23045
|
-
// Local state
|
|
23046
|
-
var _d = react.useState(false), isUpgradeFromTrialModalOpen = _d[0], setIsUpgradeFromTrialModalOpen = _d[1];
|
|
23186
|
+
}).isLoading;
|
|
23047
23187
|
// Derived state
|
|
23048
23188
|
var isSelfServiceCancelable = subscription.plan.selfServiceCancel;
|
|
23049
23189
|
var productPlans = (_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _b === void 0 ? void 0 : _b.filter(function (priceList) { return priceList.product.id === subscription.product.id; });
|
|
@@ -23052,28 +23192,45 @@ var SubscriptionCardActions = function (_a) {
|
|
|
23052
23192
|
var isActiveOrPending = isSubscriptionActiveOrPending(subscription);
|
|
23053
23193
|
if (isPaymentMethodLoading)
|
|
23054
23194
|
return null;
|
|
23055
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isSelfServiceCancelable && (isInTrial || isActiveOrPending) && (jsxRuntime.jsx(antd.Popconfirm, __assign({ icon: null, onConfirm: function () { return onCancelSubscriptionClick
|
|
23195
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isSelfServiceCancelable && onCancelSubscriptionClick && (isInTrial || isActiveOrPending) && (jsxRuntime.jsx(antd.Popconfirm, __assign({ icon: null, onConfirm: function () { return onCancelSubscriptionClick(subscription); }, title: "Cancel subscription" }, { children: jsxRuntime.jsx(antd.Button, __assign({ className: "bunny-p-0", type: "link" }, { children: "Cancel subscription" })) }))), arePlansAvailable && onChangePlanClick && (isActiveOrPending || isInTrial) && (jsxRuntime.jsx(antd.Button, __assign({ onClick: function () { return onChangePlanClick(subscription); }, type: 'primary' }, { children: isInTrial ? 'Upgrade from trial' : 'Change plan' }))), !arePlansAvailable && isInTrial && jsxRuntime.jsx(antd.Tag, __assign({ color: "warning" }, { children: "Cannot upgrade" }))] }));
|
|
23056
23196
|
};
|
|
23057
23197
|
|
|
23058
|
-
var Text$
|
|
23198
|
+
var Text$7 = antd.Typography.Text;
|
|
23059
23199
|
var getSubscriptionStatusText = function (subscription) {
|
|
23060
|
-
var cancellationDate = subscription.cancellationDate, state = subscription.state, evergreen = subscription.evergreen, endDate = subscription.endDate;
|
|
23061
|
-
|
|
23062
|
-
|
|
23063
|
-
|
|
23200
|
+
var cancellationDate = subscription.cancellationDate, state = subscription.state, evergreen = subscription.evergreen, endDate = subscription.endDate, trialEndDate = subscription.trialEndDate, trialStartDate = subscription.trialStartDate, startDate = subscription.startDate, trialExpirationAction = subscription.trialExpirationAction;
|
|
23201
|
+
var stateUpperCased = state === null || state === void 0 ? void 0 : state.toUpperCase();
|
|
23202
|
+
var isActive = stateUpperCased === common.SubscriptionState.ACTIVE;
|
|
23203
|
+
var isPending = stateUpperCased === common.SubscriptionState.PENDING;
|
|
23204
|
+
var isCanceled = stateUpperCased === common.SubscriptionState.CANCELED;
|
|
23205
|
+
var isExpired = stateUpperCased === common.SubscriptionState.EXPIRED;
|
|
23206
|
+
var isTrial = stateUpperCased === common.SubscriptionState.TRIAL;
|
|
23207
|
+
if (cancellationDate && (isActive || isPending || isTrial))
|
|
23064
23208
|
return (jsxRuntime.jsxs(CustomizedTag, __assign({ color: "red" }, { children: ["Canceled - ends on ", common.formatDate(cancellationDate)] })));
|
|
23209
|
+
if (cancellationDate && isCanceled)
|
|
23210
|
+
return "Canceled on ".concat(common.formatDate(cancellationDate));
|
|
23211
|
+
if (isExpired)
|
|
23212
|
+
return "Ended on ".concat(common.formatDate(endDate || trialEndDate));
|
|
23213
|
+
if (isPending) {
|
|
23214
|
+
if (trialStartDate)
|
|
23215
|
+
return "Trial starts on ".concat(common.formatDate(trialStartDate));
|
|
23216
|
+
if (startDate)
|
|
23217
|
+
return "Activates on ".concat(common.formatDate(startDate));
|
|
23218
|
+
}
|
|
23219
|
+
if (isTrial) {
|
|
23220
|
+
switch (trialExpirationAction) {
|
|
23221
|
+
case 'ACTIVATE':
|
|
23222
|
+
return "Activates on ".concat(common.formatDate(endDate));
|
|
23223
|
+
case 'CANCEL':
|
|
23224
|
+
return "Trial ends on ".concat(common.formatDate(endDate));
|
|
23225
|
+
}
|
|
23065
23226
|
}
|
|
23066
23227
|
if (evergreen) {
|
|
23067
23228
|
return "Renews on ".concat(common.formatDate(endDate));
|
|
23068
23229
|
}
|
|
23069
|
-
|
|
23070
|
-
(state === null || state === void 0 ? void 0 : state.toUpperCase()) === common.SubscriptionState.EXPIRED) {
|
|
23071
|
-
return "Ended on ".concat(common.formatDate(endDate));
|
|
23072
|
-
}
|
|
23073
|
-
return "Ends on ".concat(common.formatDate(endDate));
|
|
23230
|
+
return "Ends on ".concat(common.formatDate(endDate || trialEndDate));
|
|
23074
23231
|
};
|
|
23075
23232
|
var SubscriptionCardHeader = function (_a) {
|
|
23076
|
-
var _b, _c, _d, _e
|
|
23233
|
+
var _b, _c, _d, _e;
|
|
23077
23234
|
var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, priceListChangeOptions = _a.priceListChangeOptions, subscription = _a.subscription;
|
|
23078
23235
|
var darkMode = react.useContext(BunnyContext).darkMode;
|
|
23079
23236
|
var brandColor = react.useContext(BrandContext).brandColor;
|
|
@@ -23081,10 +23238,10 @@ var SubscriptionCardHeader = function (_a) {
|
|
|
23081
23238
|
var isMobile = common.useIsMobile();
|
|
23082
23239
|
// Derived state
|
|
23083
23240
|
var trialDaysLeft = subscription === null || subscription === void 0 ? void 0 : subscription.daysLeftInTrial;
|
|
23084
|
-
var isTrial = (
|
|
23241
|
+
var isTrial = isSubscriptionTrial(subscription);
|
|
23085
23242
|
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: {
|
|
23086
23243
|
backgroundColor: darkMode ? 'var(--row-background-dark)' : '',
|
|
23087
|
-
} }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [((
|
|
23244
|
+
} }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [((_b = subscription === null || subscription === void 0 ? void 0 : subscription.product) === null || _b === void 0 ? void 0 : _b.name) && (jsxRuntime.jsx(Text$7, __assign({ style: __assign({ fontSize: '11px', fontWeight: 500, color: brandColor }, subscriptionProductNameStyle) }, { children: (_c = subscription.product.name) === null || _c === void 0 ? void 0 : _c.toUpperCase() }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-grow bunny-items-center bunny-gap-2" }, { children: [((_d = subscription === null || subscription === void 0 ? void 0 : subscription.plan) === null || _d === void 0 ? void 0 : _d.name) && (jsxRuntime.jsx(Text$7, __assign({ className: "bunny-text-lg" }, { children: subscription.plan.name }))), jsxRuntime.jsxs(CustomizedTag, __assign({ color: common.TAG_COLORS[(_e = subscription.state) === null || _e === void 0 ? void 0 : _e.toUpperCase()] }, { children: [lodashExports.capitalize(subscription.state.toLowerCase()), isTrial ? " (".concat(trialDaysLeft || 'N/A', " days left)") : ''] }))] }))] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-6" }, { children: [jsxRuntime.jsx(Text$7, __assign({ className: "bunny-grow bunny-text-xs" }, { children: getSubscriptionStatusText(subscription) })), !isMobile && (jsxRuntime.jsx(SubscriptionCardActions, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscription: subscription }))] }))] })));
|
|
23088
23245
|
};
|
|
23089
23246
|
|
|
23090
23247
|
var SubscriptionChargeTotal = function (_a) {
|
|
@@ -23161,19 +23318,19 @@ var SubscriptionChargeUnitPrice = function (_a) {
|
|
|
23161
23318
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: hasPriceTiers(charge) ? (jsxRuntime.jsx(TieredDisplayDropdown, { charge: charge, currencyId: currencyId, truncatedText: "".concat(charge.kind === common.QuoteChangeKind.PRICE_UPDATE ? 'new ' : '').concat(getApplicablePriceTier(charge, currencyId, charge.priceDecimals)) })) : isChargeDiscount ? ("-".concat(price)) : (price) }));
|
|
23162
23319
|
};
|
|
23163
23320
|
|
|
23164
|
-
var Text$
|
|
23321
|
+
var Text$6 = antd.Typography.Text;
|
|
23165
23322
|
var SubscriptionCardColumnHeaders = function (_a) {
|
|
23166
23323
|
var columns = _a.columns;
|
|
23167
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: columns.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(Text$
|
|
23324
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: columns.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(Text$6, __assign({ className: "bunny-text-slate-400 ".concat(subscriptionColumn.className), style: { fontSize: "11px" } }, { children: subscriptionColumn.title }), index)); }) }));
|
|
23168
23325
|
};
|
|
23169
23326
|
|
|
23170
|
-
var Text$
|
|
23327
|
+
var Text$5 = antd.Typography.Text;
|
|
23171
23328
|
var SubscriptionsListCell = function (_a) {
|
|
23172
23329
|
var children = _a.children, className = _a.className, gridColumn = _a.gridColumn, right = _a.right, style = _a.style;
|
|
23173
|
-
return (jsxRuntime.jsx(Text$
|
|
23330
|
+
return (jsxRuntime.jsx(Text$5, __assign({ className: "bunny-flex bunny-items-center bunny-text-sm bunny-whitespace-nowrap ".concat(className), style: __assign({ gridColumn: gridColumn, textAlign: right ? "right" : "left", justifyContent: right ? "flex-end" : "flex-start" }, style) }, { children: children })));
|
|
23174
23331
|
};
|
|
23175
23332
|
|
|
23176
|
-
var
|
|
23333
|
+
var NON_ADDON_CARD_COLUMNS = [
|
|
23177
23334
|
{
|
|
23178
23335
|
title: 'CHARGE',
|
|
23179
23336
|
width: 'minmax(min-content, 26%)',
|
|
@@ -23198,12 +23355,38 @@ var CARD_COLUMNS = [
|
|
|
23198
23355
|
width: "minmax(min-content, 18%)",
|
|
23199
23356
|
},
|
|
23200
23357
|
];
|
|
23358
|
+
var ADDON_CARD_COLUMNS = [
|
|
23359
|
+
{
|
|
23360
|
+
title: 'CHARGE',
|
|
23361
|
+
width: 'minmax(min-content, 21.6%)',
|
|
23362
|
+
},
|
|
23363
|
+
{
|
|
23364
|
+
title: 'PERIOD',
|
|
23365
|
+
width: 'minmax(min-content, 21.1%)',
|
|
23366
|
+
},
|
|
23367
|
+
{
|
|
23368
|
+
className: 'text-right',
|
|
23369
|
+
title: 'QUANTITY',
|
|
23370
|
+
width: "minmax(min-content, 19.1%)",
|
|
23371
|
+
},
|
|
23372
|
+
{
|
|
23373
|
+
className: 'text-right',
|
|
23374
|
+
title: 'UNIT PRICE',
|
|
23375
|
+
width: "minmax(min-content, 19.1%)",
|
|
23376
|
+
},
|
|
23377
|
+
{
|
|
23378
|
+
className: 'text-right',
|
|
23379
|
+
title: 'TOTAL',
|
|
23380
|
+
width: "minmax(min-content, 19.1%)",
|
|
23381
|
+
},
|
|
23382
|
+
];
|
|
23201
23383
|
var SubscriptionCardDesktop = function (_a) {
|
|
23202
23384
|
var _b;
|
|
23203
|
-
var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, priceListChangeOptions = _a.priceListChangeOptions, subscription = _a.subscription;
|
|
23385
|
+
var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, priceListChangeOptions = _a.priceListChangeOptions, subscription = _a.subscription, isAddon = _a.isAddon;
|
|
23204
23386
|
var shadow = react.useContext(SubscriptionsContext).shadow;
|
|
23205
23387
|
// Derived state
|
|
23206
23388
|
var isTrial = ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === SubscriptionState$1.TRIAL;
|
|
23389
|
+
var CARD_COLUMNS = isAddon ? ADDON_CARD_COLUMNS : NON_ADDON_CARD_COLUMNS;
|
|
23207
23390
|
return (jsxRuntime.jsxs(Card, __assign({ className: "p-4 ".concat(shadow ? "shadow-".concat(shadow) : '') }, { children: [jsxRuntime.jsx(SubscriptionCardHeader, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscription: subscription }), jsxRuntime.jsx(antd.Divider, { className: "bunny-my-4", style: {
|
|
23208
23391
|
gridColumn: '1 / 5',
|
|
23209
23392
|
width: 'calc(100% + 32px)',
|
|
@@ -23230,11 +23413,9 @@ var SubscriptionCardDesktopRow = function (_a) {
|
|
|
23230
23413
|
var chargePeriod = "".concat(common.formatDate(charge.startDate), " - ").concat(common.formatDate(charge.endDate));
|
|
23231
23414
|
// Queries
|
|
23232
23415
|
var data = reactQuery.useQuery({
|
|
23233
|
-
queryKey: ['getFeatureUsage', charge.id
|
|
23416
|
+
queryKey: ['getFeatureUsage', charge.id],
|
|
23234
23417
|
queryFn: function () {
|
|
23235
23418
|
return getFeatureUsage({
|
|
23236
|
-
endDate: charge.endDate,
|
|
23237
|
-
startDate: charge.startDate,
|
|
23238
23419
|
subscriptionChargeId: charge.id,
|
|
23239
23420
|
token: token,
|
|
23240
23421
|
apiHost: apiHost,
|
|
@@ -23258,10 +23439,24 @@ var SubscriptionCardDesktopRow = function (_a) {
|
|
|
23258
23439
|
: (_c = charge.quantity) === null || _c === void 0 ? void 0 : _c.toLocaleString() })), jsxRuntime.jsx(SubscriptionsListCell, __assign({ right: true }, { children: jsxRuntime.jsx(SubscriptionChargeUnitPrice, { charge: charge, currencyId: subscription.currencyId }) })), jsxRuntime.jsx(SubscriptionsListCell, __assign({ right: true }, { children: jsxRuntime.jsx(SubscriptionChargeTotal, { charge: charge, subscription: subscription }) }))] })));
|
|
23259
23440
|
};
|
|
23260
23441
|
|
|
23261
|
-
|
|
23442
|
+
function AddonSubscriptionsCards(_a) {
|
|
23443
|
+
var onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscriptions = _a.subscriptions, subscription = _a.subscription, hideExpired = _a.hideExpired;
|
|
23444
|
+
var addonSubscriptions = findAddonSubscriptions(subscription, subscriptions);
|
|
23445
|
+
if (addonSubscriptions.length === 0) {
|
|
23446
|
+
return null;
|
|
23447
|
+
}
|
|
23448
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: addonSubscriptions.map(function (addonSubscription, addonSubscriptionIndex) {
|
|
23449
|
+
if (hideExpired && isSubscriptionNotActive(addonSubscription))
|
|
23450
|
+
return null;
|
|
23451
|
+
var isLast = addonSubscriptionIndex === addonSubscriptions.length - 1;
|
|
23452
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row" }, { children: [jsxRuntime.jsx(AddonIndentation, { isLast: isLast, indentation: ADDON_INDENTATION, verticalMargin: "-1rem" }), jsxRuntime.jsx("div", __assign({ className: "bunny-flex-1" }, { children: jsxRuntime.jsx(SubscriptionCardDesktop, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: addonSubscription, isAddon: true }) }))] })));
|
|
23453
|
+
}) }));
|
|
23454
|
+
}
|
|
23455
|
+
|
|
23456
|
+
var Text$4 = antd.Typography.Text;
|
|
23262
23457
|
var SubscriptionCardCellMobile = function (_a) {
|
|
23263
23458
|
var children = _a.children, className = _a.className, style = _a.style;
|
|
23264
|
-
return (jsxRuntime.jsx(Text$
|
|
23459
|
+
return (jsxRuntime.jsx(Text$4, __assign({ className: className, style: style }, { children: children })));
|
|
23265
23460
|
};
|
|
23266
23461
|
|
|
23267
23462
|
var CHARGE_COLUMNS = [
|
|
@@ -23309,29 +23504,30 @@ var SubscriptionCard = function (_a) {
|
|
|
23309
23504
|
var SubscriptionsList = function (_a) {
|
|
23310
23505
|
var hideExpired = _a.hideExpired, onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, priceListChangeOptions = _a.priceListChangeOptions, subscriptions = _a.subscriptions;
|
|
23311
23506
|
var isMobile = common.useIsMobile();
|
|
23312
|
-
|
|
23507
|
+
var nonAddonSubscriptions = findNonAddonSubscriptions(subscriptions);
|
|
23508
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: nonAddonSubscriptions === null || nonAddonSubscriptions === void 0 ? void 0 : nonAddonSubscriptions.map(function (subscription, subscriptionIndex) {
|
|
23313
23509
|
if (hideExpired && isSubscriptionNotActive(subscription))
|
|
23314
23510
|
return null;
|
|
23315
23511
|
if (isMobile)
|
|
23316
|
-
return jsxRuntime.jsx(SubscriptionCard, { subscription: subscription }, subscriptionIndex);
|
|
23317
|
-
return (jsxRuntime.jsx(SubscriptionCardDesktop, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscription: subscription }, subscriptionIndex));
|
|
23512
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCard, { subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, hideExpired: hideExpired })] }));
|
|
23513
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCardDesktop, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, hideExpired: hideExpired })] }));
|
|
23318
23514
|
}) }));
|
|
23319
23515
|
};
|
|
23320
23516
|
|
|
23321
|
-
// Extra props to pass in
|
|
23322
|
-
// - previewMode: boolean
|
|
23323
|
-
// - productId: string
|
|
23324
23517
|
var SubscriptionsListContainer = function (_a) {
|
|
23325
23518
|
var companyName = _a.companyName, _b = _a.hideExpired, hideExpired = _b === void 0 ? false : _b, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, onChangePlanClick = _a.onChangePlanClick, noSubscriptionsComponent = _a.noSubscriptionsComponent, subscriptions = _a.subscriptions, subscriptionsAreLoading = _a.subscriptionsAreLoading;
|
|
23326
23519
|
// Context
|
|
23327
23520
|
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
23328
23521
|
var gap = react.useContext(SubscriptionsContext).gap;
|
|
23329
23522
|
var token = useToken();
|
|
23523
|
+
var account = useCurrentUserData(token).account;
|
|
23330
23524
|
// Queries
|
|
23331
23525
|
var _c = reactQuery.useQuery({
|
|
23332
23526
|
queryKey: common.QueryKeyFactory.default.planChangeOptionsKey({ token: token }),
|
|
23333
|
-
queryFn: function () {
|
|
23334
|
-
|
|
23527
|
+
queryFn: function () {
|
|
23528
|
+
return getPriceListChangeOptions({ apiHost: apiHost, token: token, accountCurrencyId: account === null || account === void 0 ? void 0 : account.currencyId });
|
|
23529
|
+
},
|
|
23530
|
+
enabled: Boolean(onChangePlanClick) && Boolean(account === null || account === void 0 ? void 0 : account.currencyId),
|
|
23335
23531
|
}), priceListChangeOptions = _c.data, arePriceListChangeOptionsLoading = _c.isLoading;
|
|
23336
23532
|
if (subscriptionsAreLoading ||
|
|
23337
23533
|
(Boolean(onChangePlanClick) ? arePriceListChangeOptionsLoading : false))
|
|
@@ -23339,10 +23535,10 @@ var SubscriptionsListContainer = function (_a) {
|
|
|
23339
23535
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: (subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.length) > 0 ? (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-".concat(gap, " bunny-shrink bunny-overflow-auto") }, { children: jsxRuntime.jsx(SubscriptionsList, { hideExpired: hideExpired, onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscriptions: subscriptions }) }))) : (noSubscriptionsComponent || (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-w-full" }, { children: jsxRuntime.jsx(ErrorView, { message: "You have no subscriptions with ".concat(companyName, " yet") }) })))) }));
|
|
23340
23536
|
};
|
|
23341
23537
|
|
|
23342
|
-
var Text$
|
|
23538
|
+
var Text$3 = antd.Typography.Text;
|
|
23343
23539
|
var DrawerHeader = function (_a) {
|
|
23344
23540
|
var description = _a.description, onClose = _a.onClose, title = _a.title, closeButtonClassName = _a.closeButtonClassName;
|
|
23345
|
-
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-gap-2" }, { children: [jsxRuntime.jsx(Text$
|
|
23541
|
+
return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-gap-2" }, { children: [jsxRuntime.jsx(Text$3, __assign({ className: "bunny-text-xl", style: { fontWeight: 400 } }, { children: title })), onClose ? (jsxRuntime.jsx("button", __assign({ id: "closePayment", onClick: onClose, className: closeButtonClassName }, { children: jsxRuntime.jsx(icons.CloseOutlined, {}) }))) : null] })), description && jsxRuntime.jsx("div", __assign({ className: "bunny-text-xs" }, { children: description }))] })));
|
|
23346
23542
|
};
|
|
23347
23543
|
|
|
23348
23544
|
var formatDateForApi = function (date) {
|
|
@@ -23525,13 +23721,13 @@ var QuantityInput = function (_a) {
|
|
|
23525
23721
|
}, status: isQuantityLowerThanOriginal(charge.quantity) ? 'error' : '', style: { width: '96px' }, value: value }) }));
|
|
23526
23722
|
};
|
|
23527
23723
|
|
|
23528
|
-
var Text$
|
|
23724
|
+
var Text$2 = antd.Typography.Text;
|
|
23529
23725
|
var QuantityChangeGridRow = function (_a) {
|
|
23530
23726
|
var _b;
|
|
23531
23727
|
var chargeIndex = _a.chargeIndex, editingQuote = _a.editingQuote, subscriptions = _a.subscriptions, subscriptionIndex = _a.subscriptionIndex, setEditingQuoteData = _a.setEditingQuoteData, subscription = _a.subscription, subscriptionCharge = _a.subscriptionCharge;
|
|
23532
23728
|
if (!canShowQuantitiesInput(subscriptionCharge, subscription))
|
|
23533
23729
|
return null;
|
|
23534
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$
|
|
23730
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$2, __assign({ className: "bunny-font-medium bunny-text-orange-600 bunny-col-span-full", style: { fontSize: "11px" } }, { children: subscription.plan.name })), jsxRuntime.jsx(Text$2, __assign({ className: "bunny-font-medium bunny-text-base bunny-text-gray-900" }, { children: (_b = subscriptionCharge.name) === null || _b === void 0 ? void 0 : _b.toUpperCase() })), jsxRuntime.jsx(Text$2, __assign({ className: "bunny-flex bunny-items-center bunny-justify-end bunny-font-medium bunny-text-base bunny-text-gray-900" }, { children: subscriptionCharge.quantity })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: [jsxRuntime.jsx(QuantityInput, { charge: subscriptionCharge, chargeIndex: chargeIndex, editingQuote: editingQuote, setEditingQuoteData: setEditingQuoteData, subscription: subscription, subscriptionIndex: subscriptionIndex, subscriptions: subscriptions }), jsxRuntime.jsx("div", {})] })), jsxRuntime.jsx(antd.Divider, { className: "bunny-col-span-full bunny-my-2" })] }));
|
|
23535
23731
|
};
|
|
23536
23732
|
|
|
23537
23733
|
var QuantityChangeGridTitle = function (_a) {
|
|
@@ -23593,11 +23789,11 @@ var QuantityChangeDrawerDesktop = function (_a) {
|
|
|
23593
23789
|
wrapper: {
|
|
23594
23790
|
minWidth: '600px',
|
|
23595
23791
|
},
|
|
23596
|
-
}, title: jsxRuntime.jsx(DrawerHeader, { description: QUANTITY_CHANGE_HEADER_DESCRIPTION, onClose: onClose, title: QUANTITY_CHANGE_HEADER_TITLE, closeButtonClassName: "ant-drawer-close" }) }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-pb-
|
|
23792
|
+
}, title: jsxRuntime.jsx(DrawerHeader, { description: QUANTITY_CHANGE_HEADER_DESCRIPTION, onClose: onClose, title: QUANTITY_CHANGE_HEADER_TITLE, closeButtonClassName: "ant-drawer-close" }) }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-pb-2", style: {
|
|
23597
23793
|
gridTemplateColumns: '2fr 1fr 1fr',
|
|
23598
|
-
rowGap: '0.
|
|
23794
|
+
rowGap: '0.25rem',
|
|
23599
23795
|
columnGap: '1rem',
|
|
23600
|
-
} }, { children: [jsxRuntime.jsx(QuantityChangeGridTitle, { children: "ACTIVE SUBSCRIPTIONS" }), jsxRuntime.jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "CURRENT QUANTITY" })), jsxRuntime.jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "NEW QUANTITY" })), jsxRuntime.jsx(antd.Divider, { className: "bunny-col-span-full
|
|
23796
|
+
} }, { children: [jsxRuntime.jsx(QuantityChangeGridTitle, { children: "ACTIVE SUBSCRIPTIONS" }), jsxRuntime.jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "CURRENT QUANTITY" })), jsxRuntime.jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "NEW QUANTITY" })), jsxRuntime.jsx(antd.Divider, { className: "bunny-col-span-full" }), subscriptions.map(function (subscription, index) {
|
|
23601
23797
|
var _a;
|
|
23602
23798
|
var isTrial = ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL;
|
|
23603
23799
|
return (jsxRuntime.jsx("div", __assign({ className: "bunny-contents" }, { children: subscription.charges.map(function (charge, chargeIndex) {
|
|
@@ -23642,7 +23838,7 @@ var SubscriptionsNavigation = function (_a) {
|
|
|
23642
23838
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMobile && expiredSwitchVisible && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired })), 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 })) }))] }));
|
|
23643
23839
|
};
|
|
23644
23840
|
|
|
23645
|
-
var Text = antd.Typography.Text;
|
|
23841
|
+
var Text$1 = antd.Typography.Text;
|
|
23646
23842
|
var SubscriptionsWrapper = function (_a) {
|
|
23647
23843
|
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, hideExpired = _a.hideExpired, _e = _a.hideExpiredToggle, hideExpiredToggle = _e === void 0 ? false : _e;
|
|
23648
23844
|
var defaultStyles = {
|
|
@@ -23801,7 +23997,7 @@ var Subscriptions = function (_a) {
|
|
|
23801
23997
|
setIsChangingPlan(false);
|
|
23802
23998
|
}, handlePortalErrors: handlePortalErrors }));
|
|
23803
23999
|
}
|
|
23804
|
-
return (jsxRuntime.jsxs("div", __assign({ className: className }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title: 'Subscriptions' }) : null, jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !hideExpiredToggle && (jsxRuntime.jsxs(Text, __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: { minWidth: '120px' } }, { children: [hideExpired ? 'Active subscriptions' : 'All subscriptions', isMobile && expiredSwitchVisible && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpiredState }))] }))) }) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: !hideExpiredToggle && expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpiredState, 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: setHideExpiredState, 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, storedPaymentMethod: defaultPaymentMethod })] })));
|
|
24000
|
+
return (jsxRuntime.jsxs("div", __assign({ className: className }, { children: [!hideTitle ? jsxRuntime.jsx(PageTitle, { title: 'Subscriptions' }) : null, jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !hideExpiredToggle && (jsxRuntime.jsxs(Text$1, __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: { minWidth: '120px' } }, { children: [hideExpired ? 'Active subscriptions' : 'All subscriptions', isMobile && expiredSwitchVisible && (jsxRuntime.jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpiredState }))] }))) }) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { expiredSwitchVisible: !hideExpiredToggle && expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpiredState, 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: setHideExpiredState, 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, storedPaymentMethod: defaultPaymentMethod })] })));
|
|
23805
24001
|
};
|
|
23806
24002
|
var PageHeaderWithActions = function (_a) {
|
|
23807
24003
|
var children = _a.children, title = _a.title;
|
|
@@ -23816,6 +24012,250 @@ var PageSubTitle = function (_a) {
|
|
|
23816
24012
|
return (jsxRuntime.jsx("div", __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: secondaryColor } }, { children: title })));
|
|
23817
24013
|
};
|
|
23818
24014
|
|
|
24015
|
+
var MUTATION = "\nmutation BillingDetailsUpdate(\n $attributes: BillingDetailsAttributes!) {\n billingDetailsUpdate(\n attributes: $attributes\n ) {\n billingDetails {\n billingCity\n billingContact {\n email\n }\n billingCountry\n billingState\n billingStreet\n billingZip\n name\n taxNumber\n }\n errors\n }\n }\n";
|
|
24016
|
+
var billingDetailsUpdate = function (_a) {
|
|
24017
|
+
var attributes = _a.attributes, token = _a.token, apiHost = _a.apiHost;
|
|
24018
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
24019
|
+
var vars, response, errors;
|
|
24020
|
+
var _b;
|
|
24021
|
+
return __generator(this, function (_c) {
|
|
24022
|
+
switch (_c.label) {
|
|
24023
|
+
case 0:
|
|
24024
|
+
vars = { attributes: attributes };
|
|
24025
|
+
return [4 /*yield*/, gqlRequest({
|
|
24026
|
+
query: MUTATION,
|
|
24027
|
+
token: token,
|
|
24028
|
+
vars: vars,
|
|
24029
|
+
apiHost: apiHost,
|
|
24030
|
+
})];
|
|
24031
|
+
case 1:
|
|
24032
|
+
response = _c.sent();
|
|
24033
|
+
errors = (_b = response === null || response === void 0 ? void 0 : response.billingDetailsUpdate) === null || _b === void 0 ? void 0 : _b.errors;
|
|
24034
|
+
if (errors)
|
|
24035
|
+
throw errors;
|
|
24036
|
+
return [2 /*return*/, response.billingDetailsUpdate];
|
|
24037
|
+
}
|
|
24038
|
+
});
|
|
24039
|
+
});
|
|
24040
|
+
};
|
|
24041
|
+
|
|
24042
|
+
// TODO: move this to common
|
|
24043
|
+
var billingDetailsQuery = function () {
|
|
24044
|
+
return "\nquery BillingDetails {\n billingDetails {\n billingCity\n billingContact {\n email\n }\n billingCountry\n billingState\n billingStreet\n billingZip\n name\n taxNumber\n currency {\n id\n }\n }\n}";
|
|
24045
|
+
};
|
|
24046
|
+
var getBillingDetails = function (_a) {
|
|
24047
|
+
var token = _a.token, apiHost = _a.apiHost;
|
|
24048
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
24049
|
+
var response;
|
|
24050
|
+
var _b;
|
|
24051
|
+
return __generator(this, function (_c) {
|
|
24052
|
+
switch (_c.label) {
|
|
24053
|
+
case 0: return [4 /*yield*/, gqlRequest({
|
|
24054
|
+
query: billingDetailsQuery(),
|
|
24055
|
+
token: token,
|
|
24056
|
+
apiHost: apiHost,
|
|
24057
|
+
})];
|
|
24058
|
+
case 1:
|
|
24059
|
+
response = _c.sent();
|
|
24060
|
+
if (response === null || response === void 0 ? void 0 : response.errors) {
|
|
24061
|
+
throw new Error((_b = response === null || response === void 0 ? void 0 : response.errors[0]) === null || _b === void 0 ? void 0 : _b.message);
|
|
24062
|
+
}
|
|
24063
|
+
return [2 /*return*/, response === null || response === void 0 ? void 0 : response.billingDetails];
|
|
24064
|
+
}
|
|
24065
|
+
});
|
|
24066
|
+
});
|
|
24067
|
+
};
|
|
24068
|
+
|
|
24069
|
+
var Text = antd.Typography.Text;
|
|
24070
|
+
function BillingDetailsSection(_a) {
|
|
24071
|
+
var _this = this;
|
|
24072
|
+
var hidePaymentMethodForm = _a.hidePaymentMethodForm, countryListFilter = _a.countryListFilter;
|
|
24073
|
+
// State
|
|
24074
|
+
var _b = react.useState(false), isFormEdited = _b[0], setIsFormEdited = _b[1];
|
|
24075
|
+
var _c = react.useState(false), formIsValid = _c[0], setFormIsValid = _c[1];
|
|
24076
|
+
var form = antd.Form.useForm()[0];
|
|
24077
|
+
var values = antd.Form.useWatch([], form);
|
|
24078
|
+
// Context
|
|
24079
|
+
var apiHost = react.useContext(BunnyContext).apiHost;
|
|
24080
|
+
var token = useToken();
|
|
24081
|
+
// Hooks
|
|
24082
|
+
var isMobile = common.useIsMobile();
|
|
24083
|
+
var queryClient = reactQuery.useQueryClient();
|
|
24084
|
+
var showErrorNotification = common.useErrorNotification();
|
|
24085
|
+
var showSuccessNotification = common.useSuccessNotification();
|
|
24086
|
+
// Queries
|
|
24087
|
+
var _d = reactQuery.useQuery({
|
|
24088
|
+
queryKey: common.QueryKeyFactory.default.billingDetailsKey({ token: token }),
|
|
24089
|
+
queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
|
|
24090
|
+
}), billingDetails = _d.data, isLoadingBillingDetails = _d.isLoading;
|
|
24091
|
+
var _e = reactQuery.useMutation({
|
|
24092
|
+
mutationFn: function (changedFormData) { return __awaiter(_this, void 0, void 0, function () {
|
|
24093
|
+
var updatedBillingDetails;
|
|
24094
|
+
return __generator(this, function (_a) {
|
|
24095
|
+
switch (_a.label) {
|
|
24096
|
+
case 0: return [4 /*yield*/, billingDetailsUpdate({
|
|
24097
|
+
attributes: {
|
|
24098
|
+
name: changedFormData.name,
|
|
24099
|
+
billingStreet: changedFormData.billingStreet,
|
|
24100
|
+
billingCity: changedFormData.billingCity,
|
|
24101
|
+
billingZip: changedFormData.billingZip,
|
|
24102
|
+
billingState: changedFormData.billingState,
|
|
24103
|
+
billingCountry: changedFormData.billingCountry,
|
|
24104
|
+
billingContactEmail: changedFormData.billingContactEmail,
|
|
24105
|
+
taxNumber: changedFormData.taxNumber,
|
|
24106
|
+
},
|
|
24107
|
+
token: token,
|
|
24108
|
+
apiHost: apiHost,
|
|
24109
|
+
})];
|
|
24110
|
+
case 1:
|
|
24111
|
+
updatedBillingDetails = _a.sent();
|
|
24112
|
+
queryClient.setQueryData(common.QueryKeyFactory.default.billingDetailsKey({ token: token }), function (old) {
|
|
24113
|
+
return __assign(__assign({}, old), updatedBillingDetails.billingDetails);
|
|
24114
|
+
});
|
|
24115
|
+
return [2 /*return*/, updatedBillingDetails];
|
|
24116
|
+
}
|
|
24117
|
+
});
|
|
24118
|
+
}); },
|
|
24119
|
+
onSuccess: function () {
|
|
24120
|
+
showSuccessNotification('Your account details have been saved');
|
|
24121
|
+
queryClient.invalidateQueries({
|
|
24122
|
+
queryKey: common.QueryKeyFactory.default.taxationRequiredAccountFieldsKey({
|
|
24123
|
+
token: token,
|
|
24124
|
+
}),
|
|
24125
|
+
});
|
|
24126
|
+
},
|
|
24127
|
+
}), updateBillingDetails = _e.mutate, isUpdatingBillingDetails = _e.isPending;
|
|
24128
|
+
// Set form values when billing details are loaded
|
|
24129
|
+
react.useEffect(function () {
|
|
24130
|
+
var _a;
|
|
24131
|
+
if (billingDetails) {
|
|
24132
|
+
form.setFieldsValue({
|
|
24133
|
+
billingStreet: billingDetails.billingStreet,
|
|
24134
|
+
billingCity: billingDetails.billingCity,
|
|
24135
|
+
billingZip: billingDetails.billingZip,
|
|
24136
|
+
billingState: billingDetails.billingState,
|
|
24137
|
+
billingCountry: billingDetails.billingCountry,
|
|
24138
|
+
billingContactEmail: (_a = billingDetails.billingContact) === null || _a === void 0 ? void 0 : _a.email,
|
|
24139
|
+
taxNumber: billingDetails.taxNumber,
|
|
24140
|
+
});
|
|
24141
|
+
}
|
|
24142
|
+
}, [billingDetails]);
|
|
24143
|
+
react.useEffect(function () {
|
|
24144
|
+
form
|
|
24145
|
+
.validateFields({ validateOnly: true })
|
|
24146
|
+
.then(function () { return setFormIsValid(true); })
|
|
24147
|
+
.catch(function () { return setFormIsValid(false); });
|
|
24148
|
+
var isFormEdited = function () {
|
|
24149
|
+
var _a;
|
|
24150
|
+
if (!billingDetails)
|
|
24151
|
+
return false;
|
|
24152
|
+
var currentValues = form.getFieldsValue();
|
|
24153
|
+
var accountValues = {
|
|
24154
|
+
billingStreet: billingDetails.billingStreet,
|
|
24155
|
+
billingCity: billingDetails.billingCity,
|
|
24156
|
+
billingZip: billingDetails.billingZip,
|
|
24157
|
+
billingState: billingDetails.billingState,
|
|
24158
|
+
billingCountry: billingDetails.billingCountry,
|
|
24159
|
+
billingContactEmail: (_a = billingDetails.billingContact) === null || _a === void 0 ? void 0 : _a.email,
|
|
24160
|
+
taxNumber: billingDetails.taxNumber,
|
|
24161
|
+
};
|
|
24162
|
+
return Object.keys(currentValues).some(function (key) {
|
|
24163
|
+
var value = accountValues[key];
|
|
24164
|
+
return currentValues[key] !== value;
|
|
24165
|
+
});
|
|
24166
|
+
};
|
|
24167
|
+
setIsFormEdited(isFormEdited());
|
|
24168
|
+
}, [form, values, billingDetails]);
|
|
24169
|
+
// Validate form fields when isFormEdited changes
|
|
24170
|
+
react.useEffect(function () {
|
|
24171
|
+
var validateOnly = isFormEdited ? false : true;
|
|
24172
|
+
form.validateFields({ validateOnly: validateOnly });
|
|
24173
|
+
}, [isFormEdited]);
|
|
24174
|
+
var saveBillingDetails = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
24175
|
+
var _this = this;
|
|
24176
|
+
return __generator(this, function (_a) {
|
|
24177
|
+
form.validateFields({ validateOnly: false }).then(function () { return __awaiter(_this, void 0, void 0, function () {
|
|
24178
|
+
var error_1;
|
|
24179
|
+
return __generator(this, function (_a) {
|
|
24180
|
+
switch (_a.label) {
|
|
24181
|
+
case 0:
|
|
24182
|
+
_a.trys.push([0, 2, 3, 4]);
|
|
24183
|
+
return [4 /*yield*/, form.validateFields()];
|
|
24184
|
+
case 1:
|
|
24185
|
+
_a.sent();
|
|
24186
|
+
updateBillingDetails(form.getFieldsValue());
|
|
24187
|
+
return [3 /*break*/, 4];
|
|
24188
|
+
case 2:
|
|
24189
|
+
error_1 = _a.sent();
|
|
24190
|
+
if (error_1 instanceof Error) {
|
|
24191
|
+
showErrorNotification('Failed to update account', error_1.message);
|
|
24192
|
+
}
|
|
24193
|
+
else {
|
|
24194
|
+
showErrorNotification('Please fill out all required fields');
|
|
24195
|
+
}
|
|
24196
|
+
return [3 /*break*/, 4];
|
|
24197
|
+
case 3:
|
|
24198
|
+
setIsFormEdited(false);
|
|
24199
|
+
return [7 /*endfinally*/];
|
|
24200
|
+
case 4: return [2 /*return*/];
|
|
24201
|
+
}
|
|
24202
|
+
});
|
|
24203
|
+
}); });
|
|
24204
|
+
return [2 /*return*/];
|
|
24205
|
+
});
|
|
24206
|
+
}); };
|
|
24207
|
+
var filteredCountryList = react.useMemo(function () {
|
|
24208
|
+
return countryListFilter ? common.Lists.COUNTRY_LIST.filter(countryListFilter) : common.Lists.COUNTRY_LIST;
|
|
24209
|
+
}, [countryListFilter]);
|
|
24210
|
+
return (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile || hidePaymentMethodForm ? 'bunny-w-full' : 'bunny-w-1/2') }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-px-4" }, { children: [jsxRuntime.jsxs(antd.Skeleton, __assign({ loading: isLoadingBillingDetails }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-mb-2" }, { children: jsxRuntime.jsx(Text, __assign({ className: "bunny-font-medium bunny-text-lg" }, { children: (billingDetails === null || billingDetails === void 0 ? void 0 : billingDetails.name) || 'No company name' })) })), jsxRuntime.jsxs(antd.Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", form: form, layout: "vertical", disabled: isUpdatingBillingDetails, autoComplete: "off" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Street address", name: "billingStreet", rules: [{ required: true, message: 'Street address is required' }] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-gap-4" }, { children: [jsxRuntime.jsx(antd.Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: 'City is required' }], className: "bunny-flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: 'Zipcode is required' }], className: "bunny-flex-1" }, { children: jsxRuntime.jsx(antd.Input, {}) }))] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'bunny-flex-row bunny-pb-2' : 'bunny-flex-row', " bunny-gap-4") }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex-1 bunny-w-1/2" }, { children: jsxRuntime.jsx(antd.Form.Item, __assign({ label: "State", name: "billingState", rules: [
|
|
24211
|
+
{
|
|
24212
|
+
required: false,
|
|
24213
|
+
},
|
|
24214
|
+
] }, { children: jsxRuntime.jsx(antd.Input, {}) })) })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex-1 bunny-w-1/2" }, { children: jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Country", name: "billingCountry", rules: [{ required: true, message: 'Country is required' }] }, { children: jsxRuntime.jsx(antd.Select, { className: "bunny-w-full", options: filteredCountryList, placeholder: "Select a country", popupMatchSelectWidth: false, showSearch: true, filterOption: function (input, option) {
|
|
24215
|
+
var _a, _b;
|
|
24216
|
+
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : '').toLowerCase().includes(input.toLowerCase()) ||
|
|
24217
|
+
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b : '').toLowerCase().includes(input.toLowerCase());
|
|
24218
|
+
} }) })) }))] })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Email", name: "billingContactEmail", rules: [
|
|
24219
|
+
{
|
|
24220
|
+
required: true,
|
|
24221
|
+
message: 'Email is required',
|
|
24222
|
+
type: 'email',
|
|
24223
|
+
},
|
|
24224
|
+
] }, { children: jsxRuntime.jsx(antd.Input, {}) })), jsxRuntime.jsx(antd.Form.Item, __assign({ label: "Tax ID", name: "taxNumber", tooltip: "Tax ID will be printed on quotes and invoices below the account's address", rules: [{ required: false }] }, { children: jsxRuntime.jsx(antd.Input, {}) }))] }))] })), jsxRuntime.jsx(antd.Button, __assign({ disabled: !isFormEdited || isUpdatingBillingDetails || !formIsValid, className: "bunny-w-full bunny-mt-4", type: "primary", onClick: saveBillingDetails }, { children: "Save" }))] })) })));
|
|
24225
|
+
}
|
|
24226
|
+
|
|
24227
|
+
var BillingDetails = function (_a) {
|
|
24228
|
+
var className = _a.className, countryListFilter = _a.countryListFilter, _b = _a.hideBillingDetailsForm, hideBillingDetailsForm = _b === void 0 ? false : _b, _c = _a.hidePaymentMethodForm, hidePaymentMethodForm = _c === void 0 ? false : _c, _d = _a.isCardEnabled, isCardEnabled = _d === void 0 ? true : _d, _e = _a.isUpgradeFromTrial, isUpgradeFromTrial = _e === void 0 ? false : _e, _f = _a.shadow, shadow = _f === void 0 ? 'shadow-md' : _f, onSavePaymentMethod = _a.onSavePaymentMethod;
|
|
24229
|
+
// Hooks
|
|
24230
|
+
var isMobile = common.useIsMobile();
|
|
24231
|
+
return (jsxRuntime.jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-py-2 bunny-my-2 ".concat(isMobile ? 'bunny-flex-col bunny-space-y-4' : 'bunny-flex-row', " bunny-gap-4") }, { children: [!hideBillingDetailsForm ? (jsxRuntime.jsx(BillingDetailsSection, { hidePaymentMethodForm: hidePaymentMethodForm, countryListFilter: countryListFilter })) : null, !hideBillingDetailsForm && !hidePaymentMethodForm ? jsxRuntime.jsx(ResponsiveDivider, {}) : null, !hidePaymentMethodForm ? (jsxRuntime.jsx(PaymentFormSection, { hideBillingDetailsForm: hideBillingDetailsForm, isUpgradeFromTrial: isUpgradeFromTrial, onSavePaymentMethod: onSavePaymentMethod })) : null] })) })));
|
|
24232
|
+
};
|
|
24233
|
+
var WrapperComponent = function (_a) {
|
|
24234
|
+
var children = _a.children, isCardEnabled = _a.isCardEnabled, shadow = _a.shadow, className = _a.className;
|
|
24235
|
+
return (jsxRuntime.jsx("div", __assign({ className: "".concat(className) }, { children: isCardEnabled ? jsxRuntime.jsx(Card, __assign({ className: "".concat(shadow) }, { children: children })) : jsxRuntime.jsx("div", { children: children }) })));
|
|
24236
|
+
};
|
|
24237
|
+
var ResponsiveDivider = function () {
|
|
24238
|
+
var isMobile = common.useIsMobile();
|
|
24239
|
+
return isMobile ? (jsxRuntime.jsx("div", __assign({ className: "bunny-mx-4" }, { children: jsxRuntime.jsx(antd.Divider, {}) }))) : (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(antd.Divider, { className: "bunny-h-full", type: "vertical" }) }));
|
|
24240
|
+
};
|
|
24241
|
+
var PaymentFormSection = function (_a) {
|
|
24242
|
+
var hideBillingDetailsForm = _a.hideBillingDetailsForm, isUpgradeFromTrial = _a.isUpgradeFromTrial, onSavePaymentMethod = _a.onSavePaymentMethod;
|
|
24243
|
+
var isMobile = common.useIsMobile();
|
|
24244
|
+
var onTokenExpired = react.useContext(BunnyContext).onTokenExpired;
|
|
24245
|
+
var handleAllErrorFormats = common.useAllErrorFormats(onTokenExpired);
|
|
24246
|
+
var showSuccessNotification = common.useSuccessNotification();
|
|
24247
|
+
return (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile || hideBillingDetailsForm ? 'bunny-w-full' : 'bunny-w-1/2 bunny-pt-4', " bunny-flex bunny-justify-center") }, { children: jsxRuntime.jsx(PaymentForm, { onFail: function (error) {
|
|
24248
|
+
handleAllErrorFormats(error);
|
|
24249
|
+
}, onSavePaymentMethod: function (response) {
|
|
24250
|
+
showSuccessNotification(isUpgradeFromTrial
|
|
24251
|
+
? 'Payment method saved! Your trial will automatically convert to a paid subscription.'
|
|
24252
|
+
: 'Payment method saved successfully!');
|
|
24253
|
+
// TODO: onSavePaymentMethod(response: any) should be cleaned up to have a response type (not any)
|
|
24254
|
+
// and work with both stripe and demo pay requests
|
|
24255
|
+
onSavePaymentMethod === null || onSavePaymentMethod === void 0 ? void 0 : onSavePaymentMethod(response);
|
|
24256
|
+
} }) })));
|
|
24257
|
+
};
|
|
24258
|
+
|
|
23819
24259
|
exports.BillingDetails = BillingDetails;
|
|
23820
24260
|
exports.BunnyProvider = BunnyProvider;
|
|
23821
24261
|
exports.Footer = Footer;
|