@bunnyapp/components 1.5.0-beta.13 → 1.5.0-beta.15

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.
Files changed (66) hide show
  1. package/dist/cjs/index.js +500 -474
  2. package/dist/cjs/src/components/Invoice/InvoiceQuoteView.d.ts +1 -1
  3. package/dist/cjs/src/components/PaymentForm/Stripe/stripeUtils.d.ts +2 -6
  4. package/dist/cjs/src/components/PaymentForm/hooks/useHasActiveSubscription.d.ts +1 -1
  5. package/dist/cjs/src/components/Subscriptions/AddonSubscriptionCards.d.ts +2 -2
  6. package/dist/cjs/src/components/Subscriptions/QuantityDrawerContainer.d.ts +2 -2
  7. package/dist/cjs/src/components/Subscriptions/Subscriptions.d.ts +3 -3
  8. package/dist/cjs/src/components/Subscriptions/SubscriptionsListContainer.d.ts +2 -2
  9. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/PlanPicker.d.ts +2 -1
  10. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanFeatures.d.ts +3 -3
  11. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PriceListGridDesktop.d.ts +6 -0
  12. package/dist/{esm/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop → cjs/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons}/FeatureAddons.d.ts +2 -4
  13. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons/FeatureAddonsList.d.ts +5 -0
  14. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/BackButton.d.ts +4 -0
  15. package/dist/cjs/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/PriceListSelector.d.ts +2 -1
  16. package/dist/cjs/src/components/Subscriptions/Upgrade/Upgrade.d.ts +2 -1
  17. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/QuantityChangeGridRow.d.ts +2 -2
  18. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/QuantityChangeGridTitle.d.ts +2 -2
  19. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/QuantityInput.d.ts +2 -2
  20. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/QuoteChangeSummarySection.d.ts +2 -1
  21. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/quantityChangeDrawerDesktop/QuantityChangeDrawerDesktop.d.ts +0 -2
  22. package/dist/cjs/src/components/Subscriptions/subscriptionsList/ShowInactiveToggle.d.ts +5 -0
  23. package/dist/cjs/src/components/Subscriptions/subscriptionsList/SubscriptionsList.d.ts +2 -2
  24. package/dist/cjs/src/components/Subscriptions/subscriptionsList/SubscriptionsNavigation.d.ts +4 -4
  25. package/dist/cjs/src/components/Subscriptions/subscriptionsList/subscriptionUtils.d.ts +1 -0
  26. package/dist/cjs/src/contexts/SubscriptionsContext.d.ts +1 -1
  27. package/dist/cjs/src/graphql/QuoteRequests.d.ts +1 -1
  28. package/dist/cjs/src/graphql/queries/getSubscriptions.d.ts +2 -1
  29. package/dist/cjs/src/utils/pricePickerUtils.d.ts +1 -1
  30. package/dist/esm/index.js +499 -473
  31. package/dist/esm/src/components/Invoice/InvoiceQuoteView.d.ts +1 -1
  32. package/dist/esm/src/components/PaymentForm/Stripe/stripeUtils.d.ts +2 -6
  33. package/dist/esm/src/components/PaymentForm/hooks/useHasActiveSubscription.d.ts +1 -1
  34. package/dist/esm/src/components/Subscriptions/AddonSubscriptionCards.d.ts +2 -2
  35. package/dist/esm/src/components/Subscriptions/QuantityDrawerContainer.d.ts +2 -2
  36. package/dist/esm/src/components/Subscriptions/Subscriptions.d.ts +3 -3
  37. package/dist/esm/src/components/Subscriptions/SubscriptionsListContainer.d.ts +2 -2
  38. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/PlanPicker.d.ts +2 -1
  39. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanFeatures.d.ts +3 -3
  40. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PriceListGridDesktop.d.ts +6 -0
  41. package/dist/{cjs/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop → esm/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons}/FeatureAddons.d.ts +2 -4
  42. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons/FeatureAddonsList.d.ts +5 -0
  43. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/BackButton.d.ts +4 -0
  44. package/dist/esm/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/PriceListSelector.d.ts +2 -1
  45. package/dist/esm/src/components/Subscriptions/Upgrade/Upgrade.d.ts +2 -1
  46. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/QuantityChangeGridRow.d.ts +2 -2
  47. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/QuantityChangeGridTitle.d.ts +2 -2
  48. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/QuantityInput.d.ts +2 -2
  49. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/QuoteChangeSummarySection.d.ts +2 -1
  50. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/quantityChangeDrawerDesktop/QuantityChangeDrawerDesktop.d.ts +0 -2
  51. package/dist/esm/src/components/Subscriptions/subscriptionsList/ShowInactiveToggle.d.ts +5 -0
  52. package/dist/esm/src/components/Subscriptions/subscriptionsList/SubscriptionsList.d.ts +2 -2
  53. package/dist/esm/src/components/Subscriptions/subscriptionsList/SubscriptionsNavigation.d.ts +4 -4
  54. package/dist/esm/src/components/Subscriptions/subscriptionsList/subscriptionUtils.d.ts +1 -0
  55. package/dist/esm/src/contexts/SubscriptionsContext.d.ts +1 -1
  56. package/dist/esm/src/graphql/QuoteRequests.d.ts +1 -1
  57. package/dist/esm/src/graphql/queries/getSubscriptions.d.ts +2 -1
  58. package/dist/esm/src/utils/pricePickerUtils.d.ts +1 -1
  59. package/dist/index.d.ts +5 -4
  60. package/package.json +2 -2
  61. package/dist/cjs/src/components/PageWrapper.d.ts +0 -1
  62. package/dist/cjs/src/components/Subscriptions/PageTitle.d.ts +0 -5
  63. package/dist/cjs/src/components/Subscriptions/subscriptionsList/HideExpiredToggle.d.ts +0 -5
  64. package/dist/esm/src/components/PageWrapper.d.ts +0 -1
  65. package/dist/esm/src/components/Subscriptions/PageTitle.d.ts +0 -5
  66. package/dist/esm/src/components/Subscriptions/subscriptionsList/HideExpiredToggle.d.ts +0 -5
package/dist/cjs/index.js CHANGED
@@ -4,29 +4,29 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var react = require('react');
7
- var interweave = require('interweave');
8
- var antd = require('antd');
9
7
  var icons = require('@ant-design/icons');
10
- var styled = require('styled-components');
11
8
  var common = require('@bunnyapp/common');
9
+ var antd = require('antd');
10
+ var interweave = require('interweave');
11
+ var request = require('graphql-request');
12
12
  var reactQuery = require('@tanstack/react-query');
13
13
  var theme = require('antd/lib/theme/index.js');
14
14
  var recoil = require('recoil');
15
- var request = require('graphql-request');
15
+ var styled = require('styled-components');
16
16
  var react$1 = require('@pdf-viewer/react');
17
+ var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
18
+ var reactFontawesome = require('@fortawesome/react-fontawesome');
17
19
  var reactStripeJs = require('@stripe/react-stripe-js');
18
20
  var index_js = require('@stripe/stripe-js/pure/index.js');
19
21
  var recharts = require('recharts');
20
22
  var lodashEs = require('lodash-es');
21
23
  var pkg = require('pluralize');
22
- var reactFontawesome = require('@fortawesome/react-fontawesome');
23
- var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
24
24
 
25
25
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
26
26
 
27
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
28
- var theme__default = /*#__PURE__*/_interopDefaultLegacy(theme);
29
27
  var request__default = /*#__PURE__*/_interopDefaultLegacy(request);
28
+ var theme__default = /*#__PURE__*/_interopDefaultLegacy(theme);
29
+ var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
30
30
  var pkg__default = /*#__PURE__*/_interopDefaultLegacy(pkg);
31
31
 
32
32
  function styleInject(css, ref) {
@@ -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-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-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-transparent {\n background-color: transparent;\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-12 {\n padding-left: 3rem;\n padding-right: 3rem;\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-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, 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-my-0 {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.bunny-mb-0 {\n margin-bottom: 0px;\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-mt-0 {\n margin-top: 0px;\n}\n.bunny-box-border {\n box-sizing: border-box;\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-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-overflow-x-hidden {\n overflow-x: hidden;\n}\n.bunny-whitespace-nowrap {\n white-space: nowrap;\n}\n.bunny-text-nowrap {\n text-wrap: 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-transparent {\n background-color: transparent;\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-bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / 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-12 {\n padding-left: 3rem;\n padding-right: 3rem;\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-1 {\n padding-left: 0.25rem;\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-pb-8 {\n padding-bottom: 2rem;\n}\n.bunny-pt-3 {\n padding-top: 0.75rem;\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-start {\n text-align: start;\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-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / 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-text-slate-300 {\n --tw-text-opacity: 1;\n color: rgb(203 213 225 / 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, 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-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
  /******************************************************************************
@@ -142,19 +142,8 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
142
142
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
143
143
  };
144
144
 
145
- var defaultStyled = typeof styled__default["default"] === "function" ? styled__default["default"] : styled__default["default"].default;
146
- // !!! This is a workaround to avoid the issue with styled-components not supporting ESM
147
- // Workaround from https://github.com/styled-components/styled-components/issues/3437#issuecomment-1103085056
148
-
149
- var BrandContext = react.createContext({
150
- accentColor: common.DEFAULT_ACCENT_COLOR,
151
- brandColor: common.DEFAULT_BRAND_COLOR,
152
- secondaryColor: common.DEFAULT_SECONDARY_COLOR,
153
- topNavImageUrl: common.DEFAULT_TOP_NAV_IMAGE_URL,
154
- });
155
-
156
145
  // This will be replaced at build time by rollup-plugin-replace
157
- var PACKAGE_VERSION = '1.5.0-beta.12';
146
+ var PACKAGE_VERSION = '1.5.0-beta.14';
158
147
  var createRequestHeaders = function (token) {
159
148
  var headers = createClientDevHeaders({ token: token });
160
149
  // Add the components version header
@@ -216,6 +205,73 @@ var devHeaders = function () {
216
205
  var TIME_TRAVEL_DATE = 'timeTravelDate';
217
206
  var TIME_TRAVEL_HEADER = 'X-Bunny-Time-Travel';
218
207
 
208
+ var useAjax = function (onError) {
209
+ return function (url, method, callback, token, bodyData) { return __awaiter(void 0, void 0, void 0, function () {
210
+ var response;
211
+ return __generator(this, function (_a) {
212
+ switch (_a.label) {
213
+ case 0: return [4 /*yield*/, fetch(url, {
214
+ method: method,
215
+ body: bodyData,
216
+ headers: createClientDevHeaders({ token: token }),
217
+ })];
218
+ case 1:
219
+ response = _a.sent();
220
+ if (response.status !== 200 && response.status !== 201) {
221
+ return [2 /*return*/, response.json().then(function (data) {
222
+ if (response.status === 401) {
223
+ console.error('expired token');
224
+ onError === null || onError === void 0 ? void 0 : onError('expired token');
225
+ }
226
+ else {
227
+ throw new Error(data === null || data === void 0 ? void 0 : data.message);
228
+ }
229
+ return;
230
+ })];
231
+ }
232
+ return [2 /*return*/, callback(response)];
233
+ }
234
+ });
235
+ }); };
236
+ };
237
+ var useDownloadFile = function (id, onError) {
238
+ var ajax = useAjax(onError);
239
+ return function (url, token) {
240
+ return ajax(url + (id ? "?id=".concat(id) : ''), 'GET', function (rsp) { return __awaiter(void 0, void 0, void 0, function () {
241
+ var blob, file, contentDisposition, anchor, filenameRegex, matches;
242
+ return __generator(this, function (_a) {
243
+ switch (_a.label) {
244
+ case 0: return [4 /*yield*/, rsp.blob()];
245
+ case 1:
246
+ blob = _a.sent();
247
+ file = window.URL.createObjectURL(blob);
248
+ contentDisposition = rsp.headers.get('content-disposition');
249
+ anchor = document.createElement('a');
250
+ anchor.href = file;
251
+ if (contentDisposition && contentDisposition.indexOf('attachment') !== -1) {
252
+ filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
253
+ matches = filenameRegex.exec(contentDisposition);
254
+ if (matches != null && matches[1]) {
255
+ anchor.setAttribute('download', matches[1].replace(/['"]/g, ''));
256
+ }
257
+ }
258
+ anchor.click();
259
+ return [2 /*return*/];
260
+ }
261
+ });
262
+ }); }, token);
263
+ };
264
+ };
265
+
266
+ var InvoiceQuoteContext = react.createContext({});
267
+
268
+ var BrandContext = react.createContext({
269
+ accentColor: common.DEFAULT_ACCENT_COLOR,
270
+ brandColor: common.DEFAULT_BRAND_COLOR,
271
+ secondaryColor: common.DEFAULT_SECONDARY_COLOR,
272
+ topNavImageUrl: common.DEFAULT_TOP_NAV_IMAGE_URL,
273
+ });
274
+
219
275
  var MUTATION$c = "\n query entityBranding {\n entityBranding {\n accentColor\n brandColor\n topNavImageUrl\n }\n }\n";
220
276
  var getBranding = function (_a) {
221
277
  var token = _a.token, apiHost = _a.apiHost;
@@ -288,97 +344,44 @@ function ContextualWrapper(_a) {
288
344
  topNavImageUrl: topNavImageUrl,
289
345
  };
290
346
  }, [branding, isMobile]);
291
- return (jsxRuntime.jsx(recoil.RecoilRoot, { children: jsxRuntime.jsx(BrandContext.Provider, __assign({ value: entityBranding }, { children: jsxRuntime.jsx(antd.ConfigProvider, __assign({ theme: __assign({ algorithm: darkMode ? theme__default["default"].darkAlgorithm : theme__default["default"].defaultAlgorithm, token: {
292
- borderRadius: 4,
293
- colorPrimary: entityBranding.brandColor,
294
- colorLink: entityBranding.brandColor,
295
- colorLinkActive: entityBranding.brandColor,
296
- colorLinkHover: entityBranding.brandColor,
297
- fontFamily: 'inherit',
298
- colorBorder: common.INPUT_BORDER_COLOR,
299
- lineHeight: 1,
300
- fontSize: 14,
301
- }, components: {
302
- Button: {
303
- defaultShadow: 'none',
304
- boxShadowSecondary: 'none',
305
- fontWeight: 'normal',
306
- contentFontSizeLG: 14,
307
- colorBgContainerDisabled: darkMode ? 'var(--row-background-dark)' : '#eef0f2',
308
- borderColorDisabled: darkMode ? 'var(--row-background-dark)' : '#eef0f2',
309
- },
310
- Drawer: {
311
- colorBgElevated: darkMode ? 'var(--row-background-dark)' : common.SLATE_50,
312
- },
313
- Divider: {
314
- colorSplit: darkMode ? common.SLATE_400 : common.SLATE_200,
315
- },
316
- Form: {
317
- itemMarginBottom: 0,
318
- verticalLabelPadding: '4px',
319
- },
320
- } }, configProviderProps) }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-components bunny-contents" }, { children: children })) })) })) }));
321
- }
322
-
323
- var useAjax = function (onError) {
324
- return function (url, method, callback, token, bodyData) { return __awaiter(void 0, void 0, void 0, function () {
325
- var response;
326
- return __generator(this, function (_a) {
327
- switch (_a.label) {
328
- case 0: return [4 /*yield*/, fetch(url, {
329
- method: method,
330
- body: bodyData,
331
- headers: createClientDevHeaders({ token: token }),
332
- })];
333
- case 1:
334
- response = _a.sent();
335
- if (response.status !== 200 && response.status !== 201) {
336
- return [2 /*return*/, response.json().then(function (data) {
337
- if (response.status === 401) {
338
- console.error('expired token');
339
- onError === null || onError === void 0 ? void 0 : onError('expired token');
340
- }
341
- else {
342
- throw new Error(data === null || data === void 0 ? void 0 : data.message);
343
- }
344
- return;
345
- })];
346
- }
347
- return [2 /*return*/, callback(response)];
348
- }
349
- });
350
- }); };
351
- };
352
- var useDownloadFile = function (id, onError) {
353
- var ajax = useAjax(onError);
354
- return function (url, token) {
355
- return ajax(url + (id ? "?id=".concat(id) : ''), 'GET', function (rsp) { return __awaiter(void 0, void 0, void 0, function () {
356
- var blob, file, contentDisposition, anchor, filenameRegex, matches;
357
- return __generator(this, function (_a) {
358
- switch (_a.label) {
359
- case 0: return [4 /*yield*/, rsp.blob()];
360
- case 1:
361
- blob = _a.sent();
362
- file = window.URL.createObjectURL(blob);
363
- contentDisposition = rsp.headers.get('content-disposition');
364
- anchor = document.createElement('a');
365
- anchor.href = file;
366
- if (contentDisposition && contentDisposition.indexOf('attachment') !== -1) {
367
- filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
368
- matches = filenameRegex.exec(contentDisposition);
369
- if (matches != null && matches[1]) {
370
- anchor.setAttribute('download', matches[1].replace(/['"]/g, ''));
371
- }
372
- }
373
- anchor.click();
374
- return [2 /*return*/];
375
- }
376
- });
377
- }); }, token);
347
+ var defaultTheme = {
348
+ algorithm: darkMode ? theme__default["default"].darkAlgorithm : theme__default["default"].defaultAlgorithm,
349
+ token: {
350
+ borderRadius: 4,
351
+ colorPrimary: entityBranding.brandColor,
352
+ colorLink: entityBranding.brandColor,
353
+ colorLinkActive: entityBranding.brandColor,
354
+ colorLinkHover: entityBranding.brandColor,
355
+ fontFamily: 'Inter',
356
+ colorBorder: common.INPUT_BORDER_COLOR,
357
+ lineHeight: 1,
358
+ fontSize: 14,
359
+ },
360
+ components: {
361
+ Button: {
362
+ defaultShadow: 'none',
363
+ boxShadowSecondary: 'none',
364
+ fontWeight: 'normal',
365
+ contentFontSizeLG: 14,
366
+ colorBgContainerDisabled: darkMode ? 'var(--row-background-dark)' : '#eef0f2',
367
+ borderColorDisabled: darkMode ? 'var(--row-background-dark)' : '#eef0f2',
368
+ },
369
+ Drawer: {
370
+ colorBgElevated: darkMode ? 'var(--row-background-dark)' : common.SLATE_50,
371
+ },
372
+ Divider: {
373
+ colorSplit: darkMode ? common.SLATE_400 : common.SLATE_200,
374
+ },
375
+ Form: {
376
+ itemMarginBottom: 0,
377
+ verticalLabelPadding: '4px',
378
+ },
379
+ },
378
380
  };
379
- };
380
-
381
- var InvoiceQuoteContext = react.createContext({});
381
+ // Deep merge the theme config
382
+ var mergedTheme = __assign(__assign(__assign({}, defaultTheme), configProviderProps), { token: __assign(__assign({}, defaultTheme.token), configProviderProps === null || configProviderProps === void 0 ? void 0 : configProviderProps.token), components: __assign(__assign({}, defaultTheme.components), configProviderProps === null || configProviderProps === void 0 ? void 0 : configProviderProps.components) });
383
+ return (jsxRuntime.jsx(recoil.RecoilRoot, { children: jsxRuntime.jsx(BrandContext.Provider, __assign({ value: entityBranding }, { children: jsxRuntime.jsx(antd.ConfigProvider, __assign({ theme: mergedTheme }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-components bunny-contents" }, { children: children })) })) })) }));
384
+ }
382
385
 
383
386
  var PaymentContext = react.createContext({});
384
387
 
@@ -390,6 +393,10 @@ function useToken() {
390
393
  return overrideToken || tokenFromContext;
391
394
  }
392
395
 
396
+ var defaultStyled = typeof styled__default["default"] === "function" ? styled__default["default"] : styled__default["default"].default;
397
+ // !!! This is a workaround to avoid the issue with styled-components not supporting ESM
398
+ // Workaround from https://github.com/styled-components/styled-components/issues/3437#issuecomment-1103085056
399
+
393
400
  var LISENSE_KEY = 'eyJkYXRhIjoiZXlKMElqb2liM0puWVc1cGVtRjBhVzl1SWl3aVlYWjFJam94TnpneU5ETXhPVGs1TENKa2JTSTZJbUoxYm01NUxtTnZiU0lzSW00aU9pSmhOV1F5TWpKaFpXTTNOelF5TkdFNUlpd2laWGh3SWpveE56WTJORFEzT1RrNUxDSmtiWFFpT2lKM2FXeGtZMkZ5WkNKOSIsInNpZ25hdHVyZSI6ImdJWW5BYWp0WW1aSHV1b1RrTkZCZnRGYjEzUTJOZXZwQXlKRmszdy9STDNUa08rRXZYWlV0MDZxenBrZWdOK1A4TXlkbFY1aityemQvM1VpYlB5SW1VSzAweHZSVk5hS29EOXB0cVpkbjR5SWRRdE1pU1NjZ0J1K1RkM0NXM2FONVNrdlNJVDEyTGpBMnVVYll2RmJ6RFpMci9hODkwa05sT0NQZURoVjMyd0w3R0NrTnV2Z1MyZlk5Mis0L25FdUdvZXBZR0RPN0Ryb3NaOGVlbnJ6b1BsQ044T204eFlMNXJxdUkvS2xLVTVYaGN0allrdzBTR0FlL0pDR1dTN1dLTDAvYmFvbS9GS1ltNU91VmlzcmlDVlc2UXgvbzBnTGE4bUtXLytMb3pNaHdFemdtU2I2S0xERzZpTEVPL0czQ2pYN2p2dTU1NEc4OUx2aW1BaE5BQT09In0=';
394
401
  // Custom zoom layout component that uses useZoomContext
395
402
  var CustomZoomLayout = function () {
@@ -466,22 +473,29 @@ var DocumentTemplatePreview = function (_a) {
466
473
  } }, { children: jsxRuntime.jsx(react$1.RPPages, {}) }))] })) })) })));
467
474
  };
468
475
 
476
+ function BackButton(_a) {
477
+ var onClick = _a.onClick, title = _a.title;
478
+ return (jsxRuntime.jsxs(StyledBackButton, __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 bunny-p-0 bunny-text-gray-400", onClick: onClick }, { children: [jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, { className: "pt-0.5", icon: freeSolidSvgIcons.faArrowLeft }), jsxRuntime.jsx("div", __assign({ className: "bunny-text-sm" }, { children: title || 'back' }))] })));
479
+ }
480
+ var StyledBackButton = styled__default["default"].button(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n border: none;\n cursor: pointer;\n outline: none;\n background: none;\n\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n &:hover {\n color: ", " !important;\n }\n"], ["\n border: none;\n cursor: pointer;\n outline: none;\n background: none;\n\n transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);\n &:hover {\n color: ", " !important;\n }\n"])), common.PRIMARY_COLOR);
481
+ var templateObject_1$c;
482
+
469
483
  var MarkupContainer = defaultStyled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
484
+ var useAntdToken$1 = antd.theme.useToken;
470
485
  var InvoiceQuoteView = function (_a) {
471
486
  var children = _a.children, formattedInvoice = _a.formattedInvoice, html = _a.html, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onDownloadError = _a.onDownloadError, targetUrl = _a.targetUrl;
472
487
  var downloadFile = useDownloadFile(formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.id, onDownloadError);
473
- var secondaryColor = react.useContext(BrandContext).secondaryColor;
474
488
  var apiHost = react.useContext(BunnyContext).apiHost;
475
489
  var token = useToken();
476
490
  var _b = react.useContext(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
477
491
  var isMobile = common.useIsMobile();
492
+ var antdToken = useAntdToken$1().token;
478
493
  var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
479
- return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-grow ".concat(isMobile ? 'bunny-overflow-hidden' : '') }, { children: [buttonsVisible ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between bunny-items-center bunny-pb-4 ".concat(isMobile ? 'bunny-shadow-padding-x' : ''), id: "acceptance" }, { children: [jsxRuntime.jsx("div", { children: onBackButtonClick ? (jsxRuntime.jsx(antd.Button, __assign({ className: "bunny-pl-0", onClick: onBackButtonClick, style: {
480
- color: secondaryColor,
481
- }, type: "link" }, { children: backButtonName || 'Back' }))) : null }), !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(icons.DownloadOutlined, {}), onClick: function () {
494
+ return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-grow ".concat(isMobile ? 'bunny-overflow-hidden' : '') }, { children: [buttonsVisible ? (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-between bunny-items-center bunny-pb-4 ".concat(isMobile ? 'bunny-shadow-padding-x' : ''), id: "acceptance" }, { children: [jsxRuntime.jsx("div", { children: onBackButtonClick ? (jsxRuntime.jsx(BackButton, { onClick: onBackButtonClick, title: backButtonName })) : null }), !hideDownloadButton ? (jsxRuntime.jsx(antd.Button, __assign({ icon: jsxRuntime.jsx(icons.DownloadOutlined, {}), onClick: function () {
482
495
  return downloadFile(apiHost + '/api/pdf/invoice/' + formattedInvoice.id, token);
483
- } }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-grow bunny-shadow-padding-xb bunny-overflow-auto" }, { children: [targetUrl ? (jsxRuntime.jsx(DocumentTemplatePreview, { targetUrl: targetUrl })) : (jsxRuntime.jsx(interweave.Markup, { content: html })), children] }))) : (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4 bunny-bg-white ".concat(shadow ? shadow : 'bunny-shadow-md', " bunny-rounded-md"), style: {
496
+ } }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-grow bunny-shadow-padding-xb bunny-overflow-auto", style: { fontFamily: antdToken.fontFamily } }, { children: [targetUrl ? (jsxRuntime.jsx(DocumentTemplatePreview, { targetUrl: targetUrl })) : (jsxRuntime.jsx(interweave.Markup, { content: html })), children] }))) : (jsxRuntime.jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4 bunny-bg-white ".concat(shadow ? shadow : 'shadow-md', " bunny-rounded-md"), style: {
484
497
  minWidth: '750px',
498
+ fontFamily: antdToken.fontFamily,
485
499
  } }, { children: [targetUrl ? (jsxRuntime.jsx(DocumentTemplatePreview, { targetUrl: targetUrl })) : (jsxRuntime.jsx(interweave.Markup, { content: html })), children] })))] })));
486
500
  };
487
501
  var templateObject_1$b;
@@ -765,6 +779,7 @@ function usePay$1(_a) {
765
779
  return { pay: pay };
766
780
  }
767
781
 
782
+ var useAntdToken = antd.theme.useToken;
768
783
  var createPaymentMethod = function (_a) {
769
784
  var paymentMethodId = _a.paymentMethodId, plugin = _a.plugin, token = _a.token, apiHost = _a.apiHost, accountId = _a.accountId;
770
785
  return __awaiter(void 0, void 0, void 0, function () {
@@ -852,10 +867,36 @@ index_js.loadStripe.setLoadParameters({ advancedFraudSignals: false });
852
867
  var useStripePlugin = function (plugin, apiHost, currencyId, token, accountId) {
853
868
  var _a = react.useState(null), stripe = _a[0], setStripe = _a[1];
854
869
  var showErrorNotification = common.useErrorNotification();
870
+ var antdToken = useAntdToken().token;
871
+ function getFontFamily() {
872
+ if (antdToken.fontFamily === 'Inter') {
873
+ return 'var(--font-inter, Inter), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
874
+ }
875
+ return antdToken.fontFamily;
876
+ }
877
+ var fontFamily = getFontFamily();
878
+ var appearance = {
879
+ variables: {
880
+ fontFamily: fontFamily,
881
+ fontLineHeight: antdToken.lineHeight.toString(),
882
+ borderRadius: antdToken.borderRadius.toString() + 'px',
883
+ colorBackground: 'white',
884
+ colorPrimary: antdToken.colorPrimary,
885
+ },
886
+ rules: {
887
+ '.Input': {
888
+ fontFamily: fontFamily,
889
+ },
890
+ '.Label': {
891
+ fontFamily: fontFamily,
892
+ },
893
+ },
894
+ };
855
895
  var options = {
856
896
  mode: 'setup',
857
897
  currency: currencyId,
858
898
  setupFutureUsage: 'off_session',
899
+ appearance: appearance,
859
900
  };
860
901
  react.useEffect(function () {
861
902
  var _a, _b;
@@ -18420,7 +18461,7 @@ var tagStyleMap = {
18420
18461
  // Please use this component instead of the antd Tag component directly to maintain consistent styling.
18421
18462
  var CustomizedTag = function (_a) {
18422
18463
  var children = _a.children, color = _a.color, className = _a.className, style = _a.style;
18423
- return (jsxRuntime.jsx(antd.Tag, __assign({ color: color, style: __assign(__assign({}, (color ? tagStyleMap[color] : undefined)), style), className: "bunny-m-0 bunny-font-medium bunny-rounded-full bunny-border-none bunny-whitespace-nowrap ".concat(className) }, { children: children })));
18464
+ return (jsxRuntime.jsx(antd.Tag, __assign({ color: color, style: __assign(__assign({}, (color ? tagStyleMap[color] : undefined)), style), className: "bunny-m-0 bunny-rounded-full bunny-border-none bunny-whitespace-nowrap ".concat(className) }, { children: children })));
18424
18465
  };
18425
18466
 
18426
18467
  var Amex = function (_a) {
@@ -18488,7 +18529,7 @@ var Bancontact = function (_a) {
18488
18529
  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" })] })));
18489
18530
  };
18490
18531
 
18491
- var Text$q = antd.Typography.Text;
18532
+ var Text$w = antd.Typography.Text;
18492
18533
  var MiniCreditCard = function (_a) {
18493
18534
  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;
18494
18535
  var darkMode = react.useContext(BunnyContext).darkMode;
@@ -18499,7 +18540,7 @@ var MiniCreditCard = function (_a) {
18499
18540
  return darkMode ? 'var(--row-background-alternate)' : 'bg-slate-50';
18500
18541
  }, [darkMode]);
18501
18542
  var isDefault = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.isDefault;
18502
- 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$q, __assign({ className: "bunny-text-slate-400", style: { fontSize: '12px' } }, { children: "No payment methods" }))] })), jsxRuntime.jsx(antd.Button, { disabled: true, type: "link" }), buttons] }))) })));
18543
+ 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$w, __assign({ className: "bunny-text-slate-400", style: { fontSize: '12px' } }, { children: "No payment methods" }))] })), jsxRuntime.jsx(antd.Button, { disabled: true, type: "link" }), buttons] }))) })));
18503
18544
  };
18504
18545
  var Identifier = function (_a) {
18505
18546
  var _b, _c, _d;
@@ -18508,9 +18549,9 @@ var Identifier = function (_a) {
18508
18549
  return null;
18509
18550
  }
18510
18551
  if (((_c = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _c === void 0 ? void 0 : _c.type) === 'cashapp') {
18511
- return jsxRuntime.jsx(Text$q, { children: "Cashapp" });
18552
+ return jsxRuntime.jsx(Text$w, { children: "Cashapp" });
18512
18553
  }
18513
- return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Text$q, __assign({ className: "relative -top-0.5" }, { children: "****" })), jsxRuntime.jsx(Text$q, { children: (_d = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _d === void 0 ? void 0 : _d.identifier })] }));
18554
+ return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Text$w, __assign({ className: "relative -top-0.5" }, { children: "****" })), jsxRuntime.jsx(Text$w, { children: (_d = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _d === void 0 ? void 0 : _d.identifier })] }));
18514
18555
  };
18515
18556
  var Issuer = function (_a) {
18516
18557
  var _b;
@@ -18519,7 +18560,7 @@ var Issuer = function (_a) {
18519
18560
  var issuer = (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.issuer;
18520
18561
  if (issuer.length == 0 || list.includes(issuer.toLowerCase()))
18521
18562
  return null;
18522
- return jsxRuntime.jsx(Text$q, { children: lodashExports.capitalize(issuer) });
18563
+ return jsxRuntime.jsx(Text$w, { children: lodashExports.capitalize(issuer) });
18523
18564
  };
18524
18565
  var DropdownMenu = function (_a) {
18525
18566
  var setDefault = _a.setDefault, remove = _a.remove, isDefault = _a.isDefault, id = _a.id;
@@ -18816,7 +18857,7 @@ function useSave$1(_a) {
18816
18857
  return { save: save, isSaving: isSaving };
18817
18858
  }
18818
18859
 
18819
- var Text$p = antd.Typography.Text;
18860
+ var Text$v = antd.Typography.Text;
18820
18861
  var TEST_CARD = '4242424242424242';
18821
18862
  var DemoPayForm = function (_a) {
18822
18863
  var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
@@ -18878,7 +18919,7 @@ var DemoPayForm = function (_a) {
18878
18919
  var onCardCvcChange = function (cvc) {
18879
18920
  setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
18880
18921
  };
18881
- 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$p, { children: "DemoPay is for testing only." }), jsxRuntime.jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
18922
+ 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$v, { children: "DemoPay is for testing only." }), jsxRuntime.jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
18882
18923
  };
18883
18924
  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) {
18884
18925
  var darkMode = _a.darkMode;
@@ -19045,7 +19086,7 @@ var CardIcon = function (_a) {
19045
19086
  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" })] })));
19046
19087
  };
19047
19088
 
19048
- var Text$o = antd.Typography.Text;
19089
+ var Text$u = antd.Typography.Text;
19049
19090
  var PaymentMethodSelector = function (_a) {
19050
19091
  var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
19051
19092
  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)); }) })));
@@ -19058,7 +19099,7 @@ var PaymentOption = function (_a) {
19058
19099
  var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('card');
19059
19100
  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
19060
19101
  ? "var(--row-background-dark) border-gray-500"
19061
- : '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$o, { 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" }))] })));
19102
+ : '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$u, { 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" }))] })));
19062
19103
  };
19063
19104
  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) {
19064
19105
  var $brandColor = _a.$brandColor, $selected = _a.$selected;
@@ -19709,8 +19750,8 @@ var PaymentHoldModal = function (_a) {
19709
19750
  } }) }))] })));
19710
19751
  };
19711
19752
 
19712
- var Text$n = antd.Typography.Text;
19713
- defaultStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
19753
+ var Text$t = antd.Typography.Text;
19754
+ defaultStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n Text {\n width: 100%;\n }\n"], ["\n Text {\n width: 100%;\n }\n"])));
19714
19755
  function Quote(_a) {
19715
19756
  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;
19716
19757
  return (jsxRuntime.jsx(InvoiceQuoteContext.Provider, __assign({ value: {
@@ -19804,7 +19845,7 @@ function QuoteButtons(_a) {
19804
19845
  var signingPlugins = useSigningPlugins({ apiHost: apiHost, token: token });
19805
19846
  return (jsxRuntime.jsxs("div", __assign({ className: "flex flex-row justify-end items-center gap-4", id: "acceptance", style: {
19806
19847
  color: entityBranding.secondaryColor,
19807
- } }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$n, { 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
19848
+ } }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsxRuntime.jsx(Text$t, { 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
19808
19849
  ? 'Quote is expired'
19809
19850
  : (signingPlugins === null || signingPlugins === void 0 ? void 0 : signingPlugins.length)
19810
19851
  ? 'Start signing'
@@ -19904,10 +19945,10 @@ var getColor = function (state) {
19904
19945
  }
19905
19946
  };
19906
19947
 
19907
- var Text$m = antd.Typography.Text;
19948
+ var Text$s = antd.Typography.Text;
19908
19949
  var TransactionDate = function (_a) {
19909
19950
  var date = _a.date;
19910
- return jsxRuntime.jsx(Text$m, __assign({ className: "bunny-text-sm" }, { children: common.formatDate(date) }));
19951
+ return jsxRuntime.jsx(Text$s, __assign({ className: "bunny-text-sm" }, { children: common.formatDate(date) }));
19911
19952
  };
19912
19953
 
19913
19954
  var ArrowDownToLine = function (_a) {
@@ -19944,13 +19985,13 @@ var TransactionGridCell = defaultStyled.div.withConfig({
19944
19985
  }, common.SLATE_600);
19945
19986
  var templateObject_1$6;
19946
19987
 
19947
- var Text$l = antd.Typography.Text;
19988
+ var Text$r = antd.Typography.Text;
19948
19989
  var TransactionsEmptyState = function () {
19949
19990
  var noTransactionsMessage = react.useContext(TransactionsListContext).noTransactionsMessage;
19950
- return (jsxRuntime.jsx(Text$l, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || 'There are no transactions' })));
19991
+ return (jsxRuntime.jsx(Text$r, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || 'There are no transactions' })));
19951
19992
  };
19952
19993
 
19953
- var Text$k = antd.Typography.Text;
19994
+ var Text$q = antd.Typography.Text;
19954
19995
  var isInvoice = function (transaction) {
19955
19996
  return transaction.kind === 'INVOICE';
19956
19997
  };
@@ -19959,7 +20000,7 @@ var TransactionRowTitle = function (_a) {
19959
20000
  if (!isInvoice(transaction)) {
19960
20001
  return jsxRuntime.jsx(jsxRuntime.Fragment, {});
19961
20002
  }
19962
- return (jsxRuntime.jsx(Text$k, __assign({ className: "bunny-text-slate-400", style: { fontSize: '11px' } }, { children: transaction.transactionable.number })));
20003
+ return (jsxRuntime.jsx(Text$q, __assign({ className: "bunny-text-slate-400", style: { fontSize: '11px' } }, { children: transaction.transactionable.number })));
19963
20004
  };
19964
20005
 
19965
20006
  function transactionDateToDisplay(transaction, transactionDateType) {
@@ -19977,7 +20018,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
19977
20018
  }
19978
20019
  }
19979
20020
 
19980
- var Text$j = antd.Typography.Text;
20021
+ var Text$p = antd.Typography.Text;
19981
20022
  var TransactionsListDesktop = function (_a) {
19982
20023
  var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
19983
20024
  var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
@@ -20006,11 +20047,11 @@ var TransactionsListDesktop = function (_a) {
20006
20047
  !showState &&
20007
20048
  !showAmount &&
20008
20049
  !showDownload &&
20009
- !showAccountName && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$j, { 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$j, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] })) })), showAccountName && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: false }, { children: jsxRuntime.jsx(Text$j, { 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: false }, { children: jsxRuntime.jsx(StateTag, { state: transaction.state }) }))) : null, showAmount && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(Text$j, { 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));
20050
+ !showAccountName && (jsxRuntime.jsx(TransactionGridCell, { children: jsxRuntime.jsx(Text$p, { 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$p, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsxRuntime.jsx(TransactionRowTitle, { transaction: transaction })] })) })), showAccountName && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: false }, { children: jsxRuntime.jsx(Text$p, { 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: false }, { children: jsxRuntime.jsx(StateTag, { state: transaction.state }) }))) : null, showAmount && (jsxRuntime.jsx(TransactionGridCell, __assign({ right: true }, { children: jsxRuntime.jsx(Text$p, { 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));
20010
20051
  }) }));
20011
20052
  };
20012
20053
 
20013
- var Text$i = antd.Typography.Text;
20054
+ var Text$o = antd.Typography.Text;
20014
20055
  var TransactionsListMobile = function (_a) {
20015
20056
  var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
20016
20057
  var _b = react.useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
@@ -20033,11 +20074,11 @@ var TransactionsListMobile = function (_a) {
20033
20074
  backgroundColor: index % 2 === 0
20034
20075
  ? "var(--row-background".concat(darkMode ? '-dark' : '', ")")
20035
20076
  : "var(--row-background-alternate".concat(darkMode ? '-dark' : '', ")"),
20036
- } }, { 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$i, { 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$i, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }), showAccountName && showDate && jsxRuntime.jsx(Text$i, { children: "\u00B7" }), showDate && (jsxRuntime.jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) })), showDate && showAmount && jsxRuntime.jsx(Text$i, { children: "\u00B7" }), showAmount && (jsxRuntime.jsx(Text$i, { 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));
20077
+ } }, { 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$o, { 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$o, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }), showAccountName && showDate && jsxRuntime.jsx(Text$o, { children: "\u00B7" }), showDate && (jsxRuntime.jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) })), showDate && showAmount && jsxRuntime.jsx(Text$o, { children: "\u00B7" }), showAmount && (jsxRuntime.jsx(Text$o, { 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));
20037
20078
  }) }));
20038
20079
  };
20039
20080
 
20040
- var Text$h = antd.Typography.Text;
20081
+ var Text$n = antd.Typography.Text;
20041
20082
  var DISPLAY_WIDTH = 1200;
20042
20083
  function Transactions(_a) {
20043
20084
  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 ? [
@@ -20149,7 +20190,7 @@ function TransactionsDisplay(_a) {
20149
20190
  onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
20150
20191
  setDrawerOpen(false);
20151
20192
  }
20152
- 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$h, __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsxRuntime.jsx("div", {}) // Empty div so justify-between works
20193
+ 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$n, __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsxRuntime.jsx("div", {}) // Empty div so justify-between works
20153
20194
  ), showSearchBar && (jsxRuntime.jsx("div", __assign({ className: "".concat(isMobile ? 'bunny-w-full' : '') }, { children: jsxRuntime.jsx(antd.Input, { className: searchBarClassName ? searchBarClassName : '', onChange: function (e) {
20154
20195
  if (isNaN(Number(e.target.value))) {
20155
20196
  return;
@@ -20540,7 +20581,7 @@ var BunnyFooterIcon = function (_a) {
20540
20581
  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" }) })) })] })));
20541
20582
  };
20542
20583
 
20543
- var Text$g = antd.Typography.Text;
20584
+ var Text$m = antd.Typography.Text;
20544
20585
  var Footer = function (_a) {
20545
20586
  var className = _a.className;
20546
20587
  var token = useToken();
@@ -20552,7 +20593,7 @@ var Footer = function (_a) {
20552
20593
  var BunnyMarketingLink = function () {
20553
20594
  var _a = react.useState(false), isHovered = _a[0], setIsHovered = _a[1];
20554
20595
  var isMobile = common.useIsMobile();
20555
- 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$g, __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 }) }))] })) })) })));
20596
+ 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$m, __assign({ className: "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 }) }))] })) })) })));
20556
20597
  };
20557
20598
  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);
20558
20599
  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);
@@ -20571,10 +20612,10 @@ function CouponEditor(_a) {
20571
20612
  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" }))] })) })));
20572
20613
  }
20573
20614
 
20574
- var Text$f = antd.Typography.Text;
20615
+ var Text$l = antd.Typography.Text;
20575
20616
  function CheckoutSummary(_a) {
20576
20617
  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;
20577
- return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className, " bunny-space-y-4") }, { children: [jsxRuntime.jsxs(Text$f, { 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) {
20618
+ return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className, " bunny-space-y-4") }, { children: [jsxRuntime.jsxs(Text$l, { 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) {
20578
20619
  return quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.map(function (charge) {
20579
20620
  var _a;
20580
20621
  var multiplier = charge.kind === 'COUPON' ? -1 : 1;
@@ -20635,18 +20676,18 @@ function InitialSignupForm(_a) {
20635
20676
  } }) })) })) })), 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" })) })] })) })));
20636
20677
  }
20637
20678
 
20638
- var Title = antd.Typography.Title, Text$e = antd.Typography.Text;
20679
+ var Title = antd.Typography.Title, Text$k = antd.Typography.Text;
20639
20680
  function PaymentSuccessDisplay(_a) {
20640
20681
  var amountPaid = _a.amountPaid, className = _a.className, companyName = _a.companyName, returnUrl = _a.returnUrl, style = _a.style, currencyId = _a.currencyId;
20641
- 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$e, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
20682
+ 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$k, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
20642
20683
  }
20643
20684
 
20644
- var Text$d = antd.Typography.Text;
20685
+ var Text$j = antd.Typography.Text;
20645
20686
  function PriceListDisplay(_a) {
20646
20687
  var priceListData = _a.priceListData;
20647
20688
  if (!priceListData)
20648
20689
  return null;
20649
- 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$d, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: [priceListData.product.name, " ", priceListData.name] })), jsxRuntime.jsxs(Text$d, __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$d, __assign({ style: { fontSize: '16px' }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$d, __assign({ className: "bunny-text-slate-500", style: { fontSize: '12px' } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })));
20690
+ 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$j, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: [priceListData.product.name, " ", priceListData.name] })), jsxRuntime.jsxs(Text$j, __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$j, __assign({ style: { fontSize: '16px' }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsxRuntime.jsx(Text$j, __assign({ className: "bunny-text-slate-500", style: { fontSize: '12px' } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })));
20650
20691
  }
20651
20692
 
20652
20693
  var showErrorNotification$2 = common.useErrorNotification();
@@ -20855,14 +20896,14 @@ function Signup(_a) {
20855
20896
 
20856
20897
  var SubscriptionsContext = react.createContext({});
20857
20898
 
20858
- var SUBSCRIPTIONS_QUERY = "\nquery subscriptions {\n subscriptions {\n nodes {\n addonSubscriptions {\n id\n priceList { id }\n plan { 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 }";
20899
+ var SUBSCRIPTIONS_QUERY = "\nquery subscriptions {\n subscriptions {\n nodes {\n addonSubscriptions {\n id\n priceList { id }\n plan { 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 chargeReport {\n priceListCharge {\n priceListChargeTiers {\n price\n starts\n }\n featureAddon\n id\n code\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 currentCharges {\n priceListCharge {\n priceListChargeTiers {\n price\n starts\n }\n featureAddon\n id\n code\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 }";
20859
20900
  var getSubscriptions = function (_a) {
20860
20901
  var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, token = _a.token;
20861
20902
  return __awaiter(void 0, void 0, void 0, function () {
20862
- var response, combinedSubscriptions;
20863
- var _b, _c;
20864
- return __generator(this, function (_d) {
20865
- switch (_d.label) {
20903
+ var response;
20904
+ var _b;
20905
+ return __generator(this, function (_c) {
20906
+ switch (_c.label) {
20866
20907
  case 0: return [4 /*yield*/, gqlRequest({
20867
20908
  isInPreviewMode: isInPreviewMode,
20868
20909
  query: SUBSCRIPTIONS_QUERY,
@@ -20870,18 +20911,13 @@ var getSubscriptions = function (_a) {
20870
20911
  apiHost: apiHost,
20871
20912
  })];
20872
20913
  case 1:
20873
- response = _d.sent();
20874
- combinedSubscriptions = (_c = (_b = response === null || response === void 0 ? void 0 : response.subscriptions) === null || _b === void 0 ? void 0 : _b.nodes) === null || _c === void 0 ? void 0 : _c.map(function (subscription) { return (__assign(__assign({}, subscription), { charges: common.sortSubscriptionCharges(subscription.charges) })); });
20875
- return [2 /*return*/, combinedSubscriptions];
20914
+ response = _c.sent();
20915
+ return [2 /*return*/, (_b = response === null || response === void 0 ? void 0 : response.subscriptions) === null || _b === void 0 ? void 0 : _b.nodes];
20876
20916
  }
20877
20917
  });
20878
20918
  });
20879
20919
  };
20880
20920
 
20881
- var pageWrapperClassName = function (isMobile) {
20882
- return "flex flex-col grow pt-4 ".concat(isMobile ? 'pb-4 overflow-hidden' : 'pb-8', " ").concat('content-container');
20883
- };
20884
-
20885
20921
  var MUTATION$2 = "{\n currentUser {\n taxationRequiredAccountFields\n }\n}";
20886
20922
  var getTaxationRequiredAccountFields = function (_a) {
20887
20923
  var apiHost = _a.apiHost, token = _a.token;
@@ -21080,7 +21116,7 @@ var QuoteCheckout = function (_a) {
21080
21116
  removeCoupon(couponCode);
21081
21117
  }
21082
21118
  });
21083
- } }, { children: "Remove coupon(s)" })))] }))) : (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(isMobile ? 'bunny-shadow-padding-x' : '') }, { children: [jsxRuntime.jsx(antd.Button, __assign({ onClick: handleCheckoutNoPayment, type: "primary" }, { children: isSaving ? 'Processing...' : 'Complete order' })), jsxRuntime.jsx("div", __assign({ className: "bunny-text-xs bunny-text-slate-500" }, { children: "No payment is required" }))] })) }))) }));
21119
+ } }, { children: "Remove coupon(s)" })))] }))) : (jsxRuntime.jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 bunny-px-4 ".concat(isMobile ? 'bunny-shadow-padding-x' : '') }, { children: [jsxRuntime.jsx(antd.Button, __assign({ onClick: handleCheckoutNoPayment, type: "primary" }, { children: isSaving ? 'Processing...' : 'Complete order' })), jsxRuntime.jsx("div", __assign({ className: "bunny-text-xs bunny-text-slate-500" }, { children: "No payment is required" }))] })) }))) }));
21084
21120
  };
21085
21121
  var PaymentFormWrapper = function (_a) {
21086
21122
  var children = _a.children, setMaxHeight = _a.setMaxHeight, className = _a.className;
@@ -21168,9 +21204,9 @@ var Checkout = function (_a) {
21168
21204
  });
21169
21205
  if (!open || isLoadingTaxationRequiredAccountFields || isLoadingAccount)
21170
21206
  return null;
21171
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-fixed bunny-top-0 bunny-left-0 bunny-right-0 bunny-bottom-0 bunny-bg-slate-50 bunny-overflow-auto", style: {
21207
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-fixed bunny-top-0 bunny-left-0 bunny-right-0 bunny-bottom-0 bunny-bg-slate-50\n bunny-overflow-auto bunny-height-full", style: {
21172
21208
  zIndex: 1001,
21173
- } }, { children: jsxRuntime.jsxs("div", __assign({ className: pageWrapperClassName(isMobile) }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full bunny-pr-4" }, { children: jsxRuntime.jsx(icons.CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-pt-4 bunny-gap-4 ".concat(isMobile ? 'bunny-flex-col' : 'bunny-shadow-padding-xb') }, { children: [((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_b = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _b === void 0 ? void 0 : _b.html)) && (jsxRuntime.jsx(InvoiceQuoteView, { html: invoice ? invoice.html : quote ? quote.formattedQuote.html : '' })), !isMobile && ((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_c = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _c === void 0 ? void 0 : _c.html)) && (jsxRuntime.jsx(antd.Divider, { className: "bunny-h-full", type: "vertical" })), invoice ? (jsxRuntime.jsx("div", __assign({ className: "bunny-w-full bunny-pt-12" }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: invoice }) }))) : quote ? (jsxRuntime.jsx(QuoteCheckout, { account: account, onFail: function (error) {
21209
+ } }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-grow bunny-pt-4 ".concat(isMobile ? 'bunny-pb-4' : 'bunny-pb-8', " bunny-content-container") }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full bunny-pr-4" }, { children: jsxRuntime.jsx(icons.CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-pt-4 bunny-gap-4 ".concat(isMobile ? 'bunny-flex-col' : 'bunny-shadow-padding-xb') }, { children: [((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_b = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _b === void 0 ? void 0 : _b.html)) && (jsxRuntime.jsx(InvoiceQuoteView, { html: invoice ? invoice.html : quote ? quote.formattedQuote.html : '' })), !isMobile && ((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_c = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _c === void 0 ? void 0 : _c.html)) && (jsxRuntime.jsx(antd.Divider, { className: "bunny-h-full", type: "vertical" })), invoice ? (jsxRuntime.jsx("div", __assign({ className: "bunny-w-full bunny-pt-12" }, { children: jsxRuntime.jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: invoice }) }))) : quote ? (jsxRuntime.jsx(QuoteCheckout, { account: account, onFail: function (error) {
21174
21210
  onFail(error);
21175
21211
  }, onSuccess: onSuccess, quote: quote, taxationRequiredAccountFields: taxationRequiredAccountFields, token: token, onRecalculateTaxes: function () { return __awaiter(void 0, void 0, void 0, function () {
21176
21212
  return __generator(this, function (_a) {
@@ -21189,10 +21225,10 @@ var Checkout = function (_a) {
21189
21225
  }, onPaymentSuccess: onSuccess }))] })), jsxRuntime.jsx(Footer, { className: "bunny-px-12" })] })) })));
21190
21226
  };
21191
21227
 
21192
- var Text$c = antd.Typography.Text;
21228
+ var Text$i = antd.Typography.Text;
21193
21229
  var DrawerHeader = function (_a) {
21194
21230
  var description = _a.description, onClose = _a.onClose, title = _a.title, closeButtonClassName = _a.closeButtonClassName;
21195
- 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$c, __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 }))] })));
21231
+ 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$i, __assign({ className: "bunny-text-xl bunny-font-normal" }, { 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-sm bunny-font-medium" }, { children: description }))] })));
21196
21232
  };
21197
21233
 
21198
21234
  var canShowQuantitiesInput = function (charge, subscription) {
@@ -21228,7 +21264,8 @@ var createQuoteParams = function (quote, subscriptionQuantity, editedSubscriptio
21228
21264
  var canShowChangeQuantities = function (_a) {
21229
21265
  var subscriptions = _a.subscriptions;
21230
21266
  return subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.some(function (subscription) {
21231
- return subscription.charges.some(function (charge) {
21267
+ var _a;
21268
+ return (_a = subscription === null || subscription === void 0 ? void 0 : subscription.chargeReport) === null || _a === void 0 ? void 0 : _a.some(function (charge) {
21232
21269
  return canShowQuantitiesInput(charge, subscription);
21233
21270
  });
21234
21271
  });
@@ -21307,6 +21344,10 @@ var getApplicablePriceTier = function (charge, currencyId, priceDecimals) {
21307
21344
  ? "".concat(starts, "-").concat(ends, ": ").concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals))
21308
21345
  : "".concat(common.formatCurrency(selectedTier.price, currencyId, priceDecimals));
21309
21346
  };
21347
+ // Create an id using the charge id and the subscription id
21348
+ var getUpdatingChargeQuantityId = function (charge, subscription) {
21349
+ return "".concat(charge.priceListChargeId, "-").concat(subscription.id);
21350
+ };
21310
21351
 
21311
21352
  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");
21312
21353
  var quoteChargeCreate = function (_a) {
@@ -21373,6 +21414,9 @@ var useQuoteChangeUpdate = function () {
21373
21414
  case 0: return [4 /*yield*/, graphQLRequest("mutation QuoteChangeUpdate($charges:[QuoteChargeAttributes!], $id:ID!) {\n quoteChangeUpdate(id:$id, charges:$charges) {\n quoteChange { id quoteId }\n errors\n }\n }", apiHost, token, { charges: charges, id: quoteChangeId })];
21374
21415
  case 1:
21375
21416
  response = _a.sent();
21417
+ if (response.errors) {
21418
+ throw new Error(response.errors[0].message);
21419
+ }
21376
21420
  return [2 /*return*/, response];
21377
21421
  }
21378
21422
  });
@@ -21408,7 +21452,7 @@ var formatDateForApi = function (date) {
21408
21452
  return date.format('YYYY-MM-DD');
21409
21453
  };
21410
21454
  var QuantityInput = function (_a) {
21411
- var charge = _a.charge, chargeIndex = _a.chargeIndex, editingQuote = _a.editingQuote, setEditingQuoteData = _a.setEditingQuoteData, subscription = _a.subscription, subscriptionIndex = _a.subscriptionIndex, subscriptions = _a.subscriptions, setUpdatingChargeQuantityId = _a.setUpdatingChargeQuantityId, updatingChargeQuantityId = _a.updatingChargeQuantityId;
21455
+ var charge = _a.charge, chargeIndex = _a.chargeIndex, editingQuote = _a.editingQuote, setEditingQuoteData = _a.setEditingQuoteData, subscription = _a.subscription, subscriptionIndex = _a.subscriptionIndex, setUpdatingChargeQuantityId = _a.setUpdatingChargeQuantityId, updatingChargeQuantityId = _a.updatingChargeQuantityId, setErrorUpdatingQuantity = _a.setErrorUpdatingQuantity;
21412
21456
  // Context
21413
21457
  var token = useToken();
21414
21458
  var apiHost = react.useContext(BunnyContext).apiHost;
@@ -21418,12 +21462,12 @@ var QuantityInput = function (_a) {
21418
21462
  var queryClient = reactQuery.useQueryClient();
21419
21463
  var createSubscriptionQuote = useCreateSubscriptionQuote();
21420
21464
  var quoteChangeUpdate = useQuoteChangeUpdate();
21421
- var isMobile = common.useIsMobile();
21422
21465
  var showErrorNotification = common.useErrorNotification();
21423
21466
  var quantityDisabled =
21424
21467
  // If we are editing a quote, we disable the quantity input
21425
21468
  // If we don't have a editedSubscription, we disable the quantity input
21426
- (updatingChargeQuantityId && updatingChargeQuantityId !== charge.id) ||
21469
+ (updatingChargeQuantityId &&
21470
+ updatingChargeQuantityId !== getUpdatingChargeQuantityId(charge, subscription)) ||
21427
21471
  // If the subscription is not self-service, we disable the quantity input
21428
21472
  !charge.selfServiceQuantity;
21429
21473
  var value = (editedSubscription === null || editedSubscription === void 0 ? void 0 : editedSubscription.quantity) === undefined ? '' : editedSubscription.quantity;
@@ -21449,8 +21493,8 @@ var QuantityInput = function (_a) {
21449
21493
  },
21450
21494
  }).mutate;
21451
21495
  var createQuote = reactQuery.useMutation({
21452
- mutationFn: function (subscriptionIds) {
21453
- return createSubscriptionQuote(subscriptionIds, apiHost, token);
21496
+ mutationFn: function (subscriptionId) {
21497
+ return createSubscriptionQuote([subscriptionId], apiHost, token);
21454
21498
  },
21455
21499
  onSuccess: function (subscriptionUpdateData) {
21456
21500
  var _a, _b;
@@ -21490,6 +21534,10 @@ var QuantityInput = function (_a) {
21490
21534
  token: token,
21491
21535
  }),
21492
21536
  });
21537
+ setErrorUpdatingQuantity(false);
21538
+ },
21539
+ onError: function () {
21540
+ setErrorUpdatingQuantity(true);
21493
21541
  },
21494
21542
  });
21495
21543
  // Handlers
@@ -21506,104 +21554,75 @@ var QuantityInput = function (_a) {
21506
21554
  quantity: quantity,
21507
21555
  subscription: subscription,
21508
21556
  });
21509
- if (quantity !== undefined && quantity !== charge.quantity) {
21510
- setUpdatingChargeQuantityId(charge.id);
21511
- }
21512
- else {
21557
+ if (quantity === undefined) {
21513
21558
  setUpdatingChargeQuantityId(undefined);
21514
21559
  setEditingQuoteData(undefined);
21515
21560
  }
21561
+ if (quantity === charge.quantity) {
21562
+ setEditingQuoteData(undefined);
21563
+ showErrorNotification('New quantity cannot be the same as current');
21564
+ }
21565
+ else {
21566
+ if (quantity !== undefined && quantity !== charge.quantity) {
21567
+ if (!(charge === null || charge === void 0 ? void 0 : charge.priceListChargeId)) {
21568
+ showErrorNotification('Charge ID is not found');
21569
+ return;
21570
+ }
21571
+ setUpdatingChargeQuantityId(getUpdatingChargeQuantityId(charge, subscription));
21572
+ }
21573
+ }
21516
21574
  };
21517
21575
  var handleSubscriptionUpdate = function (editedSubscription) {
21518
21576
  if (!editedSubscription || editedSubscription.quantity === undefined)
21519
21577
  return;
21520
21578
  // If we are not editing a quote, we create a new one
21521
21579
  if (!editingQuote) {
21522
- var subscriptionIds = [];
21523
- var charge_1 = subscriptions[editedSubscription.subscriptionIndex].charges[editedSubscription.chargeIndex];
21524
- if (isQuantityLowerThanOriginal(charge_1.quantity)) {
21525
- // If the quantity is lower than the original, we remove the quote
21526
- setEditingQuoteData(undefined);
21527
- setUpdatingChargeQuantityId(undefined);
21528
- return;
21529
- }
21530
- subscriptionIds.push(editedSubscription.subscription.id);
21531
- createQuote.mutate(subscriptionIds);
21580
+ createQuote.mutate(editedSubscription.subscription.id);
21532
21581
  }
21533
21582
  else {
21534
21583
  // If we are editing a quote, we update the quote change
21535
21584
  var _a = createQuoteParams(editingQuote, charge.quantity, editedSubscription), charges = _a.charges, quoteChange = _a.quoteChange;
21536
- if (quoteChange && charges.length > 0 && charges[0].quantity > 0) {
21585
+ if (quoteChange && charges.length > 0) {
21537
21586
  updateQuote.mutate({
21538
21587
  charges: charges,
21539
21588
  quoteChangeId: quoteChange.id,
21540
21589
  });
21541
21590
  }
21542
- else {
21543
- // Reset the editing quote data and the updating charge quantity ID to their initial states
21544
- setEditingQuoteData(undefined);
21545
- setUpdatingChargeQuantityId(undefined);
21546
- }
21547
21591
  }
21548
21592
  };
21549
- // Initial subscription quantity if is on mobile
21550
- react.useEffect(function () {
21551
- if (isMobile && !editedSubscription && !quantityDisabled) {
21552
- setEditedSubscription({
21553
- chargeIndex: chargeIndex,
21554
- subscriptionIndex: subscriptionIndex,
21555
- chargeId: charge.priceListChargeId,
21556
- quantity: charge.quantity,
21557
- subscription: subscription,
21558
- });
21559
- }
21560
- }, [
21561
- charge,
21562
- chargeIndex,
21563
- editedSubscription,
21564
- isMobile,
21565
- quantityDisabled,
21566
- subscription,
21567
- subscriptionIndex,
21568
- ]);
21569
21593
  // Edit subscription debounce
21570
21594
  react.useEffect(function () {
21571
21595
  var debounce = setTimeout(function () {
21572
21596
  handleSubscriptionUpdate(editedSubscription);
21573
21597
  }, 1000);
21574
21598
  return function () { return clearTimeout(debounce); };
21575
- // eslint-disable-next-line
21576
21599
  }, [editedSubscription]);
21577
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(antd.Input, { className: "bunny-text-right", disabled: quantityDisabled, onBlur: function () {
21578
- if (typeof value === 'number' && value < charge.quantity) {
21579
- showErrorNotification('New value is less than the original quantity. This is not allowed');
21580
- }
21581
- }, onChange: function (e) {
21600
+ return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(antd.Input, { className: "bunny-text-right", disabled: quantityDisabled, onChange: function (e) {
21582
21601
  onChangeQuantity(chargeIndex, e.target.value, charge.priceListChargeId, subscription, subscriptionIndex);
21583
21602
  }, status: isQuantityLowerThanOriginal(charge.quantity) ? 'error' : '', style: { width: '96px' }, value: value }) }));
21584
21603
  };
21585
21604
 
21586
- var Text$b = antd.Typography.Text;
21605
+ var Text$h = antd.Typography.Text;
21587
21606
  var QuantityChangeGridRow = function (_a) {
21588
21607
  var _b;
21589
- var chargeIndex = _a.chargeIndex, editingQuote = _a.editingQuote, subscriptions = _a.subscriptions, subscriptionIndex = _a.subscriptionIndex, setEditingQuoteData = _a.setEditingQuoteData, subscription = _a.subscription, subscriptionCharge = _a.subscriptionCharge, setUpdatingChargeQuantityId = _a.setUpdatingChargeQuantityId, updatingChargeQuantityId = _a.updatingChargeQuantityId;
21608
+ var chargeIndex = _a.chargeIndex, editingQuote = _a.editingQuote, subscriptionIndex = _a.subscriptionIndex, setEditingQuoteData = _a.setEditingQuoteData, subscription = _a.subscription, subscriptionCharge = _a.subscriptionCharge, setUpdatingChargeQuantityId = _a.setUpdatingChargeQuantityId, updatingChargeQuantityId = _a.updatingChargeQuantityId, setErrorUpdatingQuantity = _a.setErrorUpdatingQuantity;
21590
21609
  if (!canShowQuantitiesInput(subscriptionCharge, subscription))
21591
21610
  return null;
21592
21611
  var brandColor = react.useContext(BrandContext).brandColor;
21593
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$b, __assign({ className: "bunny-font-medium bunny-col-span-full", style: { fontSize: '11px', color: brandColor } }, { children: subscription.plan.name })), jsxRuntime.jsx(Text$b, __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$b, __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, setUpdatingChargeQuantityId: setUpdatingChargeQuantityId, updatingChargeQuantityId: updatingChargeQuantityId }), jsxRuntime.jsx("div", {})] })), jsxRuntime.jsx(antd.Divider, { className: "bunny-col-span-full bunny-my-2" })] }));
21612
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-1" }, { children: [jsxRuntime.jsx(Text$h, __assign({ className: "bunny-font-medium bunny-text-sm bunny-col-span-full", style: { color: brandColor } }, { children: subscription.plan.name })), jsxRuntime.jsx(Text$h, __assign({ className: "bunny-text-sm" }, { children: (_b = subscriptionCharge.name) === null || _b === void 0 ? void 0 : _b.toUpperCase() }))] })), jsxRuntime.jsx(Text$h, __assign({ className: "bunny-flex bunny-items-center bunny-justify-end bunny-font-medium bunny-text-sm bunny-text-gray-900" }, { children: subscriptionCharge.quantity })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-justify-center bunny-items-end" }, { children: [jsxRuntime.jsx(QuantityInput, { charge: subscriptionCharge, chargeIndex: chargeIndex, editingQuote: editingQuote, setEditingQuoteData: setEditingQuoteData, subscription: subscription, subscriptionIndex: subscriptionIndex, setUpdatingChargeQuantityId: setUpdatingChargeQuantityId, updatingChargeQuantityId: updatingChargeQuantityId, setErrorUpdatingQuantity: setErrorUpdatingQuantity }), jsxRuntime.jsx("div", {})] })), jsxRuntime.jsx(antd.Divider, { className: "bunny-col-span-full bunny-my-2" })] }));
21594
21613
  };
21595
21614
 
21615
+ var Text$g = antd.Typography.Text;
21596
21616
  var QuantityChangeGridTitle = function (_a) {
21597
21617
  var children = _a.children, right = _a.right;
21598
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-slate-600 ".concat(right ? "bunny-text-right" : "bunny-text-left"), style: { fontSize: "11px" } }, { children: children })));
21618
+ return (jsxRuntime.jsx(Text$g, __assign({ className: "bunny-font-medium bunny-text-sm bunny-text-slate-600 ".concat(right ? 'bunny-text-right' : 'bunny-text-left') }, { children: children })));
21599
21619
  };
21600
21620
 
21601
21621
  var QuoteChangeSummarySection = function (_a) {
21602
- var editingQuote = _a.editingQuote, editingQuoteData = _a.editingQuoteData, openCheckout = _a.openCheckout, setEditingQuoteData = _a.setEditingQuoteData;
21622
+ var editingQuote = _a.editingQuote, editingQuoteData = _a.editingQuoteData, openCheckout = _a.openCheckout, setEditingQuoteData = _a.setEditingQuoteData, errorUpdatingQuantity = _a.errorUpdatingQuantity;
21603
21623
  var apiHost = react.useContext(BunnyContext).apiHost;
21604
21624
  var isMobile = common.useIsMobile();
21605
21625
  var token = useToken();
21606
- // const apiHost = getApiHost();
21607
21626
  var showSuccessNotification = common.useSuccessNotification();
21608
21627
  var trialUpgradeMutation = reactQuery.useMutation({
21609
21628
  mutationFn: function (quoteId) { return checkout({ quoteId: quoteId, token: token, apiHost: apiHost }); },
@@ -21614,14 +21633,15 @@ var QuoteChangeSummarySection = function (_a) {
21614
21633
  });
21615
21634
  return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: [editingQuote && (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-mb-8" }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-text-slate-500 bunny-text-right bunny-text-xs bunny-mb-2" }, { children: "TOTAL" })), jsxRuntime.jsx("div", __assign({ className: "bunny-text-right ".concat(isMobile ? 'bunny-text-2xl' : 'bunny-text-xl') }, { children: common.formatCurrency(getQuoteAmountDue(editingQuote), (editingQuote === null || editingQuote === void 0 ? void 0 : editingQuote.currencyId) || '') }))] }))), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-end ".concat(isMobile ? 'bunny-w-full' : '') }, { children: jsxRuntime.jsx(antd.Button, __assign({ className: "bunny-w-full", onClick: (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial)
21616
21635
  ? function () { return trialUpgradeMutation.mutate(editingQuoteData.id); }
21617
- : openCheckout, disabled: !editingQuoteData || !editingQuote, size: isMobile ? 'large' : 'middle', type: "primary" }, { children: (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial) ? 'Activate Trial' : 'Proceed to checkout' })) }))] })));
21636
+ : openCheckout, disabled: !editingQuoteData || !editingQuote || errorUpdatingQuantity, size: isMobile ? 'large' : 'middle', type: "primary" }, { children: (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial) ? 'Activate Trial' : 'Proceed to checkout' })) }))] })));
21618
21637
  };
21619
21638
 
21620
- var QUANTITY_CHANGE_HEADER_TITLE = 'Update unit quantity';
21639
+ var QUANTITY_CHANGE_HEADER_TITLE = 'Update quantities';
21621
21640
  var QUANTITY_CHANGE_HEADER_DESCRIPTION = 'Adjust quantities below. The change will take effect immediately after checkout has been completed.';
21622
21641
  var QuantityChangeDrawerDesktop = function (_a) {
21623
21642
  var editingQuote = _a.editingQuote, editingQuoteData = _a.editingQuoteData, onClose = _a.onClose, open = _a.open, openCheckout = _a.openCheckout, setEditingQuoteData = _a.setEditingQuoteData, subscriptions = _a.subscriptions, setUpdatingChargeQuantityId = _a.setUpdatingChargeQuantityId, updatingChargeQuantityId = _a.updatingChargeQuantityId;
21624
21643
  var _b = react.useState(open), openLocal = _b[0], setOpenLocal = _b[1];
21644
+ var _c = react.useState(false), errorUpdatingQuantity = _c[0], setErrorUpdatingQuantity = _c[1];
21625
21645
  var isMobile = common.useIsMobile();
21626
21646
  react.useEffect(function () {
21627
21647
  var timeoutId;
@@ -21641,7 +21661,6 @@ var QuantityChangeDrawerDesktop = function (_a) {
21641
21661
  ? {
21642
21662
  body: {
21643
21663
  padding: '1rem',
21644
- overflow: 'hidden',
21645
21664
  background: common.SLATE_50,
21646
21665
  },
21647
21666
  wrapper: {
@@ -21653,25 +21672,25 @@ var QuantityChangeDrawerDesktop = function (_a) {
21653
21672
  minWidth: '600px',
21654
21673
  },
21655
21674
  }, 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: {
21656
- gridTemplateColumns: '2fr 1fr 1fr',
21675
+ gridTemplateColumns: '3fr 3fr 2fr',
21657
21676
  rowGap: '0.25rem',
21658
21677
  columnGap: '1rem',
21659
- } }, { 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) {
21660
- var _a;
21678
+ } }, { children: [jsxRuntime.jsx(QuantityChangeGridTitle, { children: " " }), 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", style: { marginBottom: '8px', marginTop: '20px' } }), subscriptions.map(function (subscription, index) {
21679
+ var _a, _b;
21661
21680
  var isTrial = ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.TRIAL;
21662
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-contents" }, { children: subscription.charges.map(function (charge, chargeIndex) {
21681
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-contents" }, { children: (_b = subscription === null || subscription === void 0 ? void 0 : subscription.currentCharges) === null || _b === void 0 ? void 0 : _b.map(function (charge, chargeIndex) {
21663
21682
  var _a;
21664
21683
  if ((isTrial && !charge.trial) ||
21665
21684
  (!isTrial && charge.trial) ||
21666
21685
  ((_a = charge.chargeType) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === 'USAGE')
21667
21686
  return null;
21668
- return (jsxRuntime.jsx(QuantityChangeGridRow, { chargeIndex: chargeIndex, editingQuote: editingQuote, setEditingQuoteData: setEditingQuoteData, subscription: subscription, subscriptionCharge: charge, subscriptionIndex: index, subscriptions: subscriptions, setUpdatingChargeQuantityId: setUpdatingChargeQuantityId, updatingChargeQuantityId: updatingChargeQuantityId }, chargeIndex));
21687
+ return (jsxRuntime.jsx(QuantityChangeGridRow, { chargeIndex: chargeIndex, editingQuote: editingQuote, setEditingQuoteData: setEditingQuoteData, subscription: subscription, subscriptionCharge: charge, subscriptionIndex: index, setUpdatingChargeQuantityId: setUpdatingChargeQuantityId, updatingChargeQuantityId: updatingChargeQuantityId, setErrorUpdatingQuantity: setErrorUpdatingQuantity }, chargeIndex));
21669
21688
  }) }), index));
21670
- })] })), jsxRuntime.jsx(QuoteChangeSummarySection, { editingQuote: editingQuote, editingQuoteData: editingQuoteData, openCheckout: openCheckout, setEditingQuoteData: setEditingQuoteData })] })));
21689
+ })] })), jsxRuntime.jsx(QuoteChangeSummarySection, { editingQuote: editingQuote, editingQuoteData: editingQuoteData, openCheckout: openCheckout, setEditingQuoteData: setEditingQuoteData, errorUpdatingQuantity: errorUpdatingQuantity })] })));
21671
21690
  };
21672
21691
 
21673
21692
  var QuantityDrawerContainer = function (_a) {
21674
- var subscriptions = _a.subscriptions, quantityDrawerOpen = _a.quantityDrawerOpen, setQuantityDrawerOpen = _a.setQuantityDrawerOpen, handlePortalErrors = _a.handlePortalErrors, setHideExpiredState = _a.setHideExpiredState;
21693
+ var subscriptions = _a.subscriptions, quantityDrawerOpen = _a.quantityDrawerOpen, setQuantityDrawerOpen = _a.setQuantityDrawerOpen, handlePortalErrors = _a.handlePortalErrors, setShowInactive = _a.setShowInactive;
21675
21694
  var apiHost = react.useContext(BunnyContext).apiHost;
21676
21695
  var token = useToken();
21677
21696
  var queryClient = reactQuery.useQueryClient();
@@ -21707,7 +21726,7 @@ var QuantityDrawerContainer = function (_a) {
21707
21726
  });
21708
21727
  showSuccessNotification('Your plan has been updated', 'Payment successful');
21709
21728
  setPayModalVisible(false);
21710
- setHideExpiredState(true);
21729
+ setShowInactive(true);
21711
21730
  setUpdatingChargeQuantityId(undefined);
21712
21731
  };
21713
21732
  var onCancel = function () {
@@ -21744,12 +21763,12 @@ var useCancelSubscription = function () {
21744
21763
  }); };
21745
21764
  };
21746
21765
 
21747
- var HideExpiredToggle = function (_a) {
21748
- var hideExpired = _a.hideExpired, setHideExpired = _a.setHideExpired;
21766
+ var ShowInactiveToggle = function (_a) {
21767
+ var showInactive = _a.showInactive, setShowInactive = _a.setShowInactive;
21749
21768
  var secondaryColor = react.useContext(BrandContext).secondaryColor;
21750
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-4" }, { children: jsxRuntime.jsx(StyledCheckbox, { children: jsxRuntime.jsx(antd.Checkbox, __assign({ checked: hideExpired, onChange: function (e) { return setHideExpired(e.target.checked); }, style: {
21769
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-4" }, { children: jsxRuntime.jsx(StyledCheckbox, { children: jsxRuntime.jsx(antd.Checkbox, __assign({ checked: showInactive, onChange: function (e) { return setShowInactive(e.target.checked); }, style: {
21751
21770
  color: secondaryColor,
21752
- } }, { children: "Hide inactive" })) }) })));
21771
+ } }, { children: "Show inactive" })) }) })));
21753
21772
  };
21754
21773
  var StyledCheckbox = styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n .ant-checkbox-wrapper span {\n padding-inline-end: 0 !important;\n }\n"], ["\n .ant-checkbox-wrapper span {\n padding-inline-end: 0 !important;\n }\n"])));
21755
21774
  var templateObject_1$4;
@@ -21762,14 +21781,14 @@ var ChangeQuantitiesButton = function (_a) {
21762
21781
  };
21763
21782
 
21764
21783
  var SubscriptionsNavigation = function (_a) {
21765
- var expiredSwitchVisible = _a.expiredSwitchVisible, hideExpired = _a.hideExpired, setHideExpired = _a.setHideExpired, setQuantityDrawerOpen = _a.setQuantityDrawerOpen, subscriptions = _a.subscriptions;
21784
+ var inactiveSwitchVisible = _a.inactiveSwitchVisible, showInactive = _a.showInactive, setShowInactive = _a.setShowInactive, setQuantityDrawerOpen = _a.setQuantityDrawerOpen, subscriptions = _a.subscriptions;
21766
21785
  // Hooks
21767
21786
  var isMobile = common.useIsMobile();
21768
21787
  // Derived state
21769
21788
  var canShowChangeQuantitiesButton = canShowChangeQuantities({
21770
21789
  subscriptions: subscriptions,
21771
21790
  });
21772
- 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, { setQuantityDrawerOpen: setQuantityDrawerOpen })) }))] }));
21791
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMobile && inactiveSwitchVisible && (jsxRuntime.jsx(ShowInactiveToggle, { showInactive: showInactive, setShowInactive: setShowInactive })), 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, { setQuantityDrawerOpen: setQuantityDrawerOpen })) }))] }));
21773
21792
  };
21774
21793
 
21775
21794
  var ErrorView = function (_a) {
@@ -22035,7 +22054,7 @@ var SubscriptionCardActions = function (_a) {
22035
22054
  (isActiveOrPending || isInTrial || isTrialExpired) && (jsxRuntime.jsx(antd.Button, __assign({ onClick: function () { return onChangePlanClick(subscription); }, type: 'primary' }, { children: isInTrial ? 'Upgrade from trial' : isTrialExpired ? 'Upgrade' : 'Change plan' }))), !arePlansAvailable && isInTrial && jsxRuntime.jsx(antd.Tag, __assign({ color: "warning" }, { children: "Cannot upgrade" }))] }));
22036
22055
  };
22037
22056
 
22038
- var Text$a = antd.Typography.Text;
22057
+ var Text$f = antd.Typography.Text;
22039
22058
  var getSubscriptionStatusText = function (subscription) {
22040
22059
  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;
22041
22060
  var stateUpperCased = state === null || state === void 0 ? void 0 : state.toUpperCase();
@@ -22071,7 +22090,7 @@ var getSubscriptionStatusText = function (subscription) {
22071
22090
  return "Ends on ".concat(common.formatDate(endDate || trialEndDate));
22072
22091
  };
22073
22092
  var SubscriptionCardHeader = function (_a) {
22074
- var _b, _c, _d, _e;
22093
+ var _b, _c, _d;
22075
22094
  var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscription = _a.subscription;
22076
22095
  // Context
22077
22096
  var darkMode = react.useContext(BunnyContext).darkMode;
@@ -22082,7 +22101,7 @@ var SubscriptionCardHeader = function (_a) {
22082
22101
  var isTrial = isSubscriptionTrial(subscription);
22083
22102
  return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: {
22084
22103
  backgroundColor: darkMode ? 'var(--row-background-dark)' : '',
22085
- } }, { 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$a, __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$a, __assign({ className: "bunny-text-lg" }, { children: subscription.plan.name }))), jsxRuntime.jsxs(CustomizedTag, __assign({ color: TAG_COLORS[(_e = subscription.state) === null || _e === void 0 ? void 0 : _e.toUpperCase()] }, { children: [lodashExports.capitalize(subscription.state.toLowerCase().replace(/_/g, ' ')), isTrial ? " (".concat(trialDaysLeft !== null && trialDaysLeft !== void 0 ? trialDaysLeft : 'N/A', " days left)") : ''] }))] }))] })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-6" }, { children: jsxRuntime.jsx(SubscriptionStatusAndActions, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }) }))] })));
22104
+ } }, { 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$f, __assign({ style: __assign({ color: brandColor }, subscriptionProductNameStyle) }, { children: subscription.product.name }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-grow bunny-items-center bunny-gap-2" }, { children: [((_c = subscription === null || subscription === void 0 ? void 0 : subscription.plan) === null || _c === void 0 ? void 0 : _c.name) && (jsxRuntime.jsx(Text$f, __assign({ className: "bunny-text-sm" }, { children: subscription.plan.name }))), jsxRuntime.jsxs(CustomizedTag, __assign({ color: TAG_COLORS[(_d = subscription.state) === null || _d === void 0 ? void 0 : _d.toUpperCase()] }, { children: [lodashExports.capitalize(subscription.state.toLowerCase().replace(/_/g, ' ')), isTrial ? " (".concat(trialDaysLeft !== null && trialDaysLeft !== void 0 ? trialDaysLeft : 'N/A', " days left)") : ''] }))] }))] })), jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-6" }, { children: jsxRuntime.jsx(SubscriptionStatusAndActions, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }) }))] })));
22086
22105
  };
22087
22106
  function SubscriptionStatusAndActions(_a) {
22088
22107
  var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscription = _a.subscription;
@@ -22106,7 +22125,7 @@ function SubscriptionStatusAndActions(_a) {
22106
22125
  var cardActionsVisible = !isMobile;
22107
22126
  var showStatusSkeleton = arePriceListChangeOptionsLoading && cardActionsVisible;
22108
22127
  var showActionsSkeleton = arePriceListChangeOptionsLoading && !priceListChangeOptions;
22109
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showStatusSkeleton ? (jsxRuntime.jsx(antd.Skeleton.Input, { active: true, size: "small", style: { width: 180 } })) : (jsxRuntime.jsx(Text$a, __assign({ className: "bunny-grow bunny-text-xs" }, { children: getSubscriptionStatusText(subscription) }))), cardActionsVisible &&
22128
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [showStatusSkeleton ? (jsxRuntime.jsx(antd.Skeleton.Input, { active: true, size: "small", style: { width: 180 } })) : (jsxRuntime.jsx(Text$f, __assign({ className: "bunny-grow" }, { children: getSubscriptionStatusText(subscription) }))), cardActionsVisible &&
22110
22129
  (showActionsSkeleton ? (jsxRuntime.jsx(antd.Skeleton.Button, { active: true, size: "default", style: { width: 100 } })) : (jsxRuntime.jsx(SubscriptionCardActions, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, priceListChangeOptions: priceListChangeOptions, subscription: subscription, isPaymentMethodLoading: isPaymentMethodLoading })))] }));
22111
22130
  }
22112
22131
 
@@ -22194,97 +22213,97 @@ var SubscriptionChargeUnitPrice = function (_a) {
22194
22213
  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) }));
22195
22214
  };
22196
22215
 
22197
- var Text$9 = antd.Typography.Text;
22216
+ var Text$e = antd.Typography.Text;
22198
22217
  var SubscriptionCardColumnHeaders = function (_a) {
22199
22218
  var columns = _a.columns;
22200
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: columns.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(Text$9, __assign({ className: "bunny-text-slate-400 ".concat(subscriptionColumn.className), style: { fontSize: "11px" } }, { children: subscriptionColumn.title }), index)); }) }));
22219
+ return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: columns.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(Text$e, __assign({ className: "bunny-text-slate-400 ".concat(subscriptionColumn.className) }, { children: subscriptionColumn.title }), index)); }) }));
22201
22220
  };
22202
22221
 
22203
- var Text$8 = antd.Typography.Text;
22222
+ var Text$d = antd.Typography.Text;
22204
22223
  var SubscriptionsListCell = function (_a) {
22205
22224
  var children = _a.children, className = _a.className, gridColumn = _a.gridColumn, right = _a.right, style = _a.style;
22206
- return (jsxRuntime.jsx(Text$8, __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 })));
22225
+ return (jsxRuntime.jsx(Text$d, __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 })));
22207
22226
  };
22208
22227
 
22209
22228
  var NON_ADDON_CARD_COLUMNS = [
22210
22229
  {
22211
- title: 'CHARGE',
22230
+ title: 'Charge',
22212
22231
  width: 'minmax(min-content, 26%)',
22213
22232
  },
22214
22233
  {
22215
- title: 'PERIOD',
22234
+ title: 'Period',
22216
22235
  width: 'minmax(min-content, 20%)',
22217
22236
  },
22218
22237
  {
22219
22238
  className: 'text-right',
22220
- title: 'QUANTITY',
22239
+ title: 'Quantity',
22221
22240
  width: "minmax(min-content, 18%)",
22222
22241
  },
22223
22242
  {
22224
22243
  className: 'text-right',
22225
- title: 'UNIT PRICE',
22244
+ title: 'Unit price',
22226
22245
  width: "minmax(min-content, 18%)",
22227
22246
  },
22228
22247
  {
22229
22248
  className: 'text-right',
22230
- title: 'TOTAL',
22249
+ title: 'Total',
22231
22250
  width: "minmax(min-content, 18%)",
22232
22251
  },
22233
22252
  ];
22234
22253
  var ADDON_CARD_COLUMNS = [
22235
22254
  {
22236
- title: 'CHARGE',
22255
+ title: 'Charge',
22237
22256
  width: 'minmax(min-content, 21.6%)',
22238
22257
  },
22239
22258
  {
22240
- title: 'PERIOD',
22259
+ title: 'Period',
22241
22260
  width: 'minmax(min-content, 21.1%)',
22242
22261
  },
22243
22262
  {
22244
22263
  className: 'text-right',
22245
- title: 'QUANTITY',
22264
+ title: 'Quantity',
22246
22265
  width: "minmax(min-content, 19.1%)",
22247
22266
  },
22248
22267
  {
22249
22268
  className: 'text-right',
22250
- title: 'UNIT PRICE',
22269
+ title: 'Unit price',
22251
22270
  width: "minmax(min-content, 19.1%)",
22252
22271
  },
22253
22272
  {
22254
22273
  className: 'text-right',
22255
- title: 'TOTAL',
22274
+ title: 'Total',
22256
22275
  width: "minmax(min-content, 19.1%)",
22257
22276
  },
22258
22277
  ];
22259
22278
  var SubscriptionCardDesktop = function (_a) {
22260
- var _b;
22279
+ var _b, _c;
22261
22280
  var onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscription = _a.subscription, isAddon = _a.isAddon;
22262
22281
  var shadow = react.useContext(SubscriptionsContext).shadow;
22263
22282
  // Derived state
22264
22283
  var isTrial = ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.TRIAL;
22265
22284
  var CARD_COLUMNS = isAddon ? ADDON_CARD_COLUMNS : NON_ADDON_CARD_COLUMNS;
22266
- return (jsxRuntime.jsxs(Card, __assign({ className: "p-4 ".concat(shadow ? "shadow-".concat(shadow) : '') }, { children: [jsxRuntime.jsx(SubscriptionCardHeader, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }), jsxRuntime.jsx(antd.Divider, { className: "bunny-my-4", style: {
22285
+ return (jsxRuntime.jsxs(Card, __assign({ className: "bunny-p-4 ".concat(shadow ? "shadow-".concat(shadow) : '') }, { children: [jsxRuntime.jsx(SubscriptionCardHeader, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }), jsxRuntime.jsx(antd.Divider, { className: "bunny-my-4", style: {
22267
22286
  gridColumn: '1 / 5',
22268
22287
  width: 'calc(100% + 32px)',
22269
22288
  transform: 'translateX(-16px)',
22270
22289
  } }), jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-w-full", style: {
22271
22290
  gridTemplateColumns: CARD_COLUMNS.map(function (column) { return column.width; }).join(' '),
22272
22291
  rowGap: '0.75rem',
22273
- } }, { children: [jsxRuntime.jsx(SubscriptionCardColumnHeaders, { columns: CARD_COLUMNS }), subscription.charges.map(function (charge, chargeIndex) {
22292
+ } }, { children: [jsxRuntime.jsx(SubscriptionCardColumnHeaders, { columns: CARD_COLUMNS }), (_c = subscription === null || subscription === void 0 ? void 0 : subscription.chargeReport) === null || _c === void 0 ? void 0 : _c.map(function (charge, chargeIndex) {
22274
22293
  if ((isTrial && !charge.trial) || (!isTrial && charge.trial))
22275
22294
  return null;
22276
22295
  return (jsxRuntime.jsx(SubscriptionCardDesktopRow, { charge: charge, chargeIndex: chargeIndex, subscription: subscription }, chargeIndex));
22277
22296
  })] }))] })));
22278
22297
  };
22279
22298
  var SubscriptionCardDesktopRow = function (_a) {
22280
- var _b, _c;
22299
+ var _b, _c, _d;
22281
22300
  var charge = _a.charge, chargeIndex = _a.chargeIndex, subscription = _a.subscription;
22282
22301
  // Context
22283
22302
  var apiHost = react.useContext(BunnyContext).apiHost;
22284
22303
  var token = useToken();
22285
22304
  // Derived state
22286
22305
  var isRamp = charge.isRamp;
22287
- var prevCharge = subscription.charges[chargeIndex - 1];
22306
+ var prevCharge = (_b = subscription === null || subscription === void 0 ? void 0 : subscription.chargeReport) === null || _b === void 0 ? void 0 : _b[chargeIndex - 1];
22288
22307
  var isFirstRampRow = chargeIndex === 0 || (prevCharge === null || prevCharge === void 0 ? void 0 : prevCharge.priceListChargeId) !== charge.priceListChargeId;
22289
22308
  var chargePeriod = "".concat(common.formatDate(charge.startDate), " - ").concat(common.formatDate(charge.endDate));
22290
22309
  // Queries
@@ -22304,35 +22323,35 @@ var SubscriptionCardDesktopRow = function (_a) {
22304
22323
  var isDiscount = charge.kind === common.QuoteChangeKind.DISCOUNT;
22305
22324
  var dontShowChargeName = (prevCharge === null || prevCharge === void 0 ? void 0 : prevCharge.priceListChargeId) === charge.priceListChargeId &&
22306
22325
  !isDiscount &&
22307
- (!isTrial || prevCharge.trial) &&
22308
- (isTrial || !prevCharge.trial);
22326
+ (!isTrial || (prevCharge === null || prevCharge === void 0 ? void 0 : prevCharge.trial)) &&
22327
+ (isTrial || !(prevCharge === null || prevCharge === void 0 ? void 0 : prevCharge.trial));
22309
22328
  return (jsxRuntime.jsxs("div", __assign({ className: "bunny-contents" }, { children: [(isRampFirstRow || !isRamp) && (jsxRuntime.jsx(SubscriptionsListCell, __assign({ gridColumn: isRamp ? '1/-1' : '1' }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 ".concat(isDiscount ? 'bunny-pl-4' : '') }, { children: jsxRuntime.jsx("div", { children: isRampFirstRow || (!isRamp && !dontShowChargeName) ? charge.name : '' }) })) }))), jsxRuntime.jsx(SubscriptionsListCell, __assign({ gridColumn: 2 }, { children: jsxRuntime.jsx("div", { children: chargePeriod }) })), jsxRuntime.jsx(SubscriptionsListCell, __assign({ right: true }, { children: charge.kind === common.QuoteChangeKind.DISCOUNT
22310
22329
  ? ''
22311
22330
  : charge.chargeType === common.ChargeType.USAGE
22312
22331
  ? data && jsxRuntime.jsx(FeatureUsageGraph, { charge: charge, featureUsage: data })
22313
22332
  : charge.isAmendment
22314
- ? "+".concat((_b = charge.quantity) === null || _b === void 0 ? void 0 : _b.toLocaleString())
22315
- : (_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 }) }))] })));
22333
+ ? "+".concat((_c = charge.quantity) === null || _c === void 0 ? void 0 : _c.toLocaleString())
22334
+ : (_d = charge.quantity) === null || _d === void 0 ? void 0 : _d.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 }) }))] })));
22316
22335
  };
22317
22336
 
22318
22337
  function AddonSubscriptionsCards(_a) {
22319
- var onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscriptions = _a.subscriptions, subscription = _a.subscription, hideExpired = _a.hideExpired;
22338
+ var onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscriptions = _a.subscriptions, subscription = _a.subscription, showInactive = _a.showInactive;
22320
22339
  var addonSubscriptions = findAddonSubscriptions(subscription, subscriptions);
22321
22340
  if (addonSubscriptions.length === 0) {
22322
22341
  return null;
22323
22342
  }
22324
22343
  return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: addonSubscriptions.map(function (addonSubscription, addonSubscriptionIndex) {
22325
- if (hideExpired && isSubscriptionNotActive(addonSubscription))
22344
+ if (!showInactive && isSubscriptionNotActive(addonSubscription))
22326
22345
  return null;
22327
22346
  var isLast = addonSubscriptionIndex === addonSubscriptions.length - 1;
22328
22347
  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 }) }))] })));
22329
22348
  }) }));
22330
22349
  }
22331
22350
 
22332
- var Text$7 = antd.Typography.Text;
22351
+ var Text$c = antd.Typography.Text;
22333
22352
  var SubscriptionCardCellMobile = function (_a) {
22334
22353
  var children = _a.children, className = _a.className, style = _a.style;
22335
- return (jsxRuntime.jsx(Text$7, __assign({ className: className, style: style }, { children: children })));
22354
+ return (jsxRuntime.jsx(Text$c, __assign({ className: className, style: style }, { children: children })));
22336
22355
  };
22337
22356
 
22338
22357
  var CHARGE_COLUMNS = [
@@ -22353,50 +22372,51 @@ var CHARGE_COLUMNS = [
22353
22372
  },
22354
22373
  ];
22355
22374
  var SubscriptionCard = function (_a) {
22356
- var _b;
22375
+ var _b, _c;
22357
22376
  var subscription = _a.subscription;
22358
22377
  var darkMode = react.useContext(BunnyContext).darkMode;
22378
+ var shadow = react.useContext(SubscriptionsContext).shadow;
22359
22379
  // Derived state
22360
22380
  var isTrial = ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.TRIAL;
22361
22381
  var backgroundColor = darkMode ? 'var(--row-background-dark)' : 'var(--row-background)';
22362
- return (jsxRuntime.jsx(Card, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-p-4" }, { children: [jsxRuntime.jsx(SubscriptionCardHeader, { subscription: subscription }), jsxRuntime.jsx(antd.Divider, { className: "bunny-my-4", style: {
22363
- gridColumn: '1 / -1',
22364
- width: 'calc(100% + 32px)',
22365
- transform: 'translateX(-16px)',
22366
- } }), jsxRuntime.jsxs("div", __assign({ className: "bunny-grid", style: {
22367
- columnGap: '0.5rem',
22368
- gridTemplateColumns: "1fr auto auto auto",
22369
- rowGap: '0.75rem',
22370
- backgroundColor: backgroundColor,
22371
- } }, { children: [CHARGE_COLUMNS.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: "bunny-text-slate-400 ".concat(subscriptionColumn.className), style: { fontSize: '11px' } }, { children: subscriptionColumn.title }), index)); }), subscription.charges.map(function (charge, chargeIndex) {
22372
- if ((isTrial && !charge.trial) || (!isTrial && charge.trial))
22373
- return null;
22374
- var isRamp = charge.isRamp;
22375
- var chargePeriod = "".concat(common.formatDate(charge.startDate), " - ").concat(common.formatDate(charge.endDate));
22376
- return (jsxRuntime.jsxs("div", __assign({ className: "bunny-contents" }, { children: [((isRamp && chargeIndex === 0) || !isRamp) && (jsxRuntime.jsxs(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[0].className, style: { gridColumn: isRamp ? '1/-1' : '1' } }, { children: [jsxRuntime.jsx("span", { children: charge.name }), !isRamp ? " - ".concat(chargePeriod) : ''] }))), isRamp && (jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[0].className }, { children: "- ".concat(chargePeriod) }))), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[1].className }, { children: charge.kind === common.QuoteChangeKind.DISCOUNT ? '' : charge.quantity })), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[2].className }, { children: jsxRuntime.jsx(SubscriptionChargeUnitPrice, { charge: charge, currencyId: subscription.currencyId }) })), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[3].className }, { children: jsxRuntime.jsx(SubscriptionChargeTotal, { charge: charge, subscription: subscription }) }))] }), chargeIndex));
22377
- })] }))] })) }));
22382
+ return (jsxRuntime.jsxs(Card, __assign({ className: "bunny-flex bunny-flex-col bunny-p-4 ".concat(shadow ? "shadow-".concat(shadow) : '') }, { children: [jsxRuntime.jsx(SubscriptionCardHeader, { subscription: subscription }), jsxRuntime.jsx(antd.Divider, { className: "bunny-my-4", style: {
22383
+ gridColumn: '1 / -1',
22384
+ width: 'calc(100% + 32px)',
22385
+ transform: 'translateX(-16px)',
22386
+ } }), jsxRuntime.jsxs("div", __assign({ className: "bunny-grid", style: {
22387
+ columnGap: '0.5rem',
22388
+ gridTemplateColumns: "1fr auto auto auto",
22389
+ rowGap: '0.75rem',
22390
+ backgroundColor: backgroundColor,
22391
+ } }, { children: [CHARGE_COLUMNS.map(function (subscriptionColumn, index) { return (jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: "bunny-text-slate-400 ".concat(subscriptionColumn.className), style: { fontSize: '11px' } }, { children: subscriptionColumn.title }), index)); }), (_c = subscription === null || subscription === void 0 ? void 0 : subscription.chargeReport) === null || _c === void 0 ? void 0 : _c.map(function (charge, chargeIndex) {
22392
+ if ((isTrial && !charge.trial) || (!isTrial && charge.trial))
22393
+ return null;
22394
+ var isRamp = charge.isRamp;
22395
+ var chargePeriod = "".concat(common.formatDate(charge.startDate), " - ").concat(common.formatDate(charge.endDate));
22396
+ return (jsxRuntime.jsxs("div", __assign({ className: "bunny-contents" }, { children: [((isRamp && chargeIndex === 0) || !isRamp) && (jsxRuntime.jsxs(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[0].className, style: { gridColumn: isRamp ? '1/-1' : '1' } }, { children: [jsxRuntime.jsx("span", { children: charge.name }), !isRamp ? " - ".concat(chargePeriod) : ''] }))), isRamp && (jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[0].className }, { children: "- ".concat(chargePeriod) }))), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[1].className }, { children: charge.kind === common.QuoteChangeKind.DISCOUNT ? '' : charge.quantity })), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[2].className }, { children: jsxRuntime.jsx(SubscriptionChargeUnitPrice, { charge: charge, currencyId: subscription.currencyId }) })), jsxRuntime.jsx(SubscriptionCardCellMobile, __assign({ className: CHARGE_COLUMNS[3].className }, { children: jsxRuntime.jsx(SubscriptionChargeTotal, { charge: charge, subscription: subscription }) }))] }), chargeIndex));
22397
+ })] }))] })));
22378
22398
  };
22379
22399
 
22380
22400
  var SubscriptionsList = function (_a) {
22381
- var hideExpired = _a.hideExpired, onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscriptions = _a.subscriptions;
22401
+ var showInactive = _a.showInactive, onChangePlanClick = _a.onChangePlanClick, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, subscriptions = _a.subscriptions;
22382
22402
  var isMobile = common.useIsMobile();
22383
22403
  var nonAddonSubscriptions = findNonAddonSubscriptions(subscriptions);
22384
22404
  return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: nonAddonSubscriptions === null || nonAddonSubscriptions === void 0 ? void 0 : nonAddonSubscriptions.map(function (subscription, subscriptionIndex) {
22385
- if (hideExpired && isSubscriptionNotActive(subscription))
22405
+ if (!showInactive && isSubscriptionNotActive(subscription))
22386
22406
  return null;
22387
22407
  if (isMobile)
22388
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCard, { subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, hideExpired: hideExpired })] }));
22389
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCardDesktop, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, hideExpired: hideExpired })] }));
22408
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCard, { subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, showInactive: showInactive })] }));
22409
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(SubscriptionCardDesktop, { onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription }, subscriptionIndex), jsxRuntime.jsx(AddonSubscriptionsCards, { onCancelSubscriptionClick: onCancelSubscriptionClick, subscription: subscription, subscriptions: subscriptions, showInactive: showInactive })] }));
22390
22410
  }) }));
22391
22411
  };
22392
22412
 
22393
22413
  var SubscriptionsListContainer = function (_a) {
22394
- 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;
22414
+ var companyName = _a.companyName, _b = _a.showInactive, showInactive = _b === void 0 ? false : _b, onCancelSubscriptionClick = _a.onCancelSubscriptionClick, onChangePlanClick = _a.onChangePlanClick, noSubscriptionsComponent = _a.noSubscriptionsComponent, subscriptions = _a.subscriptions, subscriptionsAreLoading = _a.subscriptionsAreLoading;
22395
22415
  // Context
22396
22416
  var gap = react.useContext(SubscriptionsContext).gap;
22397
22417
  if (subscriptionsAreLoading)
22398
22418
  return jsxRuntime.jsx(jsxRuntime.Fragment, {});
22399
- 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, 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") }) })))) }));
22419
+ 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") }, { children: jsxRuntime.jsx(SubscriptionsList, { showInactive: showInactive, onChangePlanClick: onChangePlanClick, onCancelSubscriptionClick: onCancelSubscriptionClick, 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") }) })))) }));
22400
22420
  };
22401
22421
 
22402
22422
  var useQuoteCreate = function (_a) {
@@ -22793,20 +22813,6 @@ function QuoteProvider(_a) {
22793
22813
  } }, { children: children })));
22794
22814
  }
22795
22815
 
22796
- var PageTitle = function (_a) {
22797
- var onGoBack = _a.onGoBack, title = _a.title;
22798
- var isMobile = common.useIsMobile();
22799
- var secondaryColor = react.useContext(BrandContext).secondaryColor;
22800
- return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-3 bunny-font-medium", style: {
22801
- fontSize: '28px',
22802
- paddingBottom: isMobile ? '22px' : '56px',
22803
- color: secondaryColor,
22804
- } }, { children: [onGoBack && (jsxRuntime.jsx(icons.ArrowLeftOutlined, { onClick: onGoBack, style: {
22805
- fontSize: '20px',
22806
- cursor: 'pointer',
22807
- } })), title] })));
22808
- };
22809
-
22810
22816
  function isAddonPurchased(featureAddon, currentSubscription) {
22811
22817
  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; });
22812
22818
  if (!purchasedFeatureAddons)
@@ -22836,6 +22842,7 @@ function featureAddonSwitchTestId(featureAddon) {
22836
22842
  return "feature-addon-switch-".concat(name);
22837
22843
  }
22838
22844
 
22845
+ var Text$b = antd.Typography.Text;
22839
22846
  var CheckoutBarInput = function (_a) {
22840
22847
  var _b;
22841
22848
  var disabled = _a.disabled, charge = _a.charge, quantity = _a.quantity, onQuantityChanged = _a.onQuantityChanged;
@@ -22865,7 +22872,7 @@ var QuantityLabel = function (_a) {
22865
22872
  var pluralizedFeatureName = (common.StringUtils.isStringPluralized(featureName) || !featureName
22866
22873
  ? featureName
22867
22874
  : common.StringUtils.pluralizeEntityName(featureName)) || '';
22868
- return (jsxRuntime.jsx("span", __assign({ className: "bunny-text-slate-500 bunny-font-medium", style: { fontSize: '11px' } }, { children: pluralizedFeatureName.toUpperCase() })));
22875
+ return (jsxRuntime.jsx(Text$b, __assign({ className: "bunny-text-slate-500 bunny-font-medium bunny-text-nowrap", style: { fontSize: '11px' } }, { children: pluralizedFeatureName.toUpperCase() })));
22869
22876
  };
22870
22877
 
22871
22878
  var removeHTMLTagsRegex = /<br>(?=(?:\s*<[^>]*>)*$)|(<br>)|<[^>]*>/gi;
@@ -22972,6 +22979,7 @@ var CheckoutPrice = function (_a) {
22972
22979
  : "" })));
22973
22980
  };
22974
22981
 
22982
+ var Text$a = antd.Typography.Text;
22975
22983
  var CheckoutBarSummarySection = function (_a) {
22976
22984
  var _b;
22977
22985
  var open = _a.open, selectedPriceList = _a.selectedPriceList, onClickCheckout = _a.onClickCheckout;
@@ -23003,7 +23011,7 @@ var CheckoutBarSummarySection = function (_a) {
23003
23011
  var activeCharge = (_b = getActivePlanPriceData(selectedPriceList, selectedPriceList)) === null || _b === void 0 ? void 0 : _b.activeCharge;
23004
23012
  var isUsage = (activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.chargeType) === common.ChargeType.USAGE;
23005
23013
  var hasPaymentPlugins = Boolean(paymentPlugins === null || paymentPlugins === void 0 ? void 0 : paymentPlugins.length);
23006
- 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: isQuotePending || isUpdatingQuote, tooltipText: !hasPaymentPlugins
23014
+ return (jsxRuntime.jsxs(Text$a, __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: isQuotePending || isUpdatingQuote, tooltipText: !hasPaymentPlugins
23007
23015
  ? 'Cannot checkout. No valid payment plugins found. Please contact your administrator.'
23008
23016
  : undefined })] })));
23009
23017
  };
@@ -23034,7 +23042,7 @@ var PlanPickerCheckoutBar = function (_a) {
23034
23042
  showSuccessNotification('Your subscription has been created', 'Checkout successful');
23035
23043
  onCheckoutSuccess();
23036
23044
  };
23037
- 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) {
23045
+ return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'bunny-flex-col bunny-gap-4' : 'bunny-flex-row', " bunny-my-4 bunny-p-4 bunny-justify-between bunny-bg-white bunny-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) {
23038
23046
  var _a, _b;
23039
23047
  if (!canEditChargeQuantity(charge))
23040
23048
  return null;
@@ -23057,7 +23065,7 @@ var PlanPickerCheckoutBar = function (_a) {
23057
23065
  }) })), jsxRuntime.jsx(CheckoutBarSummarySection, { onClickCheckout: function () { return setPayModalVisible(true); }, open: payModalVisible, selectedPriceList: selectedPriceList }), 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, token: token, isUpdatingQuote: isUpdatingQuote })] })));
23058
23066
  };
23059
23067
 
23060
- var Text$6 = antd.Typography.Text;
23068
+ var Text$9 = antd.Typography.Text;
23061
23069
  var BillingPeriodSelector = function (_a) {
23062
23070
  var availableBillingPeriods = _a.availableBillingPeriods, onChangeBillingPeriod = _a.onChangeBillingPeriod, products = _a.products, selectedBillingPeriod = _a.selectedBillingPeriod, selectedProduct = _a.selectedProduct, onChangeProduct = _a.onChangeProduct;
23063
23071
  var _b = react.useContext(BrandContext), secondaryColor = _b.secondaryColor, brandColor = _b.brandColor;
@@ -23068,7 +23076,7 @@ var BillingPeriodSelector = function (_a) {
23068
23076
  color: secondaryColor,
23069
23077
  } }, { children: "Select product" })), jsxRuntime.jsx(ProductRadioStyled, __assign({ brandColor: brandColor }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
23070
23078
  onChangeProduct(products === null || products === void 0 ? void 0 : products.find(function (product) { return product.id === e.target.value; }));
23071
- }, 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$6, __assign({ className: "bunny-font-medium bunny-text-xs", style: {
23079
+ }, 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$9, __assign({ className: "bunny-font-medium bunny-text-sm", style: {
23072
23080
  color: secondaryColor,
23073
23081
  } }, { children: "Subscription term" }))), jsxRuntime.jsx(StyledRadioGroup, __assign({ className: "bunny-w-full", "$isMobile": isMobile }, { children: jsxRuntime.jsx(antd.Radio.Group, __assign({ onChange: function (e) {
23074
23082
  onChangeBillingPeriod(e.target.value);
@@ -23085,6 +23093,32 @@ var StyledRadioGroup = styled__default["default"].div(templateObject_2 || (templ
23085
23093
  });
23086
23094
  var templateObject_1, templateObject_2;
23087
23095
 
23096
+ var ADDON_PLANS_QUERY = function () { return "\n query PriceList($id: ID!) {\n priceList (id: $id) {\n addonPlans {\n addon\n basePrice\n code\n contactUsLabel\n contactUsUrl\n description\n id\n isVisible\n name\n position\n pricingDescription\n pricingStyle\n productId\n selfServiceBuy\n selfServiceCancel\n selfServiceRenew\n priceLists {\n isVisible\n id\n periodMonths\n showPriceAsMonthly\n monthlyBasePrice\n basePrice\n currencyId\n plan {\n pricingStyle\n name\n description\n }\n charges {\n basePrice\n billingPeriod\n chargeType\n }\n }\n planFeatures {\n featureId\n value\n feature {\n name\n }\n }\n }\n }\n }\n"; };
23097
+ var getAddonPlans = function (_a) {
23098
+ var token = _a.token, id = _a.id, apiHost = _a.apiHost;
23099
+ return __awaiter(void 0, void 0, void 0, function () {
23100
+ var response, addonPlans, visibleAddonPlans;
23101
+ var _b;
23102
+ return __generator(this, function (_c) {
23103
+ switch (_c.label) {
23104
+ case 0: return [4 /*yield*/, gqlRequest({
23105
+ query: ADDON_PLANS_QUERY(),
23106
+ token: token,
23107
+ vars: { id: id },
23108
+ apiHost: apiHost,
23109
+ })];
23110
+ case 1:
23111
+ response = _c.sent();
23112
+ addonPlans = (_b = response === null || response === void 0 ? void 0 : response.priceList) === null || _b === void 0 ? void 0 : _b.addonPlans;
23113
+ visibleAddonPlans = addonPlans.map(function (addonPlan) {
23114
+ return __assign(__assign({}, addonPlan), { priceLists: addonPlan.priceLists.filter(function (priceList) { return priceList.isVisible; }) });
23115
+ });
23116
+ return [2 /*return*/, visibleAddonPlans];
23117
+ }
23118
+ });
23119
+ });
23120
+ };
23121
+
23088
23122
  var NextPriceListButton = function (_a) {
23089
23123
  var availablePriceLists = _a.availablePriceLists, priceListStart = _a.priceListStart, setPriceListStart = _a.setPriceListStart, numberOfPlansToDisplay = _a.numberOfPlansToDisplay;
23090
23124
  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 () {
@@ -23138,26 +23172,25 @@ var PriceListCardButton = function (_a) {
23138
23172
  if (isPriceListCurrentSubscription && canUpgradeFromTrialExpired)
23139
23173
  return 'Upgrade';
23140
23174
  if (isPriceListCurrentSubscription)
23141
- return 'Current';
23142
- if (isSelected)
23143
- return 'Selected';
23175
+ return 'Current plan';
23144
23176
  if (subscriptionPlan && !isPriceListNonSubscribedCurrentPlan)
23145
23177
  return 'Subscribed';
23146
23178
  if (priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US)
23147
23179
  return priceList.plan.contactUsLabel;
23148
- return 'Select';
23180
+ return 'Change to';
23149
23181
  };
23150
23182
  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: {
23151
23183
  maxWidth: '240px',
23152
23184
  }, type: isSelected ? 'primary' : 'default' }, { children: createButtonText() })) })) })));
23153
23185
  };
23154
23186
 
23155
- var Text$5 = antd.Typography.Text;
23187
+ var Text$8 = antd.Typography.Text;
23156
23188
  var PriceListCardDescription = function (_a) {
23157
23189
  var description = _a.description;
23158
- return (jsxRuntime.jsx(Text$5, __assign({ className: "bunny-text-center" }, { children: jsxRuntime.jsx(interweave.Markup, { content: description }) })));
23190
+ return (jsxRuntime.jsx(Text$8, __assign({ className: "bunny-text-gray-400 bunny-text-xs" }, { children: jsxRuntime.jsx(interweave.Markup, { content: description }) })));
23159
23191
  };
23160
23192
 
23193
+ var Text$7 = antd.Typography.Text;
23161
23194
  var getPrice = function (priceList) {
23162
23195
  if (priceList.showPriceAsMonthly) {
23163
23196
  return priceList.monthlyBasePrice;
@@ -23180,7 +23213,7 @@ var calculatePriceDecimals = function (priceList) {
23180
23213
  var PriceListCardPrice = function (_a) {
23181
23214
  var priceList = _a.priceList, _b = _a.fontSize, fontSize = _b === void 0 ? '32px' : _b;
23182
23215
  var priceDecimals = calculatePriceDecimals(priceList);
23183
- 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
23216
+ return (jsxRuntime.jsx(Text$7, __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
23184
23217
  ? common.formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
23185
23218
  : priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US
23186
23219
  ? ''
@@ -23190,33 +23223,31 @@ var PriceListCardPrice = function (_a) {
23190
23223
  var isEmptyHtml = function (html) {
23191
23224
  return /^<[^>]*>(\s*)<\/[^>]*>$/.test(html);
23192
23225
  };
23193
- var Text$4 = antd.Typography.Text;
23226
+ var Text$6 = antd.Typography.Text;
23194
23227
  var PriceListCardPriceDescription = function (_a) {
23195
23228
  var feature = _a.feature, priceList = _a.priceList;
23196
- var isMobile = common.useIsMobile();
23197
23229
  var doesPlanHaveFlatFeeCharges = priceList.charges.some(function (charge) { return charge.pricingModel === common.PricingModel.FLAT && charge.basePrice > 0; });
23198
23230
  if (priceList.periodMonths <= 0 || priceList.plan.pricingStyle !== common.PricingStyle.PRICED)
23199
23231
  return null;
23200
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text$4, __assign({ className: "bunny-text-center bunny-text-gray-900", style: {
23201
- fontSize: isMobile ? '13px' : '12px',
23202
- } }, { children: priceList.plan.pricingDescription && !isEmptyHtml(priceList.plan.pricingDescription) ? (jsxRuntime.jsx(interweave.Markup, { content: priceList.plan.pricingDescription })) : (PriceDescriptionString({
23232
+ return (jsxRuntime.jsxs(Text$6, __assign({ className: "bunny-text-start bunny-text-gray-400 bunny-text-sm" }, { children: [jsxRuntime.jsx("div", { children: priceList.plan.pricingDescription && !isEmptyHtml(priceList.plan.pricingDescription) ? (jsxRuntime.jsx(interweave.Markup, { content: priceList.plan.pricingDescription })) : (PriceDescriptionString({
23203
23233
  unitName: feature === null || feature === void 0 ? void 0 : feature.unitName,
23204
23234
  showPriceAsMonthly: priceList.showPriceAsMonthly,
23205
23235
  periodMonths: priceList.periodMonths,
23206
23236
  doesPlanHaveFlatFeeCharges: doesPlanHaveFlatFeeCharges,
23207
- })) })), priceList.periodMonths > 1 && (jsxRuntime.jsxs(Text$4, __assign({ className: "bunny-text-center bunny-text-gray-900", style: { fontSize: isMobile ? '12px' : '11px' } }, { children: ["billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] })))] }));
23237
+ })) }), priceList.periodMonths > 1 && (jsxRuntime.jsxs("div", { children: ["Billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] }))] })));
23208
23238
  };
23209
23239
  function PriceDescriptionString(_a) {
23210
23240
  var unitName = _a.unitName, showPriceAsMonthly = _a.showPriceAsMonthly, periodMonths = _a.periodMonths, doesPlanHaveFlatFeeCharges = _a.doesPlanHaveFlatFeeCharges;
23211
- return "per ".concat(unitName && !doesPlanHaveFlatFeeCharges ? "".concat(unitName.toLowerCase(), " / ") : '').concat(showPriceAsMonthly ? 'month' : common.PERIOD_LABELS[periodMonthsConverter(periodMonths)]);
23241
+ return "Per ".concat(unitName && !doesPlanHaveFlatFeeCharges ? "".concat(unitName.toLowerCase(), " / ") : '').concat(showPriceAsMonthly ? 'month' : common.PERIOD_LABELS[periodMonthsConverter(periodMonths)]);
23212
23242
  }
23213
23243
 
23244
+ var Text$5 = antd.Typography.Text;
23214
23245
  var PriceListCardTitle = function (_a) {
23215
23246
  var priceList = _a.priceList, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, trialRemainingDays = _a.trialRemainingDays;
23216
23247
  var isMobile = common.useIsMobile();
23217
- 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
23248
+ return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4" }, { children: [Boolean(trialRemainingDays) && (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-secondary", style: { height: '1rem' } }, { children: isPriceListCurrentSubscription
23218
23249
  ? "Trial ends in ".concat(trialRemainingDays, " day").concat(trialRemainingDays === 1 ? '' : 's')
23219
- : ' ' }))), 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 }))] })));
23250
+ : ' ' }))), jsxRuntime.jsx(Text$5, __assign({ className: "bunny-font-medium bunny-text-xl bunny-text-center ".concat(isMobile ? 'bunny-text-slate-500' : 'bunny-text-orange-600') }, { children: priceList.plan.name }))] })));
23220
23251
  };
23221
23252
 
23222
23253
  var PLAN_GRID_PADDING = 4;
@@ -23225,12 +23256,12 @@ var PlanPickerGridCell = function (_a) {
23225
23256
  var isMobile = common.useIsMobile();
23226
23257
  return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col", style: isMobile
23227
23258
  ? {}
23228
- : __assign({}, (noBorder ? {} : { borderLeft: "1px solid ".concat(common.SLATE_200) })) }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-grow" }, { children: children })), !isMobile && jsxRuntime.jsx(antd.Divider, {})] })));
23259
+ : __assign({}, (noBorder ? {} : { borderLeft: "1px solid ".concat(common.SLATE_200) })) }, { children: [jsxRuntime.jsx("div", __assign({ className: "bunny-grow" }, { children: children })), jsxRuntime.jsx("div", { className: "bunny-mt-4" })] })));
23229
23260
  };
23230
23261
 
23231
23262
  var PriceListCardDesktop = function (_a) {
23232
23263
  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, onClickPriceListCard = _a.onClickPriceListCard;
23233
- 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 () {
23264
+ return (jsxRuntime.jsx(PlanPickerGridCell, __assign({ noBorder: noBorder }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-start bunny-justify-between bunny-w-full bunny-rounded-md bunny-gap-4 bunny-pt-4 bunny-px-4 ".concat(disableSelectCurrentPlan ? '' : 'cursor-pointer', " bunny-box-border"), onClick: function () {
23234
23265
  if (!disableSelectCurrentPlan) {
23235
23266
  if (priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US) {
23236
23267
  window.open(priceList.plan.contactUsUrl, '_blank');
@@ -23241,7 +23272,7 @@ var PriceListCardDesktop = function (_a) {
23241
23272
  }
23242
23273
  }, style: {
23243
23274
  height: '100%',
23244
- } }, { 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 }))] })) })));
23275
+ } }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-8 bunny-h-full bunny-justify-between" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-start 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-start bunny-gap-0" }, { 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 }))] })) })));
23245
23276
  };
23246
23277
 
23247
23278
  var CheckIcon = function (_a) {
@@ -23423,31 +23454,7 @@ var useQuoteUpdateFeatureAddon = function (quote, featureAddon) {
23423
23454
  };
23424
23455
  };
23425
23456
 
23426
- var shouldColorRow = function (_a) {
23427
- var isFeatureGroup = _a.isFeatureGroup, rowIndex = _a.rowIndex;
23428
- return !isFeatureGroup && rowIndex % 2 === 1;
23429
- };
23430
- var FeatureGridCell = function (_a) {
23431
- var children = _a.children, isFeatureGroup = _a.isFeatureGroup, noBorder = _a.noBorder, rowIndex = _a.rowIndex;
23432
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-px-".concat(PLAN_GRID_PADDING, " bunny-py-2"), style: __assign(__assign({}, (noBorder ? {} : { borderLeft: "1px solid ".concat(common.SLATE_200) })), (shouldColorRow({
23433
- isFeatureGroup: isFeatureGroup,
23434
- rowIndex: rowIndex,
23435
- })
23436
- ? { backgroundColor: common.SLATE_100 }
23437
- : {})) }, { children: children })));
23438
- };
23439
-
23440
- var PlanFeatureAddons = function (_a) {
23441
- var displayPriceLists = _a.displayPriceLists, plansToDisplay = _a.plansToDisplay;
23442
- var uniquePlanFeatures = filterUniqueFeatures({ availablePriceLists: displayPriceLists });
23443
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(FeatureGridCell, { isFeatureGroup: true, noBorder: true, rowIndex: 0 }), __spreadArray([], Array(plansToDisplay), true).map(function (_, planIndex) {
23444
- var priceList = uniquePlanFeatures[planIndex];
23445
- var prevPriceList = displayPriceLists[planIndex - 1];
23446
- if (!priceList)
23447
- return (jsxRuntime.jsx("div", { style: prevPriceList ? { borderLeft: "1px solid ".concat(common.SLATE_200) } : {} }, planIndex));
23448
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4", style: { borderLeft: "1px solid ".concat(common.SLATE_200) } }, { children: jsxRuntime.jsx(FeatureAddonsList, { priceList: priceList }) }), planIndex));
23449
- })] }));
23450
- };
23457
+ var Text$4 = antd.Typography.Text;
23451
23458
  function FeatureAddonsList(_a) {
23452
23459
  var _b;
23453
23460
  var priceList = _a.priceList;
@@ -23473,7 +23480,7 @@ function FeatureAddonRow(_a) {
23473
23480
  periodMonths: priceList.periodMonths,
23474
23481
  doesPlanHaveFlatFeeCharges: false,
23475
23482
  }) }))] }));
23476
- 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, { id: featureAddonSwitchTestId(featureAddon), size: "small", loading: isPending, disabled: isDisabled || !quote, checked: checked, onChange: function (checked) {
23483
+ 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-gap-1" }, { children: [jsxRuntime.jsxs(Text$4, __assign({ className: "bunny-flex bunny-text-sm bunny-items-center bunny-gap-1 bunny-text-gray-600" }, { 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, { id: featureAddonSwitchTestId(featureAddon), size: "small", loading: isPending, disabled: isDisabled || !quote, checked: checked, onChange: function (checked) {
23477
23484
  if (checked) {
23478
23485
  handleAddFeatureAddon();
23479
23486
  }
@@ -23506,7 +23513,7 @@ var EverythingPlanFeatures = function (_a) {
23506
23513
  var displayPriceLists = _a.displayPriceLists, selectedProduct = _a.selectedProduct, plansToDisplay = _a.plansToDisplay, _b = _a.hideBorder, hideBorder = _b === void 0 ? false : _b;
23507
23514
  var brandColor = react.useContext(BrandContext).brandColor;
23508
23515
  var uniquePlanFeatures = filterUniqueFeatures({ availablePriceLists: displayPriceLists });
23509
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: __spreadArray([], Array(plansToDisplay), true).map(function (_, planIndex) {
23516
+ return (jsxRuntime.jsx(GridTemplateColumnsWrapper, __assign({ everythingInPlus: true, plansToDisplay: plansToDisplay, className: "bunny-grid bunny-w-full shadow-md bunny-rounded-md bunny-p-0 bg-white" }, { children: __spreadArray([], Array(plansToDisplay), true).map(function (_, planIndex) {
23510
23517
  var priceList = uniquePlanFeatures[planIndex];
23511
23518
  var prevPriceList = displayPriceLists[planIndex - 1];
23512
23519
  if (!priceList)
@@ -23517,7 +23524,33 @@ var EverythingPlanFeatures = function (_a) {
23517
23524
  var everythingInPlus = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.everythingInPlus;
23518
23525
  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));
23519
23526
  }), jsxRuntime.jsx(FeatureAddonsList, { priceList: priceList })] }), planIndex));
23520
- }) }));
23527
+ }) })));
23528
+ };
23529
+
23530
+ var shouldColorRow = function (_a) {
23531
+ var isFeatureGroup = _a.isFeatureGroup, rowIndex = _a.rowIndex;
23532
+ return !isFeatureGroup && rowIndex % 2 === 1;
23533
+ };
23534
+ var FeatureGridCell = function (_a) {
23535
+ var children = _a.children, isFeatureGroup = _a.isFeatureGroup, noBorder = _a.noBorder, rowIndex = _a.rowIndex;
23536
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-px-".concat(PLAN_GRID_PADDING, " bunny-py-2"), style: __assign(__assign({}, (noBorder ? {} : { borderLeft: "1px solid ".concat(common.SLATE_200) })), (shouldColorRow({
23537
+ isFeatureGroup: isFeatureGroup,
23538
+ rowIndex: rowIndex,
23539
+ })
23540
+ ? { backgroundColor: common.SLATE_100 }
23541
+ : {})) }, { children: children })));
23542
+ };
23543
+
23544
+ var PlanFeatureAddons = function (_a) {
23545
+ var displayPriceLists = _a.displayPriceLists, plansToDisplay = _a.plansToDisplay, everythingInPlus = _a.everythingInPlus;
23546
+ var uniquePlanFeatures = filterUniqueFeatures({ availablePriceLists: displayPriceLists });
23547
+ return (jsxRuntime.jsxs(GridTemplateColumnsWrapper, __assign({ className: "bunny-grid bunny-w-full shadow-md bunny-rounded-md bunny-p-0 bg-white", everythingInPlus: everythingInPlus, plansToDisplay: plansToDisplay }, { children: [jsxRuntime.jsx(FeatureGridCell, { isFeatureGroup: true, noBorder: true, rowIndex: 0 }), __spreadArray([], Array(plansToDisplay), true).map(function (_, planIndex) {
23548
+ var priceList = uniquePlanFeatures[planIndex];
23549
+ var prevPriceList = displayPriceLists[planIndex - 1];
23550
+ if (!priceList)
23551
+ return (jsxRuntime.jsx("div", { style: prevPriceList ? { borderLeft: "1px solid ".concat(common.SLATE_200) } : {} }, planIndex));
23552
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4", style: { borderLeft: "1px solid ".concat(common.SLATE_200) } }, { children: jsxRuntime.jsx(FeatureAddonsList, { priceList: priceList }) }), planIndex));
23553
+ })] })));
23521
23554
  };
23522
23555
 
23523
23556
  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");
@@ -23660,52 +23693,66 @@ var useToggleAddonPlan = function (quote, addonPriceList, selectedPriceList, set
23660
23693
 
23661
23694
  var Text$3 = antd.Typography.Text;
23662
23695
  var PlanFeatures = function (_a) {
23663
- var _b;
23664
- var displayPriceLists = _a.displayPriceLists, selectedProduct = _a.selectedProduct, plansToDisplay = _a.plansToDisplay;
23665
- var featureGroupCounter = react.useRef(0);
23666
- var visibleFeatureCounter = react.useRef(1);
23696
+ var displayPriceLists = _a.displayPriceLists, features = _a.features, plansToDisplay = _a.plansToDisplay;
23667
23697
  var brandColor = react.useContext(BrandContext).brandColor;
23668
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: (_b = selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.features) === null || _b === void 0 ? void 0 : _b.map(function (feature, featureIndex) {
23669
- if (!selectedProduct.features)
23670
- return null;
23671
- var isFeatureGroup = (feature === null || feature === void 0 ? void 0 : feature.kind) === 'GROUP';
23698
+ var organizeFeaturesIntoGroups = function (features) {
23699
+ var groups = [];
23700
+ var currentGroup = { features: [] };
23701
+ features.forEach(function (feature) {
23672
23702
  if (!feature.isVisible)
23673
- return null;
23674
- // Initialize the feature group counter and the visible feature counter
23675
- if (featureIndex === 0) {
23676
- featureGroupCounter.current = 0;
23677
- visibleFeatureCounter.current = 1;
23703
+ return;
23704
+ if (feature.kind === 'GROUP') {
23705
+ // If we have features in the current group, save it
23706
+ if (currentGroup.features.length > 0) {
23707
+ groups.push(currentGroup);
23708
+ }
23709
+ // Start a new group with this GROUP feature as the title
23710
+ currentGroup = { groupFeature: feature, features: [] };
23678
23711
  }
23679
- var rowIndex = visibleFeatureCounter.current;
23680
- // Increment the feature group counter if the feature is a group
23681
- if (isFeatureGroup) {
23682
- if (rowIndex % 2 === 1)
23683
- featureGroupCounter.current = featureGroupCounter.current + 1;
23712
+ else {
23713
+ // Add regular feature to current group
23714
+ currentGroup.features.push(feature);
23684
23715
  }
23685
- // Increment the row index by the feature group counter
23686
- rowIndex = rowIndex + featureGroupCounter.current;
23687
- // Increment the visible feature counter
23688
- visibleFeatureCounter.current = visibleFeatureCounter.current + 1;
23689
- return (jsxRuntime.jsxs("div", __assign({ className: "bunny-contents" }, { children: [jsxRuntime.jsx(FeatureGridCell, __assign({ isFeatureGroup: isFeatureGroup, noBorder: true, rowIndex: rowIndex }, { children: jsxRuntime.jsx(FeatureTitle, { isFeatureGroup: isFeatureGroup, feature: feature }) })), __spreadArray([], Array(plansToDisplay), true).map(function (_, columnIndex) {
23690
- var _a;
23691
- var priceList = displayPriceLists[columnIndex];
23692
- var plan = priceList.plan;
23693
- var doesHavePrevPlan = displayPriceLists[columnIndex - 1];
23694
- columnIndex = columnIndex + 1;
23695
- // Check if the plan has the feature
23696
- var planFeature = (_a = plan === null || plan === void 0 ? void 0 : plan.planFeatures) === null || _a === void 0 ? void 0 : _a.find(function (f) { return f.featureId === (feature === null || feature === void 0 ? void 0 : feature.id); });
23697
- if (!plan)
23698
- return (jsxRuntime.jsx(FeatureGridCell, { rowIndex: rowIndex, noBorder: !Boolean(doesHavePrevPlan) }, columnIndex));
23699
- if (isFeatureGroup)
23700
- return jsxRuntime.jsx(FeatureGridCell, { isFeatureGroup: true, rowIndex: rowIndex }, columnIndex);
23701
- return (jsxRuntime.jsx(FeatureGridCell, __assign({ rowIndex: rowIndex }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-text-center" }, { children: planFeature ? ((planFeature === null || planFeature === void 0 ? void 0 : planFeature.value) ? (planFeature.value) : (jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "15px" }))) : (jsxRuntime.jsx(Text$3, __assign({ className: "bunny-text-gray" }, { children: "-" }))) })) }), columnIndex));
23702
- })] }), rowIndex));
23703
- }) }));
23716
+ });
23717
+ // Don't forget to add the last group
23718
+ if (currentGroup.features.length > 0 || currentGroup.groupFeature) {
23719
+ groups.push(currentGroup);
23720
+ }
23721
+ // If no groups were created (no GROUP features), create one default group
23722
+ if (groups.length === 0) {
23723
+ groups.push({ features: features.filter(function (f) { return f.isVisible; }) });
23724
+ }
23725
+ return groups;
23726
+ };
23727
+ var featureGroups = organizeFeaturesIntoGroups(features || []);
23728
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: featureGroups === null || featureGroups === void 0 ? void 0 : featureGroups.map(function (group) {
23729
+ var featureGroup = group.groupFeature;
23730
+ var features = group.features;
23731
+ var isFeatureGroup = featureGroup ? true : false;
23732
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [featureGroup ? (jsxRuntime.jsx("div", __assign({ className: "bunny-pt-4" }, { children: jsxRuntime.jsx(FeatureTitle, { isFeatureGroup: isFeatureGroup, feature: featureGroup }) }))) : (jsxRuntime.jsx("div", { className: "bunny-pt-4" })), jsxRuntime.jsx(GridTemplateColumnsWrapper, __assign({ className: "bunny-grid bunny-w-full shadow-md bunny-rounded-md bunny-p-0 bg-white", everythingInPlus: false, plansToDisplay: plansToDisplay }, { children: features.map(function (feature, featureIndex) {
23733
+ var rowIndex = featureIndex;
23734
+ var isFeatureGroup = feature.kind === 'GROUP';
23735
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(FeatureGridCell, __assign({ isFeatureGroup: isFeatureGroup, noBorder: true, rowIndex: featureIndex }, { children: jsxRuntime.jsx(FeatureTitle, { isFeatureGroup: isFeatureGroup, feature: feature }) })), __spreadArray([], Array(plansToDisplay), true).map(function (_, columnIndex) {
23736
+ var _a;
23737
+ var priceList = displayPriceLists[columnIndex];
23738
+ var plan = priceList.plan;
23739
+ var doesHavePrevPlan = displayPriceLists[columnIndex - 1];
23740
+ columnIndex = columnIndex + 1;
23741
+ // Check if the plan has the feature
23742
+ var planFeature = (_a = plan === null || plan === void 0 ? void 0 : plan.planFeatures) === null || _a === void 0 ? void 0 : _a.find(function (f) { return f.featureId === (feature === null || feature === void 0 ? void 0 : feature.id); });
23743
+ if (!plan)
23744
+ return (jsxRuntime.jsx(FeatureGridCell, { rowIndex: rowIndex, noBorder: !Boolean(doesHavePrevPlan) }, columnIndex));
23745
+ if (isFeatureGroup)
23746
+ return (jsxRuntime.jsx(FeatureGridCell, { isFeatureGroup: true, rowIndex: rowIndex }, columnIndex));
23747
+ return (jsxRuntime.jsx(FeatureGridCell, __assign({ rowIndex: rowIndex }, { children: jsxRuntime.jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-text-center" }, { children: planFeature ? ((planFeature === null || planFeature === void 0 ? void 0 : planFeature.value) ? (planFeature.value) : (jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "15px" }))) : (jsxRuntime.jsx(Text$3, __assign({ className: "bunny-text-gray" }, { children: "-" }))) })) }), columnIndex));
23748
+ })] }));
23749
+ }) }))] }));
23750
+ }) })));
23704
23751
  };
23705
23752
  var FeatureTitle = function (_a) {
23706
23753
  var _b;
23707
23754
  var isFeatureGroup = _a.isFeatureGroup, feature = _a.feature;
23708
- return (jsxRuntime.jsx(Text$3, __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 })));
23755
+ return (jsxRuntime.jsx(Text$3, __assign({ className: " ".concat(isFeatureGroup ? 'bunny-text-slate-500 bunny-text-xs bunny-font-medium' : '') }, { 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 })));
23709
23756
  };
23710
23757
 
23711
23758
  var PlanAddonsCard = function (_a) {
@@ -23754,39 +23801,15 @@ function AddonPlanModal(_a) {
23754
23801
  var plansToDisplay = 1;
23755
23802
  return (jsxRuntime.jsx(antd.Modal, __assign({ open: !!priceList, onCancel: onClose, footer: null }, { children: jsxRuntime.jsxs("div", __assign({ className: "bunny-grid bunny-w-full", style: {
23756
23803
  gridTemplateColumns: "minmax(auto, 200px) repeat(".concat(plansToDisplay, ", minmax(200px, 1fr))"),
23757
- } }, { 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 }))] })) })));
23804
+ } }, { 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, features: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.features }))] })) })));
23758
23805
  }
23759
23806
 
23760
- var ADDON_PLANS_QUERY = function () { return "\n query PriceList($id: ID!) {\n priceList (id: $id) {\n addonPlans {\n addon\n basePrice\n code\n contactUsLabel\n contactUsUrl\n description\n id\n isVisible\n name\n position\n pricingDescription\n pricingStyle\n productId\n selfServiceBuy\n selfServiceCancel\n selfServiceRenew\n priceLists {\n isVisible\n id\n periodMonths\n showPriceAsMonthly\n monthlyBasePrice\n basePrice\n currencyId\n plan {\n pricingStyle\n name\n description\n }\n charges {\n basePrice\n billingPeriod\n chargeType\n }\n }\n planFeatures {\n featureId\n value\n feature {\n name\n }\n }\n }\n }\n }\n"; };
23761
- var getAddonPlans = function (_a) {
23762
- var token = _a.token, id = _a.id, apiHost = _a.apiHost;
23763
- return __awaiter(void 0, void 0, void 0, function () {
23764
- var response, addonPlans, visibleAddonPlans;
23765
- var _b;
23766
- return __generator(this, function (_c) {
23767
- switch (_c.label) {
23768
- case 0: return [4 /*yield*/, gqlRequest({
23769
- query: ADDON_PLANS_QUERY(),
23770
- token: token,
23771
- vars: { id: id },
23772
- apiHost: apiHost,
23773
- })];
23774
- case 1:
23775
- response = _c.sent();
23776
- addonPlans = (_b = response === null || response === void 0 ? void 0 : response.priceList) === null || _b === void 0 ? void 0 : _b.addonPlans;
23777
- visibleAddonPlans = addonPlans.map(function (addonPlan) {
23778
- return __assign(__assign({}, addonPlan), { priceLists: addonPlan.priceLists.filter(function (priceList) { return priceList.isVisible; }) });
23779
- });
23780
- return [2 /*return*/, visibleAddonPlans];
23781
- }
23782
- });
23783
- });
23784
- };
23785
-
23786
23807
  var PriceListGridDesktop = function (_a) {
23787
23808
  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, onClickPriceListCard = _a.onClickPriceListCard;
23788
23809
  var token = useToken();
23789
23810
  var apiHost = react.useContext(BunnyContext).apiHost;
23811
+ var shadow = react.useContext(SubscriptionsContext).shadow;
23812
+ var isMobile = common.useIsMobile();
23790
23813
  var addonPlans = reactQuery.useQuery({
23791
23814
  queryKey: ['addonPlans', selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id],
23792
23815
  queryFn: function () {
@@ -23811,18 +23834,22 @@ var PriceListGridDesktop = function (_a) {
23811
23834
  var hasFeatureAddons = displayPriceLists.some(function (priceList) {
23812
23835
  return priceList.charges.some(function (charge) { return charge.featureAddon; });
23813
23836
  });
23814
- 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: {
23815
- gridTemplateColumns: everythingInPlus
23816
- ? "repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))")
23817
- : "minmax(auto, 400px) repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))"),
23818
- } }, { children: [!everythingInPlus && jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(plansToDisplay), true).map(function (_, index) {
23837
+ return (jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-relative bunny-flex bunny-flex-col bunny-rounded-md bunny-overflow-hidden bunny-bg-white ".concat(shadow ? "shadow-".concat(shadow) : '') }, { children: [jsxRuntime.jsx(NextPriceListButton, { availablePriceLists: availablePriceLists, numberOfPlansToDisplay: plansToDisplay, priceListStart: priceListStart, setPriceListStart: setPriceListStart }), jsxRuntime.jsxs(GridTemplateColumnsWrapper, __assign({ className: "bunny-grid bunny-w-full", everythingInPlus: !!everythingInPlus, plansToDisplay: plansToDisplay }, { children: [!everythingInPlus && jsxRuntime.jsx(PlanPickerGridCell, { noBorder: true }), __spreadArray([], Array(plansToDisplay), true).map(function (_, index) {
23819
23838
  var priceList = displayPriceLists[index];
23820
23839
  var doesPrevPriceListExist = displayPriceLists[index - 1];
23821
23840
  if (!priceList)
23822
23841
  return jsxRuntime.jsx(PlanPickerGridCell, { noBorder: !Boolean(doesPrevPriceListExist) }, index);
23823
23842
  return (jsxRuntime.jsx(PriceListCard, { onClickPriceListCard: onClickPriceListCard, isSelected: priceList.id === (selectedPriceList === null || selectedPriceList === void 0 ? void 0 : selectedPriceList.id), priceList: priceList, subscriptions: subscriptions, trialRemainingDays: trialRemainingDays }, index));
23824
- }), (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 }))] }))] }))] })), selectedPriceList && addonPlans && selectedBillingPeriod ? (jsxRuntime.jsx(PlanAddonsCard, { selectedPriceList: selectedPriceList, subscriptions: subscriptions, addonPlans: addonPlans, selectedProduct: selectedProduct, selectedBillingPeriod: selectedBillingPeriod })) : null] })));
23843
+ })] })), everythingInPlus ? (jsxRuntime.jsx(EverythingPlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, selectedProduct: selectedProduct })) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: hasFeatureAddons && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMobile && jsxRuntime.jsx(antd.Divider, { className: "bunny-my-0" }), jsxRuntime.jsx(PlanFeatureAddons, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, everythingInPlus: !!everythingInPlus })] })) }))] })), !everythingInPlus && (jsxRuntime.jsx(PlanFeatures, { displayPriceLists: displayPriceLists, plansToDisplay: plansToDisplay, features: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.features })), selectedPriceList && addonPlans && selectedBillingPeriod ? (jsxRuntime.jsx(PlanAddonsCard, { selectedPriceList: selectedPriceList, subscriptions: subscriptions, addonPlans: addonPlans, selectedProduct: selectedProduct, selectedBillingPeriod: selectedBillingPeriod })) : null] })));
23825
23844
  };
23845
+ function GridTemplateColumnsWrapper(_a) {
23846
+ var children = _a.children, className = _a.className, everythingInPlus = _a.everythingInPlus, plansToDisplay = _a.plansToDisplay;
23847
+ return (jsxRuntime.jsx("div", __assign({ className: "".concat(className), style: {
23848
+ gridTemplateColumns: everythingInPlus
23849
+ ? "repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))")
23850
+ : "minmax(auto, 400px) repeat(".concat(plansToDisplay, ", minmax(120px, 1fr))"),
23851
+ } }, { children: children })));
23852
+ }
23826
23853
 
23827
23854
  var Text$2 = antd.Typography.Text;
23828
23855
  var PriceListCardFeature = function (_a) {
@@ -23867,7 +23894,7 @@ var createAvailableBillingPeriods = function (priceLists, selectedProduct) {
23867
23894
  var showInfoNotification = common.useInfoNotification();
23868
23895
  var PriceListSelector = function (_a) {
23869
23896
  var _b;
23870
- var arePlanChangeOptionsLoading = _a.arePlanChangeOptionsLoading, areSubscriptionsLoading = _a.areSubscriptionsLoading, priceListChangeOptions = _a.priceListChangeOptions, subscriptions = _a.subscriptions;
23897
+ var arePlanChangeOptionsLoading = _a.arePlanChangeOptionsLoading, areSubscriptionsLoading = _a.areSubscriptionsLoading, priceListChangeOptions = _a.priceListChangeOptions, subscriptions = _a.subscriptions, onGoBack = _a.onGoBack;
23871
23898
  // Context
23872
23899
  var _c = react.useContext(SubscriptionsContext), isInPreviewMode = _c.isInPreviewMode, upgradingSubscription = _c.upgradingSubscription;
23873
23900
  var _d = react.useContext(QuoteContext), selectedPriceList = _d.selectedPriceList, onChangeSelectedPriceList = _d.onChangeSelectedPriceList, onClearQuote = _d.onClearQuote;
@@ -23980,12 +24007,12 @@ var PriceListSelector = function (_a) {
23980
24007
  return showInfoNotification('You are in preview mode');
23981
24008
  return onChangeSelectedPriceList(selectedPriceList);
23982
24009
  }, [isInPreviewMode, showInfoNotification, onChangeSelectedPriceList]);
23983
- 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, selectedBillingPeriod: selectedBillingPeriod, onClickPriceListCard: onClickPriceListCard })] }));
24010
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-4 bunny-items-center" }, { 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("div", __assign({ className: "bunny-pt-1" }, { children: jsxRuntime.jsx(BackButton, { onClick: onGoBack }) }))] })), jsxRuntime.jsx(PriceListGrid, { availablePriceLists: availablePriceLists, priceListChangeOptions: priceListChangeOptions, priceListStart: priceListStart, selectedPriceList: selectedPriceList, selectedProduct: selectedProduct, setPriceListStart: setPriceListStart, subscriptions: subscriptions, selectedBillingPeriod: selectedBillingPeriod, onClickPriceListCard: onClickPriceListCard })] }));
23984
24011
  };
23985
24012
 
23986
24013
  var PlanPicker = function (_a) {
23987
24014
  var _b;
23988
- var upgradingSubscription = _a.upgradingSubscription;
24015
+ var upgradingSubscription = _a.upgradingSubscription, onGoBack = _a.onGoBack;
23989
24016
  // Context
23990
24017
  var token = useToken();
23991
24018
  var apiHost = react.useContext(BunnyContext).apiHost;
@@ -24017,7 +24044,7 @@ var PlanPicker = function (_a) {
24017
24044
  if (!priceListChangeOptions) {
24018
24045
  return null;
24019
24046
  }
24020
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: ((_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _b === void 0 ? void 0 : _b.length) === 0 ? (jsxRuntime.jsx(ErrorView, { message: "There are no plans available" })) : (jsxRuntime.jsx(PriceListSelector, { arePlanChangeOptionsLoading: arePlanChangeOptionsLoading, areSubscriptionsLoading: areSubscriptionsLoading, priceListChangeOptions: priceListChangeOptions, subscriptions: subscriptions })) }));
24047
+ return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: ((_b = priceListChangeOptions === null || priceListChangeOptions === void 0 ? void 0 : priceListChangeOptions.priceLists) === null || _b === void 0 ? void 0 : _b.length) === 0 ? (jsxRuntime.jsx(ErrorView, { message: "There are no plans available" })) : (jsxRuntime.jsx(PriceListSelector, { arePlanChangeOptionsLoading: arePlanChangeOptionsLoading, areSubscriptionsLoading: areSubscriptionsLoading, priceListChangeOptions: priceListChangeOptions, subscriptions: subscriptions !== null && subscriptions !== void 0 ? subscriptions : [], onGoBack: onGoBack })) }));
24021
24048
  };
24022
24049
 
24023
24050
  var Text$1 = antd.Typography.Text;
@@ -24029,13 +24056,14 @@ var PreviewModeAdvisary = function (_a) {
24029
24056
  };
24030
24057
 
24031
24058
  var UpgradeWrapper = function (_a) {
24032
- var onChangePlanCancel = _a.onChangePlanCancel, handlePortalErrors = _a.handlePortalErrors, upgradingSubscription = _a.upgradingSubscription, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, className = _a.className;
24059
+ var onChangePlanCancel = _a.onChangePlanCancel, handlePortalErrors = _a.handlePortalErrors, upgradingSubscription = _a.upgradingSubscription, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, className = _a.className, _b = _a.shadow, shadow = _b === void 0 ? 'md' : _b;
24033
24060
  return (jsxRuntime.jsx(SubscriptionsContext.Provider, __assign({ value: {
24034
24061
  upgradingSubscription: upgradingSubscription,
24035
24062
  setUpgradingSubscription: function () { },
24036
24063
  isInPreviewMode: isInPreviewMode,
24037
24064
  productId: productId,
24038
24065
  className: className,
24066
+ shadow: shadow,
24039
24067
  } }, { children: jsxRuntime.jsx(QuoteProvider, { children: jsxRuntime.jsx(Upgrade, { onChangePlanCancel: onChangePlanCancel, handlePortalErrors: handlePortalErrors }) }) })));
24040
24068
  };
24041
24069
  var Upgrade = function (_a) {
@@ -24080,22 +24108,22 @@ var Upgrade = function (_a) {
24080
24108
  }, []);
24081
24109
  if (subscriptionsAreLoading && !isInPreviewMode)
24082
24110
  return jsxRuntime.jsx(jsxRuntime.Fragment, {});
24083
- return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [jsxRuntime.jsx(PreviewModeAdvisary, { isInPreviewMode: isInPreviewMode }), jsxRuntime.jsx(PageTitle, { onGoBack: function () {
24111
+ return (jsxRuntime.jsxs("div", __assign({ className: "".concat(className) }, { children: [jsxRuntime.jsx(PreviewModeAdvisary, { isInPreviewMode: isInPreviewMode }), jsxRuntime.jsx(PlanPicker, { upgradingSubscription: upgradingSubscription, onGoBack: function () {
24084
24112
  if (isInPreviewMode)
24085
24113
  return showInfoNotification('You are in preview mode');
24086
24114
  onClearQuote();
24087
24115
  onChangePlanCancel();
24088
- }, title: "Change plan" }), jsxRuntime.jsx(PlanPicker, { upgradingSubscription: upgradingSubscription }), 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: selectedPriceList && (jsxRuntime.jsx(PlanPickerCheckoutBar, { selectedPriceList: selectedPriceList, handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } })) }))] })));
24116
+ } }), 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: selectedPriceList && (jsxRuntime.jsx(PlanPickerCheckoutBar, { selectedPriceList: selectedPriceList, handlePortalErrors: handlePortalErrors, onCheckoutSuccess: function () { return onChangePlanCancel(); } })) }))] })));
24089
24117
  };
24090
24118
 
24091
24119
  var SubscriptionsWrapper = function (_a) {
24092
- 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, hideExpired = _a.hideExpired, _d = _a.hideExpiredToggle, hideExpiredToggle = _d === void 0 ? false : _d;
24120
+ 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, showInactiveSubscriptions = _a.showInactiveSubscriptions, _d = _a.showInactiveSubscriptionsToggle, showInactiveSubscriptionsToggle = _d === void 0 ? false : _d;
24093
24121
  var defaultStyles = {
24094
24122
  gap: 4,
24095
- shadow: 'sm',
24123
+ shadow: 'md',
24096
24124
  subscriptionProductNameStyle: {
24097
- fontSize: '11px',
24098
- fontWeight: 500,
24125
+ fontSize: undefined,
24126
+ fontWeight: undefined,
24099
24127
  },
24100
24128
  };
24101
24129
  var styles = __assign(__assign({}, defaultStyles), userStyles);
@@ -24107,24 +24135,24 @@ var SubscriptionsWrapper = function (_a) {
24107
24135
  subscriptionProductNameStyle: styles.subscriptionProductNameStyle,
24108
24136
  productId: productId,
24109
24137
  isInPreviewMode: isInPreviewMode,
24110
- hideExpired: hideExpired,
24138
+ showInactiveSubscriptions: showInactiveSubscriptions,
24111
24139
  upgradingSubscription: upgradingSubscription,
24112
24140
  setUpgradingSubscription: setUpgradingSubscription,
24113
- } }, { children: jsxRuntime.jsx(Subscriptions, { handlePortalErrors: handlePortalErrors, companyName: companyName, noSubscriptionsComponent: noSubscriptionsComponent, hideExpiredToggle: hideExpiredToggle }) })));
24141
+ } }, { children: jsxRuntime.jsx(Subscriptions, { handlePortalErrors: handlePortalErrors, companyName: companyName, noSubscriptionsComponent: noSubscriptionsComponent, showInactiveSubscriptionsToggle: showInactiveSubscriptionsToggle }) })));
24114
24142
  };
24115
24143
  var Subscriptions = function (_a) {
24116
- var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, noSubscriptionsComponent = _a.noSubscriptionsComponent, hideExpiredToggle = _a.hideExpiredToggle;
24144
+ var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, noSubscriptionsComponent = _a.noSubscriptionsComponent, showInactiveSubscriptionsToggle = _a.showInactiveSubscriptionsToggle;
24117
24145
  // Context
24118
24146
  var token = useToken();
24119
24147
  var apiHost = react.useContext(BunnyContext).apiHost;
24120
- var _b = react.useContext(SubscriptionsContext), setUpgradingSubscription = _b.setUpgradingSubscription, className = _b.className, isInPreviewMode = _b.isInPreviewMode, hideExpiredOverride = _b.hideExpired, upgradingSubscription = _b.upgradingSubscription, productId = _b.productId;
24148
+ var _b = react.useContext(SubscriptionsContext), setUpgradingSubscription = _b.setUpgradingSubscription, className = _b.className, isInPreviewMode = _b.isInPreviewMode, showInactiveSubscriptionsOverride = _b.showInactiveSubscriptions, upgradingSubscription = _b.upgradingSubscription, productId = _b.productId, shadow = _b.shadow;
24121
24149
  // Local state
24122
- var _c = react.useState(true), hideExpiredState = _c[0], setHideExpiredState = _c[1];
24123
- var _d = react.useState(false), expiredSwitchVisible = _d[0], setExpiredSwitchVisible = _d[1];
24150
+ var _c = react.useState(false), showInactiveSubscriptionsState = _c[0], setShowInactiveSubscriptionsState = _c[1];
24151
+ var _d = react.useState(false), inactiveSwitchVisible = _d[0], setInactiveSwitchVisible = _d[1];
24124
24152
  var _e = react.useState(false), isChangingPlan = _e[0], setIsChangingPlan = _e[1];
24125
24153
  var _f = react.useState(false), quantityDrawerOpen = _f[0], setQuantityDrawerOpen = _f[1];
24126
24154
  // Derived state
24127
- var hideExpired = hideExpiredOverride !== null && hideExpiredOverride !== void 0 ? hideExpiredOverride : hideExpiredState;
24155
+ var showInactiveSubscriptions = showInactiveSubscriptionsOverride !== null && showInactiveSubscriptionsOverride !== void 0 ? showInactiveSubscriptionsOverride : showInactiveSubscriptionsState;
24128
24156
  // Hooks
24129
24157
  var queryClient = reactQuery.useQueryClient();
24130
24158
  var showSuccessNotification = common.useSuccessNotification();
@@ -24163,40 +24191,42 @@ var Subscriptions = function (_a) {
24163
24191
  var onCancelSubscriptionClick = function (subscription) {
24164
24192
  subscriptionCancel.mutate(subscription);
24165
24193
  };
24166
- var allSubscriptionsExpired = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.every(function (subscription) {
24194
+ var allSubscriptionsInactive = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.every(function (subscription) {
24167
24195
  var _a, _b, _c;
24168
24196
  return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.EXPIRED ||
24169
24197
  ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.TRIAL_EXPIRED ||
24170
24198
  ((_c = subscription.state) === null || _c === void 0 ? void 0 : _c.toUpperCase()) === common.SubscriptionState.CANCELED;
24171
24199
  });
24172
- var hasExpiredOrCanceledSubscriptions = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.some(function (subscription) {
24200
+ var hasInactiveSubscriptions = subscriptions === null || subscriptions === void 0 ? void 0 : subscriptions.some(function (subscription) {
24173
24201
  var _a, _b, _c;
24174
24202
  return ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === common.SubscriptionState.EXPIRED ||
24175
24203
  ((_b = subscription.state) === null || _b === void 0 ? void 0 : _b.toUpperCase()) === common.SubscriptionState.TRIAL_EXPIRED ||
24176
24204
  ((_c = subscription.state) === null || _c === void 0 ? void 0 : _c.toUpperCase()) === common.SubscriptionState.CANCELED;
24177
24205
  });
24178
24206
  react.useEffect(function () {
24179
- if (allSubscriptionsExpired && subscriptions.length > 0) {
24180
- setHideExpiredState(false);
24207
+ if (allSubscriptionsInactive && subscriptions && subscriptions.length > 0) {
24208
+ console.log('setShowInactiveSubscriptionsState true');
24209
+ setShowInactiveSubscriptionsState(true);
24181
24210
  }
24182
24211
  else {
24183
- setHideExpiredState(true);
24212
+ console.log('setShowInactiveSubscriptionsState false');
24213
+ setShowInactiveSubscriptionsState(false);
24184
24214
  }
24185
- }, [allSubscriptionsExpired, subscriptions, isChangingPlan]);
24215
+ }, [allSubscriptionsInactive, subscriptions, isChangingPlan]);
24186
24216
  react.useEffect(function () {
24187
- if (hasExpiredOrCanceledSubscriptions && subscriptions.length > 0) {
24188
- setExpiredSwitchVisible(true);
24217
+ if (hasInactiveSubscriptions && subscriptions && subscriptions.length > 0) {
24218
+ setInactiveSwitchVisible(true);
24189
24219
  }
24190
24220
  else {
24191
- setExpiredSwitchVisible(false);
24221
+ setInactiveSwitchVisible(false);
24192
24222
  }
24193
- }, [hasExpiredOrCanceledSubscriptions, subscriptions]);
24223
+ }, [hasInactiveSubscriptions, subscriptions]);
24194
24224
  if (isChangingPlan || isInPreviewMode) {
24195
24225
  return (jsxRuntime.jsx(UpgradeWrapper, { isInPreviewMode: isInPreviewMode, productId: productId !== null && productId !== void 0 ? productId : undefined, onChangePlanCancel: function () {
24196
24226
  setIsChangingPlan(false);
24197
- }, handlePortalErrors: handlePortalErrors, upgradingSubscription: upgradingSubscription, className: className }));
24227
+ }, handlePortalErrors: handlePortalErrors, upgradingSubscription: upgradingSubscription, className: className, shadow: shadow }));
24198
24228
  }
24199
- return (jsxRuntime.jsxs("div", __assign({ className: className }, { children: [jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !hideExpiredToggle && 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(QuantityDrawerContainer, { subscriptions: subscriptions, quantityDrawerOpen: quantityDrawerOpen, setQuantityDrawerOpen: setQuantityDrawerOpen, handlePortalErrors: handlePortalErrors, setHideExpiredState: setHideExpiredState })] })));
24229
+ return (jsxRuntime.jsxs("div", __assign({ className: className }, { children: [jsxRuntime.jsx(PageHeaderWithActions, __assign({ title: jsxRuntime.jsx(jsxRuntime.Fragment, { children: !showInactiveSubscriptionsToggle && isMobile && inactiveSwitchVisible && (jsxRuntime.jsx(ShowInactiveToggle, { showInactive: showInactiveSubscriptions, setShowInactive: setShowInactiveSubscriptionsState })) }) }, { children: !isMobile && (jsxRuntime.jsx(SubscriptionsNavigation, { inactiveSwitchVisible: !showInactiveSubscriptionsToggle && inactiveSwitchVisible, showInactive: showInactiveSubscriptions, setShowInactive: setShowInactiveSubscriptionsState, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions !== null && subscriptions !== void 0 ? subscriptions : [] })) })), jsxRuntime.jsx(SubscriptionsListContainer, { companyName: companyName, showInactive: showInactiveSubscriptions, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions !== null && subscriptions !== void 0 ? subscriptions : [], subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsxRuntime.jsx("div", __assign({ className: "bunny-pt-4 bunny-pb-2" }, { children: jsxRuntime.jsx(SubscriptionsNavigation, { inactiveSwitchVisible: inactiveSwitchVisible, showInactive: showInactiveSubscriptions, setShowInactive: setShowInactiveSubscriptionsState, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions !== null && subscriptions !== void 0 ? subscriptions : [] }) }))), jsxRuntime.jsx(QuantityDrawerContainer, { subscriptions: subscriptions !== null && subscriptions !== void 0 ? subscriptions : [], quantityDrawerOpen: quantityDrawerOpen, setQuantityDrawerOpen: setQuantityDrawerOpen, handlePortalErrors: handlePortalErrors, setShowInactive: setShowInactiveSubscriptionsState })] })));
24200
24230
  };
24201
24231
  var PageHeaderWithActions = function (_a) {
24202
24232
  var children = _a.children, title = _a.title;
@@ -24208,7 +24238,7 @@ var PageHeaderWithActions = function (_a) {
24208
24238
  var PageSubTitle = function (_a) {
24209
24239
  var title = _a.title;
24210
24240
  var secondaryColor = react.useContext(BrandContext).secondaryColor;
24211
- return (jsxRuntime.jsx("div", __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: secondaryColor } }, { children: title })));
24241
+ return (jsxRuntime.jsx("div", __assign({ className: "bunny-shrink-0", style: { color: secondaryColor } }, { children: title })));
24212
24242
  };
24213
24243
 
24214
24244
  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";
@@ -24270,7 +24300,6 @@ function BillingDetailsSection(_a) {
24270
24300
  var hidePaymentMethodForm = _a.hidePaymentMethodForm, countryListFilter = _a.countryListFilter;
24271
24301
  // State
24272
24302
  var _b = react.useState(false), isFormEdited = _b[0], setIsFormEdited = _b[1];
24273
- var _c = react.useState(false), formIsValid = _c[0], setFormIsValid = _c[1];
24274
24303
  var form = antd.Form.useForm()[0];
24275
24304
  var values = antd.Form.useWatch([], form);
24276
24305
  // Context
@@ -24282,11 +24311,11 @@ function BillingDetailsSection(_a) {
24282
24311
  var showErrorNotification = common.useErrorNotification();
24283
24312
  var showSuccessNotification = common.useSuccessNotification();
24284
24313
  // Queries
24285
- var _d = reactQuery.useQuery({
24314
+ var _c = reactQuery.useQuery({
24286
24315
  queryKey: common.QueryKeyFactory.default.billingDetailsKey({ token: token }),
24287
24316
  queryFn: function () { return getBillingDetails({ token: token, apiHost: apiHost }); },
24288
- }), billingDetails = _d.data, isLoadingBillingDetails = _d.isLoading;
24289
- var _e = reactQuery.useMutation({
24317
+ }), billingDetails = _c.data, isLoadingBillingDetails = _c.isLoading;
24318
+ var _d = reactQuery.useMutation({
24290
24319
  mutationFn: function (changedFormData) { return __awaiter(_this, void 0, void 0, function () {
24291
24320
  var updatedBillingDetails;
24292
24321
  return __generator(this, function (_a) {
@@ -24322,7 +24351,7 @@ function BillingDetailsSection(_a) {
24322
24351
  }),
24323
24352
  });
24324
24353
  },
24325
- }), updateBillingDetails = _e.mutate, isUpdatingBillingDetails = _e.isPending;
24354
+ }), updateBillingDetails = _d.mutate, isUpdatingBillingDetails = _d.isPending;
24326
24355
  // Set form values when billing details are loaded
24327
24356
  react.useEffect(function () {
24328
24357
  var _a;
@@ -24339,10 +24368,7 @@ function BillingDetailsSection(_a) {
24339
24368
  }
24340
24369
  }, [billingDetails]);
24341
24370
  react.useEffect(function () {
24342
- form
24343
- .validateFields({ validateOnly: true })
24344
- .then(function () { return setFormIsValid(true); })
24345
- .catch(function () { return setFormIsValid(false); });
24371
+ form.validateFields({ validateOnly: true });
24346
24372
  var isFormEdited = function () {
24347
24373
  var _a;
24348
24374
  if (!billingDetails)
@@ -24405,7 +24431,7 @@ function BillingDetailsSection(_a) {
24405
24431
  var filteredCountryList = react.useMemo(function () {
24406
24432
  return countryListFilter ? common.Lists.COUNTRY_LIST.filter(countryListFilter) : common.Lists.COUNTRY_LIST;
24407
24433
  }, [countryListFilter]);
24408
- 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: [
24434
+ 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 bunny-pl-1" }, { 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", requiredMark: false }, { 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: [
24409
24435
  {
24410
24436
  required: false,
24411
24437
  },
@@ -24419,7 +24445,7 @@ function BillingDetailsSection(_a) {
24419
24445
  message: 'Email is required',
24420
24446
  type: 'email',
24421
24447
  },
24422
- ] }, { 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" }))] })) })));
24448
+ ] }, { 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, className: "bunny-w-full bunny-mt-4", type: "primary", onClick: saveBillingDetails }, { children: "Save" }))] })) })));
24423
24449
  }
24424
24450
 
24425
24451
  var BillingDetails = function (_a) {