@bunnyapp/components 1.0.58-beta.0.5 → 1.0.60

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 (72) hide show
  1. package/dist/cjs/index.js +338 -439
  2. package/dist/cjs/src/components/Checkout/Checkout.d.ts +2 -2
  3. package/dist/cjs/src/components/Checkout/CouponComponent.d.ts +7 -0
  4. package/dist/cjs/src/components/Checkout/QuoteCheckout.d.ts +2 -2
  5. package/dist/cjs/src/components/Invoice/Invoice.d.ts +2 -2
  6. package/dist/cjs/src/components/Invoice/InvoiceQuoteView.d.ts +2 -2
  7. package/dist/cjs/src/components/LegacyInvoicePDF.d.ts +4 -3
  8. package/dist/cjs/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +1 -1
  9. package/dist/cjs/src/components/PaymentForm/PaymentMethodSelector.d.ts +1 -1
  10. package/dist/cjs/src/components/Quote/Quote.stories.d.ts +5 -5
  11. package/dist/cjs/src/components/Signup/PriceListDisplay.d.ts +4 -3
  12. package/dist/cjs/src/components/Signup/Signup.d.ts +5 -5
  13. package/dist/cjs/src/components/Signup/Signup.stories.d.ts +3 -2
  14. package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListCardDesktop.d.ts +1 -1
  15. package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCard.d.ts +1 -1
  16. package/dist/cjs/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardButton.d.ts +1 -1
  17. package/dist/cjs/src/components/Subscriptions/Subscriptions.d.ts +1 -2
  18. package/dist/cjs/src/components/Subscriptions/SubscriptionsContext.d.ts +2 -3
  19. package/dist/cjs/src/components/Subscriptions/quantityChangeDrawer/quantityChangeDrawerDesktop/QuantityChangeDrawerDesktop.d.ts +2 -2
  20. package/dist/cjs/src/components/icons/CardIcon.d.ts +1 -3
  21. package/dist/cjs/src/graphql/mutations/checkout.d.ts +1 -1
  22. package/dist/cjs/src/graphql/mutations/quoteAddCoupon.d.ts +1 -1
  23. package/dist/cjs/src/graphql/mutations/quoteCompose.d.ts +1 -1
  24. package/dist/cjs/src/graphql/queries/getBillingDetails.d.ts +2 -2
  25. package/dist/cjs/src/graphql/queries/getBranding.d.ts +2 -2
  26. package/dist/cjs/src/graphql/queries/getFeatureUsage.d.ts +1 -1
  27. package/dist/cjs/src/graphql/queries/getFormattedQuote.d.ts +1 -1
  28. package/dist/cjs/src/graphql/queries/getPlanChangeOptions.d.ts +1 -1
  29. package/dist/cjs/src/graphql/queries/getPriceList.d.ts +1 -1
  30. package/dist/cjs/src/graphql/queries/getPriceListChangeOptions.d.ts +1 -1
  31. package/dist/cjs/src/graphql/queries/getQuote.d.ts +1 -1
  32. package/dist/cjs/src/graphql/queries/getTaxationRequiredAccountFields.d.ts +1 -1
  33. package/dist/cjs/src/mocks/handlers.d.ts +1 -1
  34. package/dist/cjs/src/utils/apiUtils.d.ts +0 -8
  35. package/dist/esm/index.js +320 -421
  36. package/dist/esm/src/components/Checkout/Checkout.d.ts +2 -2
  37. package/dist/esm/src/components/Checkout/CouponComponent.d.ts +7 -0
  38. package/dist/esm/src/components/Checkout/QuoteCheckout.d.ts +2 -2
  39. package/dist/esm/src/components/Invoice/Invoice.d.ts +2 -2
  40. package/dist/esm/src/components/Invoice/InvoiceQuoteView.d.ts +2 -2
  41. package/dist/esm/src/components/LegacyInvoicePDF.d.ts +4 -3
  42. package/dist/esm/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +1 -1
  43. package/dist/esm/src/components/PaymentForm/PaymentMethodSelector.d.ts +1 -1
  44. package/dist/esm/src/components/Quote/Quote.stories.d.ts +5 -5
  45. package/dist/esm/src/components/Signup/PriceListDisplay.d.ts +4 -3
  46. package/dist/esm/src/components/Signup/Signup.d.ts +5 -5
  47. package/dist/esm/src/components/Signup/Signup.stories.d.ts +3 -2
  48. package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerDesktop/PriceListCardDesktop.d.ts +1 -1
  49. package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCard.d.ts +1 -1
  50. package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/priceListCard/PriceListCardButton.d.ts +1 -1
  51. package/dist/esm/src/components/Subscriptions/Subscriptions.d.ts +1 -2
  52. package/dist/esm/src/components/Subscriptions/SubscriptionsContext.d.ts +2 -3
  53. package/dist/esm/src/components/Subscriptions/quantityChangeDrawer/quantityChangeDrawerDesktop/QuantityChangeDrawerDesktop.d.ts +2 -2
  54. package/dist/esm/src/components/icons/CardIcon.d.ts +1 -3
  55. package/dist/esm/src/graphql/mutations/checkout.d.ts +1 -1
  56. package/dist/esm/src/graphql/mutations/quoteAddCoupon.d.ts +1 -1
  57. package/dist/esm/src/graphql/mutations/quoteCompose.d.ts +1 -1
  58. package/dist/esm/src/graphql/queries/getBillingDetails.d.ts +2 -2
  59. package/dist/esm/src/graphql/queries/getBranding.d.ts +2 -2
  60. package/dist/esm/src/graphql/queries/getFeatureUsage.d.ts +1 -1
  61. package/dist/esm/src/graphql/queries/getFormattedQuote.d.ts +1 -1
  62. package/dist/esm/src/graphql/queries/getPlanChangeOptions.d.ts +1 -1
  63. package/dist/esm/src/graphql/queries/getPriceList.d.ts +1 -1
  64. package/dist/esm/src/graphql/queries/getPriceListChangeOptions.d.ts +1 -1
  65. package/dist/esm/src/graphql/queries/getQuote.d.ts +1 -1
  66. package/dist/esm/src/graphql/queries/getTaxationRequiredAccountFields.d.ts +1 -1
  67. package/dist/esm/src/mocks/handlers.d.ts +1 -1
  68. package/dist/esm/src/utils/apiUtils.d.ts +0 -8
  69. package/dist/index.d.ts +4 -5
  70. package/package.json +3 -3
  71. package/dist/cjs/src/components/PaymentForm/CouponEditor.d.ts +0 -8
  72. package/dist/esm/src/components/PaymentForm/CouponEditor.d.ts +0 -8
package/dist/esm/index.js CHANGED
@@ -4,7 +4,7 @@ import { Markup } from 'interweave';
4
4
  import { ConfigProvider, Button, Tag, Typography, Dropdown, Input, Checkbox, Collapse, Skeleton, Modal, Form, Drawer, Card as Card$1, Image, Divider, Select, Tooltip, Radio, Space, Popconfirm } from 'antd';
5
5
  import { DownloadOutlined, CreditCardOutlined, EllipsisOutlined, BankOutlined, SearchOutlined, CheckCircleFilled, CloseOutlined, ArrowLeftOutlined } from '@ant-design/icons';
6
6
  import styled from 'styled-components';
7
- import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest as gqlRequest$1, X_BUNNY_COMPONENTS_VERSION_HEADER_NAME, QueryKeyFactory, useIsMobile, isColorTooDark, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, getPlugins, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, SLATE_500, PRIMARY_COLOR, sortSubscriptionCharges, Lists, getAccount, StringUtils, BillingPeriod, ChargeType, SubscriptionState as SubscriptionState$2, PERIOD_LABELS, PricingStyle, PricingModel, SLATE_100, useInfoNotification, MODAL_MAX_HEIGHT, DataInterval, TAG_COLORS, SubscriptionChargeKind } from '@bunnyapp/common';
7
+ import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest, QueryKeyFactory, useIsMobile, isColorTooDark, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, useAllErrorFormats, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useErrorNotification, useSuccessNotification, getFormattedInvoice, PAYABLE_INVOICE_STATES, BreakpointNumbers, getPlugins, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, sortSubscriptionCharges, SLATE_500, PRIMARY_COLOR, Lists, getAccount, StringUtils, BillingPeriod, ChargeType, SubscriptionState as SubscriptionState$2, PERIOD_LABELS, PricingStyle, PricingModel, SLATE_100, useInfoNotification, MODAL_MAX_HEIGHT, DataInterval, TAG_COLORS, SubscriptionChargeKind } from '@bunnyapp/common';
8
8
  import { QueryClient, QueryClientProvider, useQuery, useQueryClient, keepPreviousData, useMutation } from '@tanstack/react-query';
9
9
  import theme from 'antd/lib/theme/index.js';
10
10
  import { RecoilRoot } from 'recoil';
@@ -44,7 +44,7 @@ function styleInject(css, ref) {
44
44
  }
45
45
  }
46
46
 
47
- var css_248z = ".ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n --bunny-blue-500: #3b82f6;\n --bunny-blue-200: #bfdbfe;\n --bunny-green-600: #059669;\n --bunny-green-200: #a7f3d0;\n --bunny-red-500: #ef4444;\n --bunny-red-200: #fecaca;\n --bunny-orange-500: #f97316;\n --bunny-orange-200: #fed7aa;\n --bunny-yellow-500: #f59e0b;\n --bunny-yellow-200: #fde68a;\n --bunny-purple-500: #8b5cf6;\n --bunny-purple-200: #ddd6fe;\n --bunny-black: #000000;\n}\n.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-full {\n grid-column: 1 / -1;\n}\n.bunny-m-0 {\n margin: 0px;\n}\n.bunny-mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.bunny-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.bunny-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.bunny-my-24 {\n margin-top: 6rem;\n margin-bottom: 6rem;\n}\n.bunny-my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.bunny-mb-2 {\n margin-bottom: 0.5rem;\n}\n.bunny-mb-4 {\n margin-bottom: 1rem;\n}\n.bunny-mb-8 {\n margin-bottom: 2rem;\n}\n.bunny-mt-2 {\n margin-top: 0.5rem;\n}\n.bunny-mt-24 {\n margin-top: 6rem;\n}\n.bunny-mt-4 {\n margin-top: 1rem;\n}\n.bunny-flex {\n display: flex;\n}\n.bunny-grid {\n display: grid;\n}\n.bunny-contents {\n display: contents;\n}\n.bunny-h-1\\/2 {\n height: 50%;\n}\n.bunny-h-5 {\n height: 1.25rem;\n}\n.bunny-h-8 {\n height: 2rem;\n}\n.bunny-h-full {\n height: 100%;\n}\n.bunny-h-screen {\n height: 100vh;\n}\n.bunny-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-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-items-start {\n align-items: flex-start;\n}\n.bunny-items-end {\n align-items: flex-end;\n}\n.bunny-items-center {\n align-items: center;\n}\n.bunny-justify-end {\n justify-content: flex-end;\n}\n.bunny-justify-center {\n justify-content: center;\n}\n.bunny-justify-between {\n justify-content: space-between;\n}\n.bunny-gap-0 {\n gap: 0px;\n}\n.bunny-gap-1 {\n gap: 0.25rem;\n}\n.bunny-gap-2 {\n gap: 0.5rem;\n}\n.bunny-gap-3 {\n gap: 0.75rem;\n}\n.bunny-gap-4 {\n gap: 1rem;\n}\n.bunny-gap-6 {\n gap: 1.5rem;\n}\n.bunny-gap-8 {\n gap: 2rem;\n}\n.bunny-space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.bunny-space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.bunny-space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.bunny-overflow-auto {\n overflow: auto;\n}\n.bunny-overflow-hidden {\n overflow: hidden;\n}\n.bunny-overflow-visible {\n overflow: visible;\n}\n.bunny-whitespace-nowrap {\n white-space: nowrap;\n}\n.bunny-rounded {\n border-radius: 0.25rem;\n}\n.bunny-rounded-full {\n border-radius: 9999px;\n}\n.bunny-rounded-lg {\n border-radius: 0.5rem;\n}\n.bunny-rounded-md {\n border-radius: 0.375rem;\n}\n.bunny-border {\n border-width: 1px;\n}\n.bunny-border-2 {\n border-width: 2px;\n}\n.bunny-border-solid {\n border-style: solid;\n}\n.bunny-border-none {\n border-style: none;\n}\n.bunny-border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.bunny-bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bunny-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bunny-p-0 {\n padding: 0px;\n}\n.bunny-p-1 {\n padding: 0.25rem;\n}\n.bunny-p-2 {\n padding: 0.5rem;\n}\n.bunny-p-4 {\n padding: 1rem;\n}\n.bunny-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.bunny-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.bunny-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.bunny-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.bunny-py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.bunny-py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.bunny-pb-2 {\n padding-bottom: 0.5rem;\n}\n.bunny-pb-4 {\n padding-bottom: 1rem;\n}\n.bunny-pb-6 {\n padding-bottom: 1.5rem;\n}\n.bunny-pb-8 {\n padding-bottom: 2rem;\n}\n.bunny-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pr-4 {\n padding-right: 1rem;\n}\n.bunny-pt-12 {\n padding-top: 3rem;\n}\n.bunny-pt-2 {\n padding-top: 0.5rem;\n}\n.bunny-pt-4 {\n padding-top: 1rem;\n}\n.bunny-pt-5 {\n padding-top: 1.25rem;\n}\n.bunny-pt-6 {\n padding-top: 1.5rem;\n}\n.bunny-pt-\\[25vh\\] {\n padding-top: 25vh;\n}\n.bunny-text-left {\n text-align: left;\n}\n.bunny-text-center {\n text-align: center;\n}\n.bunny-text-right {\n text-align: right;\n}\n.bunny-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.bunny-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.bunny-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.bunny-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.bunny-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.bunny-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.bunny-font-bold {\n font-weight: 700;\n}\n.bunny-font-medium {\n font-weight: 500;\n}\n.bunny-font-normal {\n font-weight: 400;\n}\n.bunny-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.bunny-text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.bunny-text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.bunny-underline {\n text-decoration-line: underline;\n}\n.bunny-shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.bunny-shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.bunny-transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.bunny-duration-300 {\n transition-duration: 300ms;\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.sticky {\n position: sticky;\n}\n.-top-0\\.5 {\n top: -0.125rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.bottom-4 {\n bottom: 1rem;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.col-span-full {\n grid-column: 1 / -1;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.mb-8 {\n margin-bottom: 2rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-12 {\n width: 3rem;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink {\n flex-shrink: 1;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.flex-grow {\n flex-grow: 1;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.gap-8 {\n gap: 2rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-sm {\n border-radius: 0.125rem;\n}\n.border {\n border-width: 1px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-none {\n border-style: none;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-200 {\n transition-duration: 200ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.hover\\:bg-gray-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-gray-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n.bunny-invoice-container {\n padding: 0;\n box-sizing: border-box !important;\n line-height: 1.15;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type='text'],\n input[type='password'],\n input[type='datetime'],\n input[type='datetime-local'],\n input[type='date'],\n input[type='month'],\n input[type='time'],\n input[type='week'],\n input[type='number'],\n input[type='email'],\n input[type='url'],\n input[type='search'],\n input[type='tel'],\n input[type='color'] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
47
+ var css_248z = ".ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n --bunny-blue-500: #3b82f6;\n --bunny-blue-200: #bfdbfe;\n --bunny-green-600: #059669;\n --bunny-green-200: #a7f3d0;\n --bunny-red-500: #ef4444;\n --bunny-red-200: #fecaca;\n --bunny-orange-500: #f97316;\n --bunny-orange-200: #fed7aa;\n --bunny-yellow-500: #f59e0b;\n --bunny-yellow-200: #fde68a;\n --bunny-purple-500: #8b5cf6;\n --bunny-purple-200: #ddd6fe;\n --bunny-black: #000000;\n}\n.hidden {\n display: none;\n}\n.bunny-show-on-hover {\n opacity: 0;\n}\n.bunny-show-on-hover-container:hover .bunny-show-on-hover {\n opacity: 1;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\n}\n.pdf-only {\n display: none !important;\n}\n.notes p {\n margin: 0;\n padding: 0;\n padding-bottom: 0.25rem;\n}\n.bunny-icon-path {\n transition: fill 0.3s;\n}\n.bunny-shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.bunny-shadow-padding-xb {\n padding-right: 1rem;\n padding-left: 1rem;\n padding-bottom: 0.5rem;\n}\n.content-container {\n width: 100%;\n margin: 0 auto;\n}\n@media (min-width: 1220px) {\n .content-container {\n width: 1220px !important;\n margin: 0 auto;\n }\n}\n@media (min-width: 768px) {\n .bunny-shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .bunny-shadow-padding-xb {\n padding-right: 2rem;\n padding-left: 2rem;\n padding-bottom: 0.5rem;\n }\n .sm\\:flex {\n display: flex !important;\n }\n .sm\\:hidden {\n display: none !important;\n }\n}\n.bunny-shadow,\n.bunny-shadow-md {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.bunny-fixed {\n position: fixed;\n}\n.bunny-absolute {\n position: absolute;\n}\n.bunny-relative {\n position: relative;\n}\n.bunny-sticky {\n position: sticky;\n}\n.bunny-bottom-0 {\n bottom: 0px;\n}\n.bunny-bottom-4 {\n bottom: 1rem;\n}\n.bunny-left-0 {\n left: 0px;\n}\n.bunny-right-0 {\n right: 0px;\n}\n.bunny-top-0 {\n top: 0px;\n}\n.bunny-col-span-full {\n grid-column: 1 / -1;\n}\n.bunny-m-0 {\n margin: 0px;\n}\n.bunny-mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.bunny-mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.bunny-my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.bunny-my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.bunny-my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.bunny-mb-2 {\n margin-bottom: 0.5rem;\n}\n.bunny-mb-4 {\n margin-bottom: 1rem;\n}\n.bunny-mb-8 {\n margin-bottom: 2rem;\n}\n.bunny-mt-2 {\n margin-top: 0.5rem;\n}\n.bunny-mt-4 {\n margin-top: 1rem;\n}\n.bunny-flex {\n display: flex;\n}\n.bunny-grid {\n display: grid;\n}\n.bunny-contents {\n display: contents;\n}\n.bunny-h-5 {\n height: 1.25rem;\n}\n.bunny-h-8 {\n height: 2rem;\n}\n.bunny-h-full {\n height: 100%;\n}\n.bunny-w-1\\/2 {\n width: 50%;\n}\n.bunny-w-full {\n width: 100%;\n}\n.bunny-flex-1 {\n flex: 1 1 0%;\n}\n.bunny-shrink {\n flex-shrink: 1;\n}\n.bunny-shrink-0 {\n flex-shrink: 0;\n}\n.bunny-grow {\n flex-grow: 1;\n}\n.bunny-cursor-pointer {\n cursor: pointer;\n}\n.bunny-grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.bunny-flex-row {\n flex-direction: row;\n}\n.bunny-flex-col {\n flex-direction: column;\n}\n.bunny-items-end {\n align-items: flex-end;\n}\n.bunny-items-center {\n align-items: center;\n}\n.bunny-justify-end {\n justify-content: flex-end;\n}\n.bunny-justify-center {\n justify-content: center;\n}\n.bunny-justify-between {\n justify-content: space-between;\n}\n.bunny-gap-0 {\n gap: 0px;\n}\n.bunny-gap-1 {\n gap: 0.25rem;\n}\n.bunny-gap-2 {\n gap: 0.5rem;\n}\n.bunny-gap-3 {\n gap: 0.75rem;\n}\n.bunny-gap-4 {\n gap: 1rem;\n}\n.bunny-gap-6 {\n gap: 1.5rem;\n}\n.bunny-gap-8 {\n gap: 2rem;\n}\n.bunny-space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.bunny-space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.bunny-space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.bunny-overflow-auto {\n overflow: auto;\n}\n.bunny-overflow-hidden {\n overflow: hidden;\n}\n.bunny-overflow-visible {\n overflow: visible;\n}\n.bunny-whitespace-nowrap {\n white-space: nowrap;\n}\n.bunny-rounded {\n border-radius: 0.25rem;\n}\n.bunny-rounded-full {\n border-radius: 9999px;\n}\n.bunny-rounded-lg {\n border-radius: 0.5rem;\n}\n.bunny-rounded-md {\n border-radius: 0.375rem;\n}\n.bunny-border {\n border-width: 1px;\n}\n.bunny-border-2 {\n border-width: 2px;\n}\n.bunny-border-solid {\n border-style: solid;\n}\n.bunny-border-none {\n border-style: none;\n}\n.bunny-border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.bunny-bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bunny-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bunny-p-0 {\n padding: 0px;\n}\n.bunny-p-1 {\n padding: 0.25rem;\n}\n.bunny-p-2 {\n padding: 0.5rem;\n}\n.bunny-p-4 {\n padding: 1rem;\n}\n.bunny-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.bunny-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.bunny-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.bunny-py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.bunny-py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.bunny-py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.bunny-pb-2 {\n padding-bottom: 0.5rem;\n}\n.bunny-pb-4 {\n padding-bottom: 1rem;\n}\n.bunny-pb-6 {\n padding-bottom: 1.5rem;\n}\n.bunny-pb-8 {\n padding-bottom: 2rem;\n}\n.bunny-pl-0 {\n padding-left: 0px;\n}\n.bunny-pl-4 {\n padding-left: 1rem;\n}\n.bunny-pt-12 {\n padding-top: 3rem;\n}\n.bunny-pt-2 {\n padding-top: 0.5rem;\n}\n.bunny-pt-4 {\n padding-top: 1rem;\n}\n.bunny-pt-5 {\n padding-top: 1.25rem;\n}\n.bunny-pt-6 {\n padding-top: 1.5rem;\n}\n.bunny-text-left {\n text-align: left;\n}\n.bunny-text-center {\n text-align: center;\n}\n.bunny-text-right {\n text-align: right;\n}\n.bunny-text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.bunny-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.bunny-text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.bunny-text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.bunny-text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.bunny-text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.bunny-font-bold {\n font-weight: 700;\n}\n.bunny-font-medium {\n font-weight: 500;\n}\n.bunny-font-normal {\n font-weight: 400;\n}\n.bunny-text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.bunny-text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.bunny-text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.bunny-text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.bunny-underline {\n text-decoration-line: underline;\n}\n.bunny-shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.bunny-shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.bunny-transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.bunny-duration-300 {\n transition-duration: 300ms;\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.sticky {\n position: sticky;\n}\n.-top-0\\.5 {\n top: -0.125rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.bottom-4 {\n bottom: 1rem;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.col-span-full {\n grid-column: 1 / -1;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.mb-8 {\n margin-bottom: 2rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-12 {\n width: 3rem;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink {\n flex-shrink: 1;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.flex-grow {\n flex-grow: 1;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.gap-8 {\n gap: 2rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-sm {\n border-radius: 0.125rem;\n}\n.border {\n border-width: 1px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-none {\n border-style: none;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[margin\\] {\n transition-property: margin;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-200 {\n transition-duration: 200ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.hover\\:bg-gray-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-slate-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-gray-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n.bunny-invoice-container {\n padding: 0;\n box-sizing: border-box !important;\n line-height: 1.15;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type='text'],\n input[type='password'],\n input[type='datetime'],\n input[type='datetime-local'],\n input[type='date'],\n input[type='month'],\n input[type='time'],\n input[type='week'],\n input[type='number'],\n input[type='email'],\n input[type='url'],\n input[type='search'],\n input[type='tel'],\n input[type='color'] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
48
48
  styleInject(css_248z);
49
49
 
50
50
  /******************************************************************************
@@ -141,59 +141,7 @@ var BrandContext = createContext({
141
141
  topNavImageUrl: DEFAULT_TOP_NAV_IMAGE_URL,
142
142
  });
143
143
 
144
- // This will be replaced at build time by rollup-plugin-replace
145
- var PACKAGE_VERSION = '1.0.58-beta.0.5';
146
- var createRequestHeaders = function (token) {
147
- var _a;
148
- var bearerToken = token ? "Bearer ".concat(token) : null;
149
- var headers = (_a = {
150
- 'Content-type': 'application/json; charset=utf-8'
151
- },
152
- _a[X_BUNNY_COMPONENTS_VERSION_HEADER_NAME] = PACKAGE_VERSION,
153
- _a);
154
- if (bearerToken) {
155
- headers['Authorization'] = bearerToken;
156
- }
157
- return headers;
158
- };
159
- var getGraphQLBaseURL = function (apiHost) {
160
- return "".concat(apiHost, "/graphql");
161
- };
162
- var useGraphQLRequest = function () { return function (query, apiHost, token, variables) { return __awaiter(void 0, void 0, void 0, function () {
163
- var error_1;
164
- return __generator(this, function (_a) {
165
- switch (_a.label) {
166
- case 0:
167
- _a.trys.push([0, 2, , 3]);
168
- return [4 /*yield*/, request(getGraphQLBaseURL(apiHost), query, variables, createRequestHeaders(token))];
169
- case 1: return [2 /*return*/, _a.sent()];
170
- case 2:
171
- error_1 = _a.sent();
172
- throw error_1;
173
- case 3: return [2 /*return*/];
174
- }
175
- });
176
- }); }; };
177
- var gqlRequest = function (_a) {
178
- var query = _a.query, apiHost = _a.apiHost, token = _a.token, vars = _a.vars, isInPreviewMode = _a.isInPreviewMode;
179
- return __awaiter(void 0, void 0, void 0, function () {
180
- return __generator(this, function (_b) {
181
- switch (_b.label) {
182
- case 0: return [4 /*yield*/, gqlRequest$1({
183
- query: query,
184
- apiHost: apiHost,
185
- token: token,
186
- vars: vars,
187
- componentsVersion: PACKAGE_VERSION,
188
- isInPreviewMode: isInPreviewMode,
189
- })];
190
- case 1: return [2 /*return*/, _b.sent()];
191
- }
192
- });
193
- });
194
- };
195
-
196
- var MUTATION$a = "\n query entityBranding {\n entityBranding {\n accentColor\n brandColor\n topNavImageUrl\n }\n }\n";
144
+ var MUTATION$9 = "\n query entityBranding {\n entityBranding {\n accentColor\n brandColor\n topNavImageUrl\n }\n }\n";
197
145
  var getBranding = function (_a) {
198
146
  var token = _a.token, apiHost = _a.apiHost;
199
147
  return __awaiter(void 0, void 0, void 0, function () {
@@ -201,7 +149,7 @@ var getBranding = function (_a) {
201
149
  return __generator(this, function (_b) {
202
150
  switch (_b.label) {
203
151
  case 0: return [4 /*yield*/, gqlRequest({
204
- query: MUTATION$a,
152
+ query: MUTATION$9,
205
153
  token: token,
206
154
  apiHost: apiHost,
207
155
  })];
@@ -244,7 +192,7 @@ function BunnyProvider(_a) {
244
192
  apiHost: apiHost,
245
193
  token: token,
246
194
  onTokenExpired: onTokenExpired,
247
- } }, { children: jsx(QueryClientProvider, __assign({ client: queryClient || extraQueryClient }, { children: jsx(ContextualWrapper, __assign({ darkMode: darkMode, configProviderProps: configProviderProps }, { children: jsx("div", __assign({ className: "bunny-component-wrapper" }, { children: children })) })) })) })));
195
+ } }, { children: jsx(QueryClientProvider, __assign({ client: queryClient || extraQueryClient }, { children: jsx(ContextualWrapper, __assign({ darkMode: darkMode, configProviderProps: configProviderProps }, { children: children })) })) })));
248
196
  }
249
197
  function ContextualWrapper(_a) {
250
198
  var children = _a.children, darkMode = _a.darkMode, configProviderProps = _a.configProviderProps;
@@ -252,7 +200,6 @@ function ContextualWrapper(_a) {
252
200
  var branding = useQuery({
253
201
  queryKey: QueryKeyFactory.default.brandingKey(token),
254
202
  queryFn: function () { return getBranding({ token: token, apiHost: apiHost }); },
255
- staleTime: 1000 * 60 * 5, // 5 minutes
256
203
  }).data;
257
204
  var isMobile = useIsMobile();
258
205
  var entityBranding = useMemo(function () {
@@ -389,46 +336,49 @@ var InvoiceQuoteView = function (_a) {
389
336
  var _b = useContext(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
390
337
  var isMobile = useIsMobile();
391
338
  var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
392
- return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-grow ".concat(isMobile ? 'bunny-overflow-hidden' : '') }, { children: [buttonsVisible ? (jsxs("div", __assign({ className: "bunny-flex bunny-justify-between bunny-items-center bunny-pb-4 ".concat(isMobile ? 'bunny-shadow-padding-x' : ''), id: "acceptance" }, { children: [jsx("div", { children: onBackButtonClick ? (jsx(Button, __assign({ className: "bunny-pl-0", onClick: onBackButtonClick, style: {
339
+ return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-full bunny-grow ".concat(isMobile ? "bunny-overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxs("div", __assign({ className: "bunny-flex bunny-justify-between bunny-items-center bunny-pb-4 ".concat(isMobile ? "bunny-shadow-padding-x" : ""), id: "acceptance" }, { children: [jsx("div", { children: onBackButtonClick ? (jsx(Button, __assign({ className: "bunny-pl-0", onClick: onBackButtonClick, style: {
393
340
  color: secondaryColor,
394
- }, type: "link" }, { children: backButtonName || 'Back' }))) : null }), !hideDownloadButton ? (jsx(Button, __assign({ icon: jsx(DownloadOutlined, {}), onClick: function () {
395
- return downloadFile(apiHost + '/api/pdf/invoice/' + formattedInvoice.id, token);
396
- } }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-grow bunny-w-full bunny-shadow-padding-xb bunny-overflow-auto" }, { children: [jsx(Markup, { content: html }), children] }))) : (jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4 bunny-w-full bunny-bg-white ".concat(shadow ? shadow : 'bunny-shadow-md', " bunny-rounded-md"), style: {
397
- minWidth: '750px',
341
+ }, type: "link" }, { children: backButtonName || "Back" }))) : null }), !hideDownloadButton ? (jsx(Button, __assign({ icon: jsx(DownloadOutlined, {}), onClick: function () {
342
+ return downloadFile(apiHost + "/api/pdf/invoice/" + formattedInvoice.id, token);
343
+ } }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-grow bunny-w-full bunny-shadow-padding-xb bunny-overflow-auto" }, { children: [jsx(Markup, { content: html }), children] }))) : (jsxs(MarkupContainer, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 bunny-p-4 bunny-w-full bunny-bg-white ".concat(shadow ? shadow : "bunny-shadow-md", " bunny-rounded-md"), style: {
344
+ minWidth: "750px",
398
345
  } }, { children: [jsx(Markup, { content: html }), children] })))] })));
399
346
  };
400
347
  var templateObject_1$b;
401
348
 
402
- var fetchPDF = function (apiHost, documentUuid, documentType, token) { return __awaiter(void 0, void 0, void 0, function () {
349
+ var fetchPDF = function (apiEndpoint, invoiceUuid, token) { return __awaiter(void 0, void 0, void 0, function () {
403
350
  var response;
404
351
  return __generator(this, function (_a) {
405
352
  switch (_a.label) {
406
353
  case 0:
407
- if (!documentUuid) {
408
- throw new Error('Invoice ID is required to fetch PDF');
354
+ if (!invoiceUuid) {
355
+ throw new Error("Invoice ID is required to fetch PDF");
409
356
  }
410
- return [4 /*yield*/, fetch("".concat(apiHost, "/api/legacy_documents/").concat(documentUuid, "?type=").concat(documentType), {
357
+ return [4 /*yield*/, fetch("".concat(apiEndpoint, "/api/legacy_invoices/").concat(invoiceUuid), {
358
+ method: "GET",
411
359
  headers: {
360
+ "Content-type": "application/json; charset=utf-8",
412
361
  Authorization: "Bearer ".concat(token),
413
362
  },
363
+ // body: JSON.stringify({
364
+ // query: transactionMutation(filter),
365
+ // }),
414
366
  })];
415
367
  case 1:
416
368
  response = _a.sent();
417
369
  if (!response.ok)
418
- throw new Error('Failed to fetch PDF');
370
+ throw new Error("Failed to fetch PDF");
419
371
  return [2 /*return*/, response.blob()]; // Return the PDF as a blob
420
372
  }
421
373
  });
422
374
  }); };
423
- function LegacyDocument(_a) {
424
- var documentUuid = _a.documentUuid, documentType = _a.documentType;
425
- var apiHost = useContext(BunnyContext).apiHost;
375
+ function InvoicePDF(_a) {
376
+ var invoiceUuid = _a.invoiceUuid, apiHost = _a.apiHost, token = _a.token;
426
377
  var _b = useState(undefined), pdfUrl = _b[0], setPdfUrl = _b[1];
427
- var token = useToken();
428
378
  var _c = useQuery({
429
- queryKey: ['documentPDF', documentUuid],
430
- queryFn: function () { return fetchPDF(apiHost, documentUuid, documentType, token); },
431
- enabled: Boolean(documentUuid),
379
+ queryKey: ["invoicePDF", invoiceUuid],
380
+ queryFn: function () { return fetchPDF(apiHost || "", invoiceUuid, token); },
381
+ enabled: Boolean(invoiceUuid),
432
382
  }), pdfBlob = _c.data, isLoading = _c.isLoading;
433
383
  useEffect(function () {
434
384
  if (pdfBlob) {
@@ -440,10 +390,10 @@ function LegacyDocument(_a) {
440
390
  if (isLoading || !pdfUrl)
441
391
  return jsx(Fragment, {});
442
392
  return (jsx("iframe", { src: pdfUrl, style: {
443
- border: 'none',
444
- gridColumn: '1/-1',
445
- minHeight: '1000px',
446
- minWidth: '780px',
393
+ border: "none",
394
+ gridColumn: "1/-1",
395
+ minHeight: "1000px",
396
+ minWidth: "780px",
447
397
  }, title: "Invoice PDF", width: "100%" }));
448
398
  }
449
399
 
@@ -476,7 +426,6 @@ var usePaymentMethod = function (_a) {
476
426
  token: token,
477
427
  }),
478
428
  queryFn: function () { return getPaymentMethods({ apiHost: apiHost, token: token, accountId: accountId }); },
479
- staleTime: 5 * 60 * 1000, // Consider data fresh for 5 minutes
480
429
  }), data = _b.data, isLoading = _b.isLoading;
481
430
  return {
482
431
  paymentMethods: data,
@@ -493,7 +442,7 @@ var filterPaymentPlugins = function (plugins) {
493
442
  ((_d = (_c = plugin.components) === null || _c === void 0 ? void 0 : _c.frontend) === null || _d === void 0 ? void 0 : _d.length);
494
443
  });
495
444
  };
496
- var MUTATION$9 = "{\n paymentPlugins {\n enabled\n entities\n guid\n hidden\n id\n name\n status\n type\n webhookEnabled\n components\n }\n}";
445
+ var MUTATION$8 = "{\n paymentPlugins {\n enabled\n entities\n guid\n hidden\n id\n name\n status\n type\n webhookEnabled\n components\n }\n}";
497
446
  var getPaymentPlugins = function (_a) {
498
447
  var apiHost = _a.apiHost, token = _a.token;
499
448
  return __awaiter(void 0, void 0, void 0, function () {
@@ -503,7 +452,7 @@ var getPaymentPlugins = function (_a) {
503
452
  case 0:
504
453
  _b.trys.push([0, 2, , 3]);
505
454
  return [4 /*yield*/, gqlRequest({
506
- query: MUTATION$9,
455
+ query: MUTATION$8,
507
456
  token: token,
508
457
  apiHost: apiHost,
509
458
  })];
@@ -523,7 +472,6 @@ var usePaymentPlugins = function (_a) {
523
472
  var _b = useQuery({
524
473
  queryKey: ['paymentPlugins', token],
525
474
  queryFn: function () { return getPaymentPlugins({ apiHost: apiHost, token: token }); },
526
- staleTime: 5 * 60 * 1000, // Consider data fresh for 5 minutes
527
475
  }), paymentPlugins = _b.data, isFetched = _b.isFetched;
528
476
  var filteredPaymentPlugins = filterPaymentPlugins(paymentPlugins);
529
477
  var paymentMethodAllowedPlugins = filteredPaymentPlugins === null || filteredPaymentPlugins === void 0 ? void 0 : filteredPaymentPlugins.filter(function (plugin) {
@@ -540,7 +488,7 @@ var getQuoteAmountDue = function (quote) {
540
488
  return quote.amountDue;
541
489
  };
542
490
 
543
- var MUTATION$8 = "\n mutation checkout(\n $invoiceId: ID,\n $quoteId: ID,\n $paymentMethodId: ID,\n $paymentMethodData: CheckoutPaymentMethodAttributes\n ) {\n checkout(\n invoiceId: $invoiceId,\n quoteId: $quoteId,\n paymentMethodId: $paymentMethodId,\n paymentMethodData: $paymentMethodData\n ) {\n invoice {\n id\n state\n amount\n amountDue\n }\n payment {\n id\n state\n amount\n }\n paymentApplication {\n id\n invoiceId\n paymentId\n }\n transaction {\n id\n amount\n }\n }\n }\n";
491
+ var MUTATION$7 = "\n mutation checkout(\n $invoiceId: ID,\n $quoteId: ID,\n $paymentMethodId: ID,\n $paymentMethodData: CheckoutPaymentMethodAttributes\n ) {\n checkout(\n invoiceId: $invoiceId,\n quoteId: $quoteId,\n paymentMethodId: $paymentMethodId,\n paymentMethodData: $paymentMethodData\n ) {\n invoice {\n id\n state\n amount\n amountDue\n }\n payment {\n id\n state\n amount\n }\n paymentApplication {\n id\n invoiceId\n paymentId\n }\n transaction {\n id\n amount\n }\n }\n }\n";
544
492
  var checkout = function (_a) {
545
493
  var quoteId = _a.quoteId, invoiceId = _a.invoiceId, paymentMethodId = _a.paymentMethodId, paymentMethodData = _a.paymentMethodData, token = _a.token, apiHost = _a.apiHost;
546
494
  return __awaiter(void 0, void 0, void 0, function () {
@@ -557,7 +505,7 @@ var checkout = function (_a) {
557
505
  mutationVars.paymentMethodData = __assign(__assign({}, paymentMethodData), { metadata: paymentMethodData.metadata });
558
506
  }
559
507
  return [4 /*yield*/, gqlRequest({
560
- query: MUTATION$8,
508
+ query: MUTATION$7,
561
509
  token: token,
562
510
  vars: mutationVars,
563
511
  apiHost: apiHost,
@@ -582,13 +530,14 @@ function usePay$1(_a) {
582
530
  var customCheckoutFunction = useContext(PaymentContext).customCheckoutFunction;
583
531
  var token = useToken();
584
532
  var pay = function () { return __awaiter(_this, void 0, void 0, function () {
585
- var currencyId, response, response, error_1;
533
+ var amountDue, currencyId, response, response, error_1;
586
534
  return __generator(this, function (_a) {
587
535
  switch (_a.label) {
588
536
  case 0:
537
+ amountDue = quote ? getQuoteAmountDue(quote) : invoice === null || invoice === void 0 ? void 0 : invoice.amountDue;
589
538
  currencyId = (quote === null || quote === void 0 ? void 0 : quote.currencyId) || (invoice === null || invoice === void 0 ? void 0 : invoice.currencyId);
590
- if (!currencyId) {
591
- throw new Error('No currencyId');
539
+ if (!amountDue || !currencyId) {
540
+ throw new Error("No amount or currencyId");
592
541
  }
593
542
  _a.label = 1;
594
543
  case 1:
@@ -735,6 +684,75 @@ var CheckoutFooter = function (_a) {
735
684
  return (jsx(ActualCheckoutFooter, { plugin: plugin, invoice: invoice, quote: quote, onPaymentSuccess: onPaymentSuccess, noPadding: noPadding }));
736
685
  };
737
686
 
687
+ // Automatically sets the default payment method if there is none currently set
688
+ var useAutoSetDefaultPaymentMethod = function (_a) {
689
+ var accountId = _a.accountId, token = _a.token, handleSetDefault = _a.handleSetDefault, setDefaultPaymentMethodLoading = _a.setDefaultPaymentMethodLoading, _b = _a.enabled, enabled = _b === void 0 ? true : _b;
690
+ var queryClient = useQueryClient();
691
+ var apiHost = useContext(BunnyContext).apiHost;
692
+ var _c = usePaymentMethod({
693
+ accountId: accountId,
694
+ token: token,
695
+ apiHost: apiHost,
696
+ }), storedPaymentMethods = _c.paymentMethods, defaultPaymentMethod = _c.defaultPaymentMethod;
697
+ // Set the default payment method on the cache. Prevents 'handleSetDefault' from being called too many times.
698
+ function setDefaultPaymentMethodOnCache(targetPaymentMethod) {
699
+ var cachedPaymentMethods = queryClient.getQueryData(QueryKeyFactory.default.accountPaymentMethodKey({
700
+ accountId: accountId,
701
+ token: token,
702
+ }));
703
+ if (cachedPaymentMethods) {
704
+ for (var _i = 0, _a = cachedPaymentMethods; _i < _a.length; _i++) {
705
+ var paymentMethod = _a[_i];
706
+ paymentMethod.isDefault = paymentMethod.id === targetPaymentMethod.id;
707
+ }
708
+ queryClient.setQueryData(QueryKeyFactory.default.accountPaymentMethodKey({
709
+ accountId: accountId,
710
+ token: token,
711
+ }), cachedPaymentMethods);
712
+ }
713
+ }
714
+ useEffect(function () {
715
+ if (setDefaultPaymentMethodLoading || !enabled)
716
+ return;
717
+ if ((storedPaymentMethods === null || storedPaymentMethods === void 0 ? void 0 : storedPaymentMethods.length) > 0 && !defaultPaymentMethod) {
718
+ handleSetDefault(storedPaymentMethods[0]);
719
+ setDefaultPaymentMethodOnCache(storedPaymentMethods[0]);
720
+ }
721
+ }, [
722
+ storedPaymentMethods,
723
+ defaultPaymentMethod,
724
+ handleSetDefault,
725
+ setDefaultPaymentMethodLoading,
726
+ queryClient,
727
+ accountId,
728
+ token,
729
+ ]);
730
+ };
731
+
732
+ var usePaymentMethodSelectorPlugin = function (_a) {
733
+ var defaultPaymentMethod = _a.defaultPaymentMethod, defaultPaymentMethodPlugin = _a.defaultPaymentMethodPlugin, paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins;
734
+ var _b = useState(), selectorPaymentMethodPlugin = _b[0], setSelectorPaymentMethodPlugin = _b[1];
735
+ useEffect(function () {
736
+ if (selectorPaymentMethodPlugin) {
737
+ return;
738
+ }
739
+ if (defaultPaymentMethod) {
740
+ setSelectorPaymentMethodPlugin(defaultPaymentMethodPlugin);
741
+ }
742
+ else {
743
+ setSelectorPaymentMethodPlugin(paymentMethodAllowedPlugins === null || paymentMethodAllowedPlugins === void 0 ? void 0 : paymentMethodAllowedPlugins[0]);
744
+ }
745
+ }, [
746
+ defaultPaymentMethod,
747
+ defaultPaymentMethodPlugin,
748
+ paymentMethodAllowedPlugins,
749
+ ]);
750
+ return {
751
+ selectorPaymentMethodPlugin: selectorPaymentMethodPlugin,
752
+ setSelectorPaymentMethodPlugin: setSelectorPaymentMethodPlugin,
753
+ };
754
+ };
755
+
738
756
  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
739
757
 
740
758
  function getDefaultExportFromCjs (x) {
@@ -18056,7 +18074,7 @@ var Visa = function (_a) {
18056
18074
  return (jsxs("svg", __assign({ className: className, width: "70", height: "48", viewBox: "0 0 70 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsx("rect", { x: "0.5", y: "0.5", width: "69", height: "47", rx: "5.5", fill: "white", stroke: "#D9D9D9" }), jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21.2505 32.5165H17.0099L13.8299 20.3847C13.679 19.8267 13.3585 19.3333 12.8871 19.1008C11.7106 18.5165 10.4142 18.0514 9 17.8169V17.3498H15.8313C16.7742 17.3498 17.4813 18.0514 17.5991 18.8663L19.2491 27.6173L23.4877 17.3498H27.6104L21.2505 32.5165ZM29.9675 32.5165H25.9626L29.2604 17.3498H33.2653L29.9675 32.5165ZM38.4467 21.5514C38.5646 20.7346 39.2717 20.2675 40.0967 20.2675C41.3931 20.1502 42.8052 20.3848 43.9838 20.9671L44.6909 17.7016C43.5123 17.2345 42.216 17 41.0395 17C37.1524 17 34.3239 19.1008 34.3239 22.0165C34.3239 24.2346 36.3274 25.3992 37.7417 26.1008C39.2717 26.8004 39.861 27.2675 39.7431 27.9671C39.7431 29.0165 38.5646 29.4836 37.3881 29.4836C35.9739 29.4836 34.5596 29.1338 33.2653 28.5494L32.5582 31.8169C33.9724 32.3992 35.5025 32.6338 36.9167 32.6338C41.2752 32.749 43.9838 30.6502 43.9838 27.5C43.9838 23.5329 38.4467 23.3004 38.4467 21.5514ZM58 32.5165L54.82 17.3498H51.4044C50.6972 17.3498 49.9901 17.8169 49.7544 18.5165L43.8659 32.5165H47.9887L48.8116 30.3004H53.8772L54.3486 32.5165H58ZM51.9936 21.4342L53.1701 27.1502H49.8723L51.9936 21.4342Z", fill: "#172B85" })] })));
18057
18075
  };
18058
18076
 
18059
- var Text$r = Typography.Text;
18077
+ var Text$p = Typography.Text;
18060
18078
  var MiniCreditCard = function (_a) {
18061
18079
  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;
18062
18080
  var darkMode = useContext(BunnyContext).darkMode;
@@ -18067,7 +18085,7 @@ var MiniCreditCard = function (_a) {
18067
18085
  return darkMode ? 'var(--row-background-alternate)' : 'bg-slate-50';
18068
18086
  }, [darkMode]);
18069
18087
  var isDefault = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.isDefault;
18070
- return (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 ? (jsxs(Fragment, { children: [jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-4" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 bunny-space-between bunny-w-full" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Issuer, { paymentMethodData: paymentMethodData }), jsx(Identifier, { paymentMethodData: paymentMethodData }), !hideDefaultTag && (jsx("div", { children: isDefault ? (jsx(Tag, __assign({ bordered: false, color: "blue" }, { children: "Default" }))) : null }))] })) })), buttons ? (buttons) : (jsx(Fragment, { children: !hideDropdownMenu && (jsx(DropdownMenu, { setDefault: onClickSetDefault, remove: onClickRemove, isDefault: isDefault !== null && isDefault !== void 0 ? isDefault : false, id: "credit-card-dropdown-".concat(paymentMethodData.id) })) }))] })) : (jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center justify-between w-full" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center" }, { children: [jsx(CreditCardOutlined, {}), jsx(Text$r, __assign({ className: "bunny-text-slate-400", style: { fontSize: '12px' } }, { children: "No payment methods" }))] })), jsx(Button, { disabled: true, type: "link" }), buttons] }))) })));
18088
+ return (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 ? (jsxs(Fragment, { children: [jsx("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-4" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2 bunny-space-between bunny-w-full" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Issuer, { paymentMethodData: paymentMethodData }), jsx(Identifier, { paymentMethodData: paymentMethodData }), !hideDefaultTag && (jsx("div", { children: isDefault ? (jsx(Tag, __assign({ bordered: false, color: "blue" }, { children: "Default" }))) : null }))] })) })), buttons ? (buttons) : (jsx(Fragment, { children: !hideDropdownMenu && (jsx(DropdownMenu, { setDefault: onClickSetDefault, remove: onClickRemove, isDefault: isDefault !== null && isDefault !== void 0 ? isDefault : false, id: "credit-card-dropdown-".concat(paymentMethodData.id) })) }))] })) : (jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-items-center justify-between w-full" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center" }, { children: [jsx(CreditCardOutlined, {}), jsx(Text$p, __assign({ className: "bunny-text-slate-400", style: { fontSize: '12px' } }, { children: "No payment methods" }))] })), jsx(Button, { disabled: true, type: "link" }), buttons] }))) })));
18071
18089
  };
18072
18090
  var Identifier = function (_a) {
18073
18091
  var _b, _c, _d;
@@ -18076,9 +18094,9 @@ var Identifier = function (_a) {
18076
18094
  return null;
18077
18095
  }
18078
18096
  if (((_c = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _c === void 0 ? void 0 : _c.type) === 'cashapp') {
18079
- return jsx(Text$r, { children: "Cashapp" });
18097
+ return jsx(Text$p, { children: "Cashapp" });
18080
18098
  }
18081
- return (jsxs("div", { children: [jsx(Text$r, __assign({ className: "relative -top-0.5" }, { children: "****" })), jsx(Text$r, { children: (_d = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _d === void 0 ? void 0 : _d.identifier })] }));
18099
+ return (jsxs("div", { children: [jsx(Text$p, __assign({ className: "relative -top-0.5" }, { children: "****" })), jsx(Text$p, { children: (_d = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _d === void 0 ? void 0 : _d.identifier })] }));
18082
18100
  };
18083
18101
  var Issuer = function (_a) {
18084
18102
  var _b;
@@ -18087,7 +18105,7 @@ var Issuer = function (_a) {
18087
18105
  var issuer = (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.issuer;
18088
18106
  if (issuer.length == 0 || list.includes(issuer.toLowerCase()))
18089
18107
  return null;
18090
- return jsx(Text$r, { children: lodashExports.capitalize(issuer) });
18108
+ return jsx(Text$p, { children: lodashExports.capitalize(issuer) });
18091
18109
  };
18092
18110
  var DropdownMenu = function (_a) {
18093
18111
  var setDefault = _a.setDefault, remove = _a.remove, isDefault = _a.isDefault, id = _a.id;
@@ -18148,75 +18166,6 @@ var CardImage = function (_a) {
18148
18166
  }
18149
18167
  };
18150
18168
 
18151
- // Automatically sets the default payment method if there is none currently set
18152
- var useAutoSetDefaultPaymentMethod = function (_a) {
18153
- var accountId = _a.accountId, token = _a.token, handleSetDefault = _a.handleSetDefault, setDefaultPaymentMethodLoading = _a.setDefaultPaymentMethodLoading, _b = _a.enabled, enabled = _b === void 0 ? true : _b;
18154
- var queryClient = useQueryClient();
18155
- var apiHost = useContext(BunnyContext).apiHost;
18156
- var _c = usePaymentMethod({
18157
- accountId: accountId,
18158
- token: token,
18159
- apiHost: apiHost,
18160
- }), storedPaymentMethods = _c.paymentMethods, defaultPaymentMethod = _c.defaultPaymentMethod;
18161
- // Set the default payment method on the cache. Prevents 'handleSetDefault' from being called too many times.
18162
- function setDefaultPaymentMethodOnCache(targetPaymentMethod) {
18163
- var cachedPaymentMethods = queryClient.getQueryData(QueryKeyFactory.default.accountPaymentMethodKey({
18164
- accountId: accountId,
18165
- token: token,
18166
- }));
18167
- if (cachedPaymentMethods) {
18168
- for (var _i = 0, _a = cachedPaymentMethods; _i < _a.length; _i++) {
18169
- var paymentMethod = _a[_i];
18170
- paymentMethod.isDefault = paymentMethod.id === targetPaymentMethod.id;
18171
- }
18172
- queryClient.setQueryData(QueryKeyFactory.default.accountPaymentMethodKey({
18173
- accountId: accountId,
18174
- token: token,
18175
- }), cachedPaymentMethods);
18176
- }
18177
- }
18178
- useEffect(function () {
18179
- if (setDefaultPaymentMethodLoading || !enabled)
18180
- return;
18181
- if ((storedPaymentMethods === null || storedPaymentMethods === void 0 ? void 0 : storedPaymentMethods.length) > 0 && !defaultPaymentMethod) {
18182
- handleSetDefault(storedPaymentMethods[0]);
18183
- setDefaultPaymentMethodOnCache(storedPaymentMethods[0]);
18184
- }
18185
- }, [
18186
- storedPaymentMethods,
18187
- defaultPaymentMethod,
18188
- handleSetDefault,
18189
- setDefaultPaymentMethodLoading,
18190
- queryClient,
18191
- accountId,
18192
- token,
18193
- ]);
18194
- };
18195
-
18196
- var usePaymentMethodSelectorPlugin = function (_a) {
18197
- var defaultPaymentMethod = _a.defaultPaymentMethod, defaultPaymentMethodPlugin = _a.defaultPaymentMethodPlugin, paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins;
18198
- var _b = useState(), selectorPaymentMethodPlugin = _b[0], setSelectorPaymentMethodPlugin = _b[1];
18199
- useEffect(function () {
18200
- if (selectorPaymentMethodPlugin) {
18201
- return;
18202
- }
18203
- if (defaultPaymentMethod) {
18204
- setSelectorPaymentMethodPlugin(defaultPaymentMethodPlugin);
18205
- }
18206
- else {
18207
- setSelectorPaymentMethodPlugin(paymentMethodAllowedPlugins === null || paymentMethodAllowedPlugins === void 0 ? void 0 : paymentMethodAllowedPlugins[0]);
18208
- }
18209
- }, [
18210
- defaultPaymentMethod,
18211
- defaultPaymentMethodPlugin,
18212
- paymentMethodAllowedPlugins,
18213
- ]);
18214
- return {
18215
- selectorPaymentMethodPlugin: selectorPaymentMethodPlugin,
18216
- setSelectorPaymentMethodPlugin: setSelectorPaymentMethodPlugin,
18217
- };
18218
- };
18219
-
18220
18169
  var SavePaymentMethodFooter = function (_a) {
18221
18170
  var isSaving = _a.isSaving, onSave = _a.onSave, noPadding = _a.noPadding;
18222
18171
  var isMobile = useIsMobile();
@@ -18378,7 +18327,7 @@ function useSave$1(_a) {
18378
18327
  return { save: save, isSaving: isSaving };
18379
18328
  }
18380
18329
 
18381
- var Text$q = Typography.Text;
18330
+ var Text$o = Typography.Text;
18382
18331
  var TEST_CARD = '4242424242424242';
18383
18332
  var DemoPayForm = function (_a) {
18384
18333
  var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
@@ -18440,7 +18389,7 @@ var DemoPayForm = function (_a) {
18440
18389
  var onCardCvcChange = function (cvc) {
18441
18390
  setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
18442
18391
  };
18443
- return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxs(StyledInputs, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxs("div", __assign({ className: "bunny-flex bunny-gap-2" }, { children: [jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsx(Text$q, { children: "DemoPay is for testing only." }), jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
18392
+ return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxs(StyledInputs, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxs("div", __assign({ className: "bunny-flex bunny-gap-2" }, { children: [jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsx(Text$o, { children: "DemoPay is for testing only." }), jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
18444
18393
  };
18445
18394
  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) {
18446
18395
  var darkMode = _a.darkMode;
@@ -18671,12 +18620,11 @@ var PaymentMethodDetails = function (_a) {
18671
18620
  }
18672
18621
  };
18673
18622
 
18674
- var CardIcon = function (_a) {
18675
- var className = _a.className;
18676
- return (jsxs("svg", __assign({ className: className, width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [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: SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), jsx("path", { d: "M1.5 7.5H16.5", stroke: SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] })));
18623
+ var CardIcon = function () {
18624
+ return (jsxs("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [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: SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), jsx("path", { d: "M1.5 7.5H16.5", stroke: SLATE_400, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] })));
18677
18625
  };
18678
18626
 
18679
- var Text$p = Typography.Text;
18627
+ var Text$n = Typography.Text;
18680
18628
  var PaymentMethodSelector = function (_a) {
18681
18629
  var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
18682
18630
  return (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 (jsx(PaymentOption, { name: plugin.name, onClick: onSelect, paymentPlugin: plugin, selected: (value === null || value === void 0 ? void 0 : value.id) === plugin.id }, index)); }) })));
@@ -18685,11 +18633,11 @@ var PaymentOption = function (_a) {
18685
18633
  var selected = _a.selected, paymentPlugin = _a.paymentPlugin, onClick = _a.onClick, name = _a.name;
18686
18634
  var brandColor = useContext(BrandContext).brandColor;
18687
18635
  var darkMode = useContext(BunnyContext).darkMode;
18688
- var isAch = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('ach');
18689
- var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes('card');
18690
- return (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
18636
+ var isAch = name === null || name === void 0 ? void 0 : name.toLowerCase().includes("ach");
18637
+ var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes("card");
18638
+ return (jsxs(PaymentOptionContainer, __assign({ "$brandColor": brandColor, "$selected": selected, className: "bunny-flex bunny-justify-between bunny-items-center bunny-w-full bunny-cursor-pointer bunny-py-2 bunny-px-4 bunny-rounded bunny-border-solid ".concat(darkMode
18691
18639
  ? "var(--row-background-dark) border-gray-500"
18692
- : 'bunny-bg-slate-50 bunny-border-slate-200', " bunny-border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-gap-2 bunny-items-center bunny-pl-4" }, { children: [jsx(Checkbox, { checked: selected, className: darkMode ? 'border-gray-400' : '' }), jsx(Text$p, { children: name })] })), isAch ? (jsx(BankOutlined, { className: "bunny-pr-4" })) : isCard ? (jsx(CardIcon, { className: "bunny-pr-4" })) : (jsx(CardIcon, { className: "bunny-pr-4" }))] })));
18640
+ : "bunny-bg-slate-50 bunny-border-slate-200", " bunny-border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-gap-2 bunny-items-center" }, { children: [jsx(Checkbox, { checked: selected, className: darkMode ? "border-gray-400" : "" }), jsx(Text$n, { children: name })] })), isAch ? (jsx(BankOutlined, { className: "bunny-text-slate-400" })) : isCard ? (jsx(CardIcon, {})) : (jsx(CardIcon, {}))] })));
18693
18641
  };
18694
18642
  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) {
18695
18643
  var $brandColor = _a.$brandColor, $selected = _a.$selected;
@@ -18899,7 +18847,7 @@ function StripeWrapper(_a) {
18899
18847
  }
18900
18848
 
18901
18849
  function Invoice(_a) {
18902
- var id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onInvoiceDownloadError = _a.onInvoiceDownloadError, onPaymentSuccess = _a.onPaymentSuccess, _b = _a.shadow, shadow = _b === void 0 ? 'shadow-md' : _b, className = _a.className, _c = _a.hideDownloadButton, hideDownloadButton = _c === void 0 ? false : _c, onInvoiceLoaded = _a.onInvoiceLoaded;
18850
+ var id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onInvoiceDownloadError = _a.onInvoiceDownloadError, onPaymentSuccess = _a.onPaymentSuccess, _b = _a.shadow, shadow = _b === void 0 ? "shadow-md" : _b, className = _a.className, _c = _a.hideDownloadButton, hideDownloadButton = _c === void 0 ? false : _c, onInvoiceLoaded = _a.onInvoiceLoaded;
18903
18851
  return (jsx(InvoiceQuoteContext.Provider, __assign({ value: {
18904
18852
  id: id,
18905
18853
  invoiceQuoteViewComponent: invoiceQuoteViewComponent,
@@ -18926,10 +18874,10 @@ function ActualInvoice() {
18926
18874
  // Queries
18927
18875
  var formattedInvoice = useQuery({
18928
18876
  queryKey: QueryKeyFactory.default.createFormattedInvoiceKey({ id: id, token: token }),
18929
- queryFn: function () { return getFormattedInvoice({ id: id, token: token, apiHost: apiHost, componentsVersion: PACKAGE_VERSION }); },
18877
+ queryFn: function () { return getFormattedInvoice({ id: id, token: token, apiHost: apiHost }); },
18930
18878
  }).data;
18931
18879
  // Derived state
18932
- var isInvoicePayable = PAYABLE_INVOICE_STATES.includes((formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.state) || '');
18880
+ var isInvoicePayable = PAYABLE_INVOICE_STATES.includes((formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.state) || "");
18933
18881
  // Local state
18934
18882
  var isMobile = useIsMobile(isInvoicePayable ? BreakpointNumbers.lg : undefined);
18935
18883
  var onSuccess = function () {
@@ -18942,7 +18890,7 @@ function ActualInvoice() {
18942
18890
  token: token,
18943
18891
  }),
18944
18892
  });
18945
- showSuccessNotification('Your invoice has been paid', 'Payment successful');
18893
+ showSuccessNotification("Your invoice has been paid", "Payment successful");
18946
18894
  onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess();
18947
18895
  };
18948
18896
  var onFail = function (error) {
@@ -18955,10 +18903,10 @@ function ActualInvoice() {
18955
18903
  }, [formattedInvoice]);
18956
18904
  if (!formattedInvoice)
18957
18905
  return jsx(Fragment, {});
18958
- return (jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-gap-6 bunny-overflow-hidden ".concat(isMobile ? 'bunny-flex-col bunny-w-full' : '', " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-w-full" }, { children: jsx(LegacyDocument, { documentUuid: formattedInvoice.uuid, documentType: "invoice" }) }))) : (invoiceQuoteViewComponent || (jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsx("div", __assign({ className: "bunny-w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? '' : 'pt-12') }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice }) })))] })) })));
18906
+ return (jsx("div", __assign({ className: "bunny-invoice-container" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-gap-6 ".concat(isMobile ? "bunny-flex-col bunny-w-full bunny-overflow-hidden" : "", " ").concat(className) }, { children: [formattedInvoice.isLegacy ? (jsx("div", __assign({ className: "bunny-flex bunny-justify-center bunny-w-full" }, { children: jsx(InvoicePDF, { invoiceUuid: formattedInvoice.uuid, apiHost: apiHost, token: token }) }))) : (invoiceQuoteViewComponent || (jsx(InvoiceQuoteView, { html: formattedInvoice.html, formattedInvoice: formattedInvoice, backButtonName: backButtonName, onBackButtonClick: onBackButtonClick }))), isInvoicePayable && (jsx("div", __assign({ className: "bunny-w-full ".concat(hideDownloadButton || formattedInvoice.isLegacy ? "" : "pt-12") }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: formattedInvoice }) })))] })) })));
18959
18907
  }
18960
18908
 
18961
- var MUTATION$7 = function (id) { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\n object { documents { id filename size date url } }\n billingCity\n billingCountry\n billingState\n billingStreet\n billingZip\n contactName\n currency\n customerBillingCity\n customerBillingCountry\n customerBillingState\n customerBillingStreet\n customerBillingZip\n customerName\n discount\n discountValue\n duration\n endDate\n expiresAt\n html\n formattedLines {\n amount\n amountsByPeriod {\n quantity\n id\n name\n startDate\n endDate\n amount\n amountsByTier {\n id\n tier {\n starts\n ends\n price\n }\n quantity\n amount\n }\n prorationRate\n }\n billingPeriodEnd\n billingPeriodStart\n chargeType\n discount\n frequency\n isRamp\n periods\n planName\n position\n price\n priceDecimals\n priceListChargeId\n priceListChargeName\n priceListId\n priceListName\n priceTiers {\n price\n starts\n }\n pricingModel\n productName\n prorationRate\n quantity\n showProductNameOnLineItem\n taxCode\n trialEndDate\n trialStartDate\n unitOfMeasure\n vatCode\n }\n netPaymentDays\n notes\n number\n poNumberRequired\n salesContactEmail\n sharedAt\n startDate\n state\n subtotal\n taxAmount\n taxNumberLabel\n taxNumberRequired\n vendorName\n }\n }"; };
18909
+ var MUTATION$6 = function (id) { return "\n query formattedQuote ($id: ID) {\n formattedQuote (id: $id) {\n payableId\n acceptedAt\n acceptedByName\n amount\n amountDue\n amountsByPeriod {\n id\n name\n amount\n }\n object { documents { id filename size date url } }\n billingCity\n billingCountry\n billingState\n billingStreet\n billingZip\n contactName\n currency\n customerBillingCity\n customerBillingCountry\n customerBillingState\n customerBillingStreet\n customerBillingZip\n customerName\n discount\n discountValue\n duration\n endDate\n expiresAt\n html\n formattedLines {\n amount\n amountsByPeriod {\n quantity\n id\n name\n startDate\n endDate\n amount\n amountsByTier {\n id\n tier {\n starts\n ends\n price\n }\n quantity\n amount\n }\n prorationRate\n }\n billingPeriodEnd\n billingPeriodStart\n chargeType\n discount\n frequency\n isRamp\n periods\n planName\n position\n price\n priceDecimals\n priceListChargeId\n priceListChargeName\n priceListId\n priceListName\n priceTiers {\n price\n starts\n }\n pricingModel\n productName\n prorationRate\n quantity\n showProductNameOnLineItem\n taxCode\n trialEndDate\n trialStartDate\n unitOfMeasure\n vatCode\n }\n netPaymentDays\n notes\n number\n poNumberRequired\n salesContactEmail\n sharedAt\n startDate\n state\n subtotal\n taxAmount\n taxNumberLabel\n taxNumberRequired\n vendorName\n }\n }"; };
18962
18910
  var getFormattedQuote = function (_a) {
18963
18911
  var id = _a.id, token = _a.token, apiHost = _a.apiHost;
18964
18912
  return __awaiter(void 0, void 0, void 0, function () {
@@ -18966,7 +18914,7 @@ var getFormattedQuote = function (_a) {
18966
18914
  return __generator(this, function (_b) {
18967
18915
  switch (_b.label) {
18968
18916
  case 0: return [4 /*yield*/, gqlRequest({
18969
- query: MUTATION$7(),
18917
+ query: MUTATION$6(),
18970
18918
  token: token,
18971
18919
  apiHost: apiHost,
18972
18920
  vars: { id: id },
@@ -19238,7 +19186,7 @@ var AcceptQuoteModal = function (_a) {
19238
19186
  }, open: acceptBoxVisible, title: "Accept quote", width: 400 }, { children: jsxs(Form, __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2", form: form, layout: "vertical" }, { children: [jsx(Form.Item, __assign({ label: "Your name", name: "name", rules: createRules(true, "Your name") }, { children: jsx(Input, { autoFocus: true, ref: firstInputRef }) })), jsx(Form.Item, __assign({ label: "Your job title", name: "title", rules: createRules(true, "Your job title") }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Purchase order number", name: "poNumber", rules: createRules(poNumberRequired, "Purchase order number") }, { children: jsx(Input, {}) })), taxNumberRequired && (jsx(Form.Item, __assign({ name: "taxNumber", label: taxNumberLabel, rules: createRules(taxNumberRequired, taxNumberLabel) }, { children: jsx(Input, {}) })))] })) })));
19239
19187
  };
19240
19188
 
19241
- var Text$o = Typography.Text;
19189
+ var Text$m = Typography.Text;
19242
19190
  defaultStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
19243
19191
  function Quote(_a) {
19244
19192
  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;
@@ -19307,13 +19255,13 @@ function ActualQuote() {
19307
19255
  var isAccepted = formattedQuote.state === 'ACCEPTED';
19308
19256
  return (jsxs(Fragment, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-4 ".concat(isMobile ? 'bunny-w-full bunny-overflow-hidden' : '', " ").concat(className) }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-row bunny-justify-end bunny-items-center bunny-gap-4", id: "acceptance", style: {
19309
19257
  color: entityBranding.secondaryColor,
19310
- } }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsx(Text$o, { children: "Quote was accepted by ".concat(formattedQuote.acceptedByName, " on ").concat(formatDate(formattedQuote.acceptedAt)) })) : null, (!isMobile || !isAccepted) && (jsxs("div", __assign({ className: isMobile ? 'flex w-full justify-end gap-2' : 'flex items-center justify-end gap-2' }, { children: [!isMobile && !hideDownloadButton ? (jsx(Button, __assign({ icon: jsx(DownloadOutlined, {}), onClick: function () { return downloadFile(apiHost + '/api/pdf/quote', token); } }, { children: "Download" }))) : null, !isAccepted ? (jsx(Button, __assign({ disabled: isExpired || isAccepting, onClick: function () { return startAcceptance(); }, type: "primary" }, { children: isExpired ? 'Quote is expired' : 'Accept quote' }))) : null] })))] })), jsx(InvoiceQuoteView, __assign({ html: formattedQuote.html }, { children: ((_b = (_a = formattedQuote.object) === null || _a === void 0 ? void 0 : _a.documents) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: formattedQuote.object.documents.map(function (doc, index) {
19258
+ } }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsx(Text$m, { children: "Quote was accepted by ".concat(formattedQuote.acceptedByName, " on ").concat(formatDate(formattedQuote.acceptedAt)) })) : null, (!isMobile || !isAccepted) && (jsxs("div", __assign({ className: isMobile ? 'flex w-full justify-end gap-2' : 'flex items-center justify-end gap-2' }, { children: [!isMobile && !hideDownloadButton ? (jsx(Button, __assign({ icon: jsx(DownloadOutlined, {}), onClick: function () { return downloadFile(apiHost + '/api/pdf/quote', token); } }, { children: "Download" }))) : null, !isAccepted ? (jsx(Button, __assign({ disabled: isExpired || isAccepting, onClick: function () { return startAcceptance(); }, type: "primary" }, { children: isExpired ? 'Quote is expired' : 'Accept quote' }))) : null] })))] })), jsx(InvoiceQuoteView, __assign({ html: formattedQuote.html }, { children: ((_b = (_a = formattedQuote.object) === null || _a === void 0 ? void 0 : _a.documents) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-end" }, { children: formattedQuote.object.documents.map(function (doc, index) {
19311
19259
  return (jsx(Button, __assign({ download: doc.filename, href: doc.url, type: "link" }, { children: doc.filename }), index));
19312
19260
  }) }))) : null }))] })), jsx(AcceptQuoteModal, { acceptBoxVisible: acceptBoxVisible, formattedQuote: formattedQuote, setAcceptBoxVisible: setAcceptBoxVisible, setIsAccepting: setIsAccepting, sendAccept: sendAccept }), jsx(PandadocPollingModal, { isVisible: pandadocPollingModalVisible, setVisible: setPandadocPollingModalVisible, id: id })] }));
19313
19261
  }
19314
19262
  var templateObject_1$7;
19315
19263
 
19316
- var QUOTES_QUERY = function (filter) { return "\n query quotes {\n quotes ".concat(filter ? "(".concat(filter, ")") : '', " {\n pageInfo {\n startCursor\n endCursor\n hasNextPage\n hasPreviousPage\n }\n nodes {\n id\n name\n account {\n name\n id\n }\n applicationDate\n state\n createdAt\n expiresAt\n currencyId\n amount\n number\n }\n }\n }"); };
19264
+ var QUOTES_QUERY = function (filter) { return "\n query quotes {\n quotes ".concat(filter ? "(".concat(filter, ")") : "", " {\n pageInfo {\n startCursor\n endCursor\n hasNextPage\n hasPreviousPage\n }\n nodes {\n id\n name\n account {\n name\n id\n }\n applicationDate\n state\n createdAt\n expiresAt\n currencyId\n amount\n number\n }\n }\n }"); };
19317
19265
  var getQuotes = function (_a) {
19318
19266
  var token = _a.token, apiHost = _a.apiHost, filter = _a.filter;
19319
19267
  return __awaiter(void 0, void 0, void 0, function () {
@@ -19398,10 +19346,10 @@ var getColor = function (state) {
19398
19346
  }
19399
19347
  };
19400
19348
 
19401
- var Text$n = Typography.Text;
19349
+ var Text$l = Typography.Text;
19402
19350
  var TransactionDate = function (_a) {
19403
19351
  var date = _a.date;
19404
- return jsx(Text$n, __assign({ className: "bunny-text-sm" }, { children: formatDate(date) }));
19352
+ return jsx(Text$l, __assign({ className: "bunny-text-sm" }, { children: formatDate(date) }));
19405
19353
  };
19406
19354
 
19407
19355
  var ArrowDownToLine = function (_a) {
@@ -19438,13 +19386,13 @@ var TransactionGridCell = defaultStyled.div.withConfig({
19438
19386
  }, SLATE_600);
19439
19387
  var templateObject_1$6;
19440
19388
 
19441
- var Text$m = Typography.Text;
19389
+ var Text$k = Typography.Text;
19442
19390
  var TransactionsEmptyState = function () {
19443
19391
  var noTransactionsMessage = useContext(TransactionsListContext).noTransactionsMessage;
19444
- return (jsx(Text$m, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || "There are no transactions" })));
19392
+ return (jsx(Text$k, __assign({ className: "bunny-flex bunny-justify-center bunny-p-4 bunny-text-base" }, { children: noTransactionsMessage || "There are no transactions" })));
19445
19393
  };
19446
19394
 
19447
- var Text$l = Typography.Text;
19395
+ var Text$j = Typography.Text;
19448
19396
  var isInvoice = function (transaction) {
19449
19397
  return transaction.kind === "INVOICE";
19450
19398
  };
@@ -19456,7 +19404,7 @@ var TransactionRowTitle = function (_a) {
19456
19404
  if (!isInvoice(transaction) && !isQuote(transaction)) {
19457
19405
  return jsx(Fragment, {});
19458
19406
  }
19459
- return (jsx(Text$l, __assign({ className: "bunny-text-slate-400", style: { fontSize: "11px" } }, { children: transaction.transactionable.number })));
19407
+ return (jsx(Text$j, __assign({ className: "bunny-text-slate-400", style: { fontSize: "11px" } }, { children: transaction.transactionable.number })));
19460
19408
  };
19461
19409
 
19462
19410
  function transactionDateToDisplay(transaction, transactionDateType) {
@@ -19475,7 +19423,7 @@ function transactionDateToDisplay(transaction, transactionDateType) {
19475
19423
  }
19476
19424
  }
19477
19425
 
19478
- var Text$k = Typography.Text;
19426
+ var Text$i = Typography.Text;
19479
19427
  var TransactionsListDesktop = function (_a) {
19480
19428
  var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
19481
19429
  var _b = useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
@@ -19504,11 +19452,11 @@ var TransactionsListDesktop = function (_a) {
19504
19452
  !showState &&
19505
19453
  !showAmount &&
19506
19454
  !showDownload &&
19507
- !showAccountName && (jsx(TransactionGridCell, { children: jsx(Text$k, { children: "No columns selected" }) })), showDate && (jsx(TransactionGridCell, __assign({ right: false }, { children: jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) }) }))), showTitle && (jsx(Fragment, { children: jsxs(TransactionGridCell, __assign({ right: false, className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [jsx(Text$k, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] })) })), showAccountName && (jsx(TransactionGridCell, __assign({ right: false }, { children: jsx(Text$k, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }) }))), !showDate && !showTitle && !showAccountName && (jsx(TransactionGridCell, { right: false })), showDownload && (jsx(TransactionGridCell, { children: jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })), showState ? (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(StateTag, { state: transaction.state }) }))) : null, showAmount && (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(Text$k, { children: formatCurrency(((_b = transaction === null || transaction === void 0 ? void 0 : transaction.transactionable) === null || _b === void 0 ? void 0 : _b.amount) || transaction.amount, transaction.currencyId) }) })))] }), index));
19455
+ !showAccountName && (jsx(TransactionGridCell, { children: jsx(Text$i, { children: "No columns selected" }) })), showDate && (jsx(TransactionGridCell, __assign({ right: false }, { children: jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) }) }))), showTitle && (jsx(Fragment, { children: jsxs(TransactionGridCell, __assign({ right: false, className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [jsx(Text$i, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] })) })), showAccountName && (jsx(TransactionGridCell, __assign({ right: false }, { children: jsx(Text$i, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }) }))), !showDate && !showTitle && !showAccountName && (jsx(TransactionGridCell, { right: false })), showDownload && (jsx(TransactionGridCell, { children: jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })), showState ? (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(StateTag, { state: transaction.state }) }))) : null, showAmount && (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(Text$i, { children: formatCurrency(((_b = transaction === null || transaction === void 0 ? void 0 : transaction.transactionable) === null || _b === void 0 ? void 0 : _b.amount) || transaction.amount, transaction.currencyId) }) })))] }), index));
19508
19456
  }) }));
19509
19457
  };
19510
19458
 
19511
- var Text$j = Typography.Text;
19459
+ var Text$h = Typography.Text;
19512
19460
  var TransactionsListMobile = function (_a) {
19513
19461
  var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
19514
19462
  var _b = useContext(TransactionsListContext), columns = _b.columns, transactionDateType = _b.transactionDateType;
@@ -19531,12 +19479,12 @@ var TransactionsListMobile = function (_a) {
19531
19479
  backgroundColor: index % 2 === 0
19532
19480
  ? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
19533
19481
  : "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
19534
- } }, { children: [jsx(TransactionGridCell, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [(showTitle || showState) && (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showTitle && (jsxs(Fragment, { children: [jsx(Text$j, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] })), showState && jsx(StateTag, { state: transaction.state })] }))), jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showAccountName && jsx(Text$j, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }), showAccountName && showDate && jsx(Text$j, { children: "\u00B7" }), showDate && (jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) })), showDate && showAmount && jsx(Text$j, { children: "\u00B7" }), showAmount && (jsx(Text$j, { children: formatCurrency(transaction.transactionable.amount ||
19482
+ } }, { children: [jsx(TransactionGridCell, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [(showTitle || showState) && (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showTitle && (jsxs(Fragment, { children: [jsx(Text$h, { children: lodashExports.capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] })), showState && jsx(StateTag, { state: transaction.state })] }))), jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-2" }, { children: [showAccountName && jsx(Text$h, { children: (_a = transaction.account) === null || _a === void 0 ? void 0 : _a.name }), showAccountName && showDate && jsx(Text$h, { children: "\u00B7" }), showDate && (jsx(TransactionDate, { date: transactionDateToDisplay(transaction, transactionDateType) })), showDate && showAmount && jsx(Text$h, { children: "\u00B7" }), showAmount && (jsx(Text$h, { children: formatCurrency(transaction.transactionable.amount ||
19535
19483
  transaction.amount, transaction.currencyId) }))] }))] })) }), showDownload && (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })))] }), index));
19536
19484
  }) }));
19537
19485
  };
19538
19486
 
19539
- var Text$i = Typography.Text;
19487
+ var Text$g = Typography.Text;
19540
19488
  var DISPLAY_WIDTH = 1200;
19541
19489
  function Transactions(_a) {
19542
19490
  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 ? [
@@ -19649,7 +19597,7 @@ function TransactionsDisplay(_a) {
19649
19597
  onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
19650
19598
  setDrawerOpen(false);
19651
19599
  }
19652
- return (jsxs("div", __assign({ style: style }, { children: [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 ? (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 ? (jsx(Text$i, __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsx("div", {}) // Empty div so justify-between works
19600
+ return (jsxs("div", __assign({ style: style }, { children: [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 ? (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 ? (jsx(Text$g, __assign({ className: "bunny-shrink-0 bunny-font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsx("div", {}) // Empty div so justify-between works
19653
19601
  ), showSearchBar && (jsx("div", __assign({ className: "".concat(isMobile ? "bunny-w-full" : "") }, { children: jsx(Input, { className: searchBarClassName
19654
19602
  ? searchBarClassName
19655
19603
  : "border border-slate-200", onChange: function (e) {
@@ -19767,7 +19715,7 @@ function QuotesWrapper() {
19767
19715
  return (jsx(TransactionsDisplay, { transactions: quotesAsTransactions, onSearchValueChanged: setSearch, search: search }));
19768
19716
  }
19769
19717
 
19770
- var MUTATION$6 = function () { return "\nmutation AccountSignup (\n $pluginId: String!,\n $paymentMethodId: String,\n $priceListCode: String!,\n $accountId: ID!,\n $quoteId: ID!,\n $entityId: ID!\n) {\n accountSignup(\n pluginId: $pluginId,\n paymentMethodId: $paymentMethodId,\n priceListCode: $priceListCode,\n accountId: $accountId,\n quoteId: $quoteId,\n entityId: $entityId\n ) {\n errors\n quote {\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n }\n}"; };
19718
+ var MUTATION$5 = function () { return "\nmutation AccountSignup (\n $pluginId: String!,\n $paymentMethodId: String,\n $priceListCode: String!,\n $accountId: ID!,\n $quoteId: ID!,\n $entityId: ID!\n) {\n accountSignup(\n pluginId: $pluginId,\n paymentMethodId: $paymentMethodId,\n priceListCode: $priceListCode,\n accountId: $accountId,\n quoteId: $quoteId,\n entityId: $entityId\n ) {\n errors\n quote {\n acceptedByName\n acceptedByTitle\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n }\n}"; };
19771
19719
  var accountSignup = function (_a) {
19772
19720
  var token = _a.token, apiHost = _a.apiHost, accountId = _a.accountId, quoteId = _a.quoteId, paymentToken = _a.paymentToken, paymentMethodId = _a.paymentMethodId, pluginId = _a.pluginId, priceListCode = _a.priceListCode, entityId = _a.entityId;
19773
19721
  return __awaiter(void 0, void 0, void 0, function () {
@@ -19786,7 +19734,7 @@ var accountSignup = function (_a) {
19786
19734
  entityId: entityId,
19787
19735
  };
19788
19736
  return [4 /*yield*/, gqlRequest({
19789
- query: MUTATION$6(),
19737
+ query: MUTATION$5(),
19790
19738
  token: token,
19791
19739
  vars: vars,
19792
19740
  apiHost: apiHost,
@@ -19802,7 +19750,7 @@ var accountSignup = function (_a) {
19802
19750
  });
19803
19751
  };
19804
19752
 
19805
- var MUTATION$5 = function () { return "\nmutation QuoteAccountSignup (\n $accountName: String!,\n $billingContact: ContactAttributes!,\n $priceListCode: String!,\n $entityId: ID!\n) {\n quoteAccountSignup(\n priceListCode: $priceListCode,\n accountName: $accountName,\n billingContact: $billingContact,\n entityId: $entityId\n ) {\n account {\n id\n }\n quote {\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n tenant {\n code\n }\n portalSessionToken\n errors\n }\n}"; };
19753
+ var MUTATION$4 = function () { return "\nmutation QuoteAccountSignup (\n $accountName: String!,\n $billingContact: ContactAttributes!,\n $priceListCode: String!,\n $entityId: ID!\n) {\n quoteAccountSignup(\n priceListCode: $priceListCode,\n accountName: $accountName,\n billingContact: $billingContact,\n entityId: $entityId\n ) {\n account {\n id\n }\n quote {\n acceptedByName\n acceptedByTitle\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n tenant {\n code\n }\n portalSessionToken\n errors\n }\n}"; };
19806
19754
  var quoteAccountSignup = function (_a) {
19807
19755
  var token = _a.token, apiHost = _a.apiHost, priceListCode = _a.priceListCode, accountName = _a.accountName, billingContact = _a.billingContact, entityId = _a.entityId;
19808
19756
  return __awaiter(void 0, void 0, void 0, function () {
@@ -19818,7 +19766,7 @@ var quoteAccountSignup = function (_a) {
19818
19766
  entityId: entityId,
19819
19767
  };
19820
19768
  return [4 /*yield*/, gqlRequest({
19821
- query: MUTATION$5(),
19769
+ query: MUTATION$4(),
19822
19770
  token: token,
19823
19771
  vars: vars,
19824
19772
  apiHost: apiHost,
@@ -19834,34 +19782,7 @@ var quoteAccountSignup = function (_a) {
19834
19782
  });
19835
19783
  };
19836
19784
 
19837
- var MUTATION$4 = "mutation quoteAddCoupon($couponCode: String!, $quoteId: ID!) {\n quoteAddCoupon(couponCode: $couponCode, quoteId: $quoteId) {\n quote {\n id\n subtotal\n taxAmount\n amount\n quoteChanges {\n id\n charges {\n id\n amount\n couponId\n }\n }\n }\n }\n}";
19838
- var quoteAddCoupon = function (_a) {
19839
- var quoteId = _a.quoteId, couponCode = _a.couponCode, token = _a.token, apiHost = _a.apiHost;
19840
- return __awaiter(void 0, void 0, void 0, function () {
19841
- var vars, response, errors;
19842
- var _b;
19843
- return __generator(this, function (_c) {
19844
- switch (_c.label) {
19845
- case 0:
19846
- vars = { quoteId: quoteId, couponCode: couponCode };
19847
- return [4 /*yield*/, gqlRequest({
19848
- query: MUTATION$4,
19849
- token: token,
19850
- vars: vars,
19851
- apiHost: apiHost,
19852
- })];
19853
- case 1:
19854
- response = _c.sent();
19855
- errors = (_b = response === null || response === void 0 ? void 0 : response.quoteAddCoupon) === null || _b === void 0 ? void 0 : _b.errors;
19856
- if (errors)
19857
- throw errors;
19858
- return [2 /*return*/, response.quote];
19859
- }
19860
- });
19861
- });
19862
- };
19863
-
19864
- var MUTATION$3 = function () { return "\nquery PriceList($code: String!) {\n priceList (code: $code) {\n basePrice\n code\n createdAt\n currencyId\n id\n isVisible\n name\n periodMonths\n planId\n priceDescription\n productId\n product {\n name\n }\n sku\n trialAllowed\n trialLengthDays\n updatedAt\n }\n}"; };
19785
+ var MUTATION$3 = function () { return "\nquery PriceList($code: String!) {\n priceList (code: $code) {\n basePrice\n code\n createdAt\n currencyId\n id\n isVisible\n name\n periodMonths\n planId\n priceDescription\n productId\n sku\n trialAllowed\n trialLengthDays\n updatedAt\n }\n}"; };
19865
19786
  var getPriceList = function (_a) {
19866
19787
  var token = _a.token, code = _a.code, apiHost = _a.apiHost;
19867
19788
  return __awaiter(void 0, void 0, void 0, function () {
@@ -19882,105 +19803,52 @@ var getPriceList = function (_a) {
19882
19803
  });
19883
19804
  };
19884
19805
 
19885
- var QUOTE_QUERY = function (id) { return "\n query quote {\n quote(id: ".concat(id, ") {\n accountId\n amount\n amountDue\n smallUnitAmountDue\n currencyId\n formattedQuote {\n html\n }\n id\n payableId\n periodAmount\n subtotal\n taxAmount\n amountsByPeriod {\n amount\n startDate\n }\n quoteChanges {\n currencyId\n id\n kind\n charges {\n amountsByPeriod {\n amount\n startDate\n }\n amount\n billingPeriod\n currencyId\n feature {\n unitName\n }\n id\n name\n priceListCharge {\n id\n }\n priceList {\n id\n }\n couponId\n quantity\n kind\n }\n priceList {\n id\n plan {\n name\n }\n product {\n name\n }\n }\n\n }\n }\n }"); };
19886
- var getQuote = function (_a) {
19887
- var id = _a.id, token = _a.token, apiHost = _a.apiHost;
19888
- return __awaiter(void 0, void 0, void 0, function () {
19889
- var response;
19890
- return __generator(this, function (_b) {
19891
- switch (_b.label) {
19892
- case 0: return [4 /*yield*/, gqlRequest({
19893
- query: QUOTE_QUERY(id),
19894
- token: token,
19895
- vars: {},
19896
- apiHost: apiHost,
19897
- })];
19898
- case 1:
19899
- response = _b.sent();
19900
- return [2 /*return*/, response === null || response === void 0 ? void 0 : response.quote];
19901
- }
19902
- });
19903
- });
19904
- };
19905
-
19906
- var useCurrentUserData = function () {
19907
- var queryClient = useQueryClient();
19908
- var token = useToken();
19909
- var currentUser = queryClient.getQueryData(QueryKeyFactory.default.currentUserKey(token));
19910
- if (!currentUser)
19911
- return {};
19912
- return currentUser;
19913
- };
19914
-
19915
- var BunnyFooterIcon = function (_a) {
19916
- var color = _a.color;
19917
- return (jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [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 }), 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 }), 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 }), 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 }), 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 }), 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 })] })), jsx("defs", { children: jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
19918
- };
19919
-
19920
- var Text$h = Typography.Text;
19921
- var Footer = function (_a) {
19922
- var className = _a.className;
19923
- var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
19924
- var isMobile = useIsMobile();
19925
- return (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-shrink-0 ".concat(isMobile ? 'bunny-flex-col bunny-gap-2 bunny-grow' : '', " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-3" }, { children: [termsUrl && (jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsx(BunnyMarketingLink, {})] })));
19926
- };
19927
- var BunnyMarketingLink = function () {
19928
- var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
19929
- var isMobile = useIsMobile();
19930
- return (jsx("div", __assign({ className: "bunny-flex bunny-items-end bunny-justify-end ".concat(isMobile ? '' : 'grow') }, { children: 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: jsxs("div", __assign({ className: "bunny-flex bunny-items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: [jsx(Text$h, __assign({ className: "bunny-text-xs bunny-text-slate-400" }, { children: "Powered by\u00A0" })), jsx("div", __assign({ style: { paddingTop: '5px' } }, { children: jsx(BunnyFooterIcon, { color: isHovered ? PRIMARY_COLOR : SLATE_400 }) }))] })) })) })));
19931
- };
19932
- var StyedLink = styled.a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"])), SLATE_400, SLATE_500);
19933
- var StyledBunnyLink = styled(StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), PRIMARY_COLOR);
19934
- var templateObject_1$5, templateObject_2$1;
19935
-
19936
- var Title$1 = Typography.Title;
19937
19806
  function PaymentForms(_a) {
19938
19807
  var quote = _a.quote, handlePaymentSuccess = _a.handlePaymentSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, accountId = _a.accountId, overrideToken = _a.overrideToken, customCheckoutFunction = _a.customCheckoutFunction;
19939
- return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: overrideToken ? (jsxs(Fragment, { children: [jsx(Title$1, __assign({ className: "bunny-px-4 bunny-m-0", level: 2 }, { children: "Payment" })), jsx(PaymentForm, { onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, customCheckoutFunction: customCheckoutFunction })] })) : null })) : (jsxs(Fragment, { children: [jsx(Title$1, __assign({ className: "bunny-px-4 bunny-m-0", level: 2 }, { children: "Signup" })), jsx(InitialSignupForm, { className: "bunny-px-4", onSubmit: handleSubmit, submitting: proceedingToPayment })] })) }));
19808
+ return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: overrideToken ? (jsx(PaymentForm, { onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, customCheckoutFunction: customCheckoutFunction })) : null })) : (jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
19940
19809
  }
19941
19810
  function InitialSignupForm(_a) {
19942
- var className = _a.className, onSubmit = _a.onSubmit, submitting = _a.submitting;
19811
+ var onSubmit = _a.onSubmit, submitting = _a.submitting;
19943
19812
  var form = Form.useForm()[0];
19944
19813
  function handleSubmit() {
19945
19814
  form.validateFields({ validateOnly: false }).then(function () {
19946
19815
  onSubmit(form.getFieldsValue());
19947
19816
  });
19948
19817
  }
19949
- return (jsx(Form, __assign({ className: "bunny-flex bunny-flex-col bunny-h-full bunny-w-full ".concat(className), form: form, layout: "vertical", autoComplete: "off" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-2" }, { children: [jsx(Form.Item, __assign({ name: "firstName", rules: [{ required: true, message: 'First name is required' }] }, { children: jsx(Input, { placeholder: "First name" }) })), jsx(Form.Item, __assign({ name: "lastName", rules: [{ required: true, message: 'Last name is required' }] }, { children: jsx(Input, { placeholder: "Last name" }) })), jsx(Form.Item, __assign({ name: "email", rules: [
19950
- { required: true, message: 'Email is required' },
19951
- { type: 'email', message: 'Please enter a valid email' },
19952
- ] }, { children: jsx(Input, { placeholder: "Email" }) })), jsx(Form.Item, __assign({ name: "accountName", rules: [{ required: true, message: 'Company name is required' }] }, { children: jsx(Input, { placeholder: "Company name" }) })), jsx(Form.Item, { children: jsx(Button, __assign({ type: "primary", onClick: handleSubmit, loading: submitting, className: "bunny-w-full" }, { children: "Proceed to payment" })) })] })) })));
19818
+ return (jsxs(Form, __assign({ className: "bunny-flex bunny-flex-col bunny-justify-between bunny-h-full bunny-w-full", form: form, layout: "vertical", autoComplete: "off" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-2" }, { children: [jsx(Form.Item, __assign({ name: "firstName", rules: [{ required: true, message: 'Please input your first name!' }] }, { children: jsx(Input, { placeholder: "First name" }) })), jsx(Form.Item, __assign({ name: "lastName", rules: [{ required: true, message: 'Please input your last name!' }] }, { children: jsx(Input, { placeholder: "Last name" }) })), jsx(Form.Item, __assign({ name: "email", rules: [
19819
+ { required: true, message: 'Please input your email!' },
19820
+ { type: 'email', message: 'Please enter a valid email!' },
19821
+ ] }, { children: jsx(Input, { placeholder: "Email" }) })), jsx(Form.Item, __assign({ name: "accountName", rules: [{ required: true, message: 'Please input your company name!' }] }, { children: jsx(Input, { placeholder: "Company name" }) }))] })), jsx(Form.Item, { children: jsx(Button, __assign({ type: "primary", onClick: handleSubmit, loading: submitting, className: "bunny-w-full bunny-mt-4" }, { children: "Proceed to payment" })) })] })));
19953
19822
  }
19954
19823
 
19955
- var Title = Typography.Title, Text$g = Typography.Text;
19824
+ var Title = Typography.Title, Text$f = Typography.Text;
19956
19825
  function PaymentSuccessDisplay(_a) {
19957
19826
  var amountPaid = _a.amountPaid, className = _a.className, companyName = _a.companyName, returnUrl = _a.returnUrl, style = _a.style, currencyId = _a.currencyId;
19958
- return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-justify-center bunny-h-full ".concat(className), style: style }, { children: [jsx(CheckCircleFilled, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxs(Title, __assign({ level: 3, className: "bunny-mt-2 bunny-m-0" }, { children: ["Payment of ", formatCurrency(amountPaid, currencyId), " successful"] })), returnUrl && (jsxs(Text$g, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
19827
+ return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-justify-center bunny-h-full ".concat(className), style: style }, { children: [jsx(CheckCircleFilled, { style: { fontSize: "48px", color: "rgb(52 211 153)" } }), jsxs(Title, __assign({ level: 3, className: "bunny-mt-2 bunny-m-0" }, { children: ["Payment of ", formatCurrency(amountPaid, currencyId), " successful"] })), returnUrl && (jsxs(Text$f, __assign({ className: "bunny-text-slate-500 bunny-cursor-pointer bunny-underline", onClick: function () { return (window.location.href = returnUrl); } }, { children: ["Back to ", companyName] })))] })));
19959
19828
  }
19960
19829
 
19961
- var Text$f = Typography.Text;
19830
+ var Text$e = Typography.Text;
19962
19831
  function PriceListDisplay(_a) {
19963
- var priceListData = _a.priceListData;
19832
+ var priceListData = _a.priceListData, topNavImageUrl = _a.topNavImageUrl;
19964
19833
  if (!priceListData)
19965
19834
  return null;
19966
- return (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-8" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2" }, { children: [jsxs(Text$f, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: [priceListData.product.name, " ", priceListData.name] })), jsxs(Text$f, __assign({ className: "bunny-font-bold bunny-text-xl" }, { children: [formatCurrency(priceListData.basePrice, priceListData.currencyId), " / month"] }))] })), priceListData.trialAllowed ? (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: [jsxs(Text$f, __assign({ style: { fontSize: '16px' }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsx(Text$f, __assign({ className: "bunny-text-slate-500", style: { fontSize: '12px' } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })));
19835
+ return (jsx(Fragment, { children: jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-justify-between bunny-h-full bunny-my-12" }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-space-y-8" }, { children: [jsx(Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false }), jsxs("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: [jsx(Text$e, __assign({ className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg" }, { children: priceListData.name })), jsxs(Text$e, __assign({ className: "bunny-font-bold bunny-text-xl" }, { children: [formatCurrency(priceListData.basePrice, priceListData.currencyId), " ", "/ month"] }))] })), priceListData.trialAllowed ? (jsxs("div", __assign({ className: "bunny-flex bunny-flex-col" }, { children: [jsxs(Text$e, __assign({ style: { fontSize: "16px" }, className: "bunny-text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsx(Text$e, __assign({ className: "bunny-text-slate-500", style: { fontSize: "12px" } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })) })) }));
19967
19836
  }
19968
19837
 
19969
19838
  var showErrorNotification = useErrorNotification();
19970
19839
  function Signup(_a) {
19971
- var companyName = _a.companyName, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, couponCode = _a.couponCode, className = _a.className, _b = _a.shadow, shadow = _b === void 0 ? 'shadow-md' : _b, style = _a.style, entityId = _a.entityId;
19840
+ var companyName = _a.companyName, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, className = _a.className, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, style = _a.style, entityId = _a.entityId;
19972
19841
  // Hooks
19973
19842
  var apiHost = useContext(BunnyContext).apiHost;
19974
19843
  var tokenFromContexts = useToken();
19975
19844
  var isMobile = useIsMobile();
19976
19845
  var topNavImageUrl = useContext(BrandContext).topNavImageUrl;
19977
- var _c = useState(undefined), initialQuote = _c[0], setInitialQuote = _c[1];
19978
- var _d = useState(undefined), accountId = _d[0], setAccountId = _d[1];
19979
- var _e = useState(undefined), portalSessionToken = _e[0], setPortalSessionToken = _e[1];
19846
+ var _d = useState(undefined), quote = _d[0], setQuote = _d[1];
19847
+ var _e = useState(undefined), accountId = _e[0], setAccountId = _e[1];
19848
+ var _f = useState(undefined), portalSessionToken = _f[0], setPortalSessionToken = _f[1];
19980
19849
  var token = portalSessionToken || tokenFromContexts;
19981
- var _f = useState(false), proceedingToPayment = _f[0], setProceedingToPayment = _f[1];
19982
- var _g = useState(false), purchaseSucceeded = _g[0], setPurchaseSucceeded = _g[1];
19983
- var defaultCouponAppliedRef = useRef(undefined);
19850
+ var _g = useState(false), proceedingToPayment = _g[0], setProceedingToPayment = _g[1];
19851
+ var _h = useState(false), purchaseSucceeded = _h[0], setPurchaseSucceeded = _h[1];
19984
19852
  var defaultPaymentMethod = usePaymentMethod({
19985
19853
  accountId: accountId,
19986
19854
  token: token,
@@ -19988,57 +19856,13 @@ function Signup(_a) {
19988
19856
  }).defaultPaymentMethod;
19989
19857
  var queryClient = useQueryClient();
19990
19858
  // Queries
19991
- var _h = useQuery({
19992
- queryKey: ['priceList', priceListCode],
19859
+ var priceListData = useQuery({
19860
+ queryKey: ["priceList", priceListCode],
19993
19861
  queryFn: function () { return getPriceList({ token: token, apiHost: apiHost, code: priceListCode }); },
19994
- }), priceListData = _h.data, isLoadingPriceList = _h.isLoading;
19995
- var _j = useQuery({
19996
- queryKey: ['quote', initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id],
19997
- queryFn: function () {
19998
- if (!(initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id)) {
19999
- throw new Error('Quote ID is required');
20000
- }
20001
- return getQuote({ token: token, apiHost: apiHost, id: initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id });
20002
- },
20003
- enabled: !!(initialQuote === null || initialQuote === void 0 ? void 0 : initialQuote.id),
20004
- }), data = _j.data, isLoadingQuote = _j.isLoading;
20005
- var quote = data || initialQuote;
20006
- var _k = useMutation({
20007
- mutationFn: function (couponCode) {
20008
- if (!quote) {
20009
- throw new Error('Quote is required');
20010
- }
20011
- if (!token) {
20012
- throw new Error('Token is required');
20013
- }
20014
- return quoteAddCoupon({
20015
- quoteId: quote.id,
20016
- couponCode: couponCode,
20017
- apiHost: apiHost,
20018
- token: token,
20019
- });
20020
- },
20021
- onSuccess: function () {
20022
- queryClient.refetchQueries({
20023
- queryKey: ['quote', quote === null || quote === void 0 ? void 0 : quote.id],
20024
- });
20025
- showSuccessNotification('Coupon applied');
20026
- },
20027
- onError: function (error) {
20028
- var _a, _b;
20029
- showErrorNotification((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.errors[0]) === null || _b === void 0 ? void 0 : _b.message, 'Error adding coupon');
20030
- },
20031
- }), addCoupon = _k.mutate, isAddingCoupon = _k.isPending;
20032
- // Handle default coupon application
20033
- useEffect(function () {
20034
- if (couponCode && (quote === null || quote === void 0 ? void 0 : quote.id) && defaultCouponAppliedRef.current !== couponCode) {
20035
- addCoupon(couponCode);
20036
- defaultCouponAppliedRef.current = couponCode;
20037
- }
20038
- }, [couponCode, quote === null || quote === void 0 ? void 0 : quote.id]);
19862
+ }).data;
20039
19863
  function handleSubmit(formData) {
20040
19864
  return __awaiter(this, void 0, void 0, function () {
20041
- var data_1, error_1;
19865
+ var data, error_1;
20042
19866
  return __generator(this, function (_a) {
20043
19867
  switch (_a.label) {
20044
19868
  case 0:
@@ -20057,9 +19881,9 @@ function Signup(_a) {
20057
19881
  entityId: entityId,
20058
19882
  })];
20059
19883
  case 1:
20060
- data_1 = _a.sent();
20061
- setAccountId(data_1.account.id);
20062
- setPortalSessionToken(data_1.portalSessionToken);
19884
+ data = _a.sent();
19885
+ setAccountId(data.account.id);
19886
+ setPortalSessionToken(data.portalSessionToken);
20063
19887
  // We must invalidate the accountPaymentMethodKey query in order to clear payment methods from the provided api token,
20064
19888
  // to instead use paymentMethods from portalSessionToken.
20065
19889
  queryClient.invalidateQueries({
@@ -20069,7 +19893,7 @@ function Signup(_a) {
20069
19893
  }),
20070
19894
  });
20071
19895
  setProceedingToPayment(false);
20072
- setInitialQuote(data_1.quote);
19896
+ setQuote(data.quote);
20073
19897
  return [3 /*break*/, 3];
20074
19898
  case 2:
20075
19899
  error_1 = _a.sent();
@@ -20095,16 +19919,16 @@ function Signup(_a) {
20095
19919
  switch (_a.label) {
20096
19920
  case 0:
20097
19921
  if (!portalSessionToken) {
20098
- throw new Error('Portal session token is required');
19922
+ throw new Error("Portal session token is required");
20099
19923
  }
20100
19924
  if (!accountId) {
20101
- throw new Error('Account ID is required');
19925
+ throw new Error("Account ID is required");
20102
19926
  }
20103
19927
  if (!(plugin === null || plugin === void 0 ? void 0 : plugin.id)) {
20104
- throw new Error('Plugin ID is required');
19928
+ throw new Error("Plugin ID is required");
20105
19929
  }
20106
19930
  if (!(defaultPaymentMethod === null || defaultPaymentMethod === void 0 ? void 0 : defaultPaymentMethod.id)) {
20107
- throw new Error('Payment method ID is required');
19931
+ throw new Error("Payment method ID is required");
20108
19932
  }
20109
19933
  return [4 /*yield*/, accountSignup({
20110
19934
  token: portalSessionToken,
@@ -20124,27 +19948,45 @@ function Signup(_a) {
20124
19948
  function handlePaymentFail(error) {
20125
19949
  showErrorNotification(error.response.message);
20126
19950
  }
20127
- if (purchaseSucceeded) {
20128
- return (jsx(Fragment, { children: (quote === null || quote === void 0 ? void 0 : quote.currencyId) !== undefined ? (jsx("div", __assign({ className: "bunny-w-screen bunny-flex bunny-items-start bunny-pt-[25vh]" }, { children: jsx(PaymentSuccessDisplay, { amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, className: "bunny-w-full", companyName: companyName, returnUrl: returnUrl, currencyId: quote === null || quote === void 0 ? void 0 : quote.currencyId }) }))) : (jsx("div", { children: "No currency ID found from Quote" })) }));
20129
- }
20130
- return (jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? 'bunny-flex-col' : 'bunny-flex-row', " bunny-h-screen bunny-w-screen bunny-absolute bunny-top-0 bunny-left-0 ").concat(shadow, " ").concat(className), style: style }, { children: [jsx("div", __assign({ className: "bunny-flex bunny-items-center bunny-flex-col ".concat(isMobile ? 'bunny-w-full bunny-h-1/2' : 'bunny-w-1/2 bunny-h-full', " bunny-justify-center") }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-start bunny-justify-between bunny-w-3/5 bunny-h-full bunny-gap-4 bunny-my-24" }, { children: [jsx("div", { children: topNavImageUrl.length > 0 && (jsx(Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false })) }), data ? (jsx(CheckoutSummary, { quote: data, className: "bunny-h-full bunny-w-full", onAddCoupon: addCoupon, priceListData: priceListData, isAddingCoupon: isAddingCoupon })) : (jsx("div", __assign({ className: "bunny-h-full" }, { children: isLoadingPriceList ? (jsx(Skeleton, { active: true })) : (jsx(PriceListDisplay, { priceListData: priceListData })) }))), jsx(Footer, {})] })) })), jsx("div", __assign({ className: "bunny-flex bunny-flex-col ".concat(isMobile ? 'bunny-w-full bunny-h-1/2 bunny-overflow-auto' : 'bunny-w-1/2 bunny-h-full', " bunny-items-center"), style: {
20131
- boxShadow: '-5px 0 20px 0 rgba(0, 0, 0, 0.05)',
20132
- } }, { children: isLoadingPriceList ? (jsx(Skeleton, { active: true, className: "bunny-flex bunny-flex-col bunny-w-3/5 bunny-mt-24" })) : (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-w-3/5 bunny-mt-24" }, { children: jsx(PaymentForms, { quote: isLoadingQuote ? undefined : quote, handlePaymentSuccess: handlePaymentSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId, overrideToken: portalSessionToken, customCheckoutFunction: accountSignupFunction }) }))) }))] })));
19951
+ var WrapperComponent = function (_a) {
19952
+ var children = _a.children, className = _a.className, style = _a.style;
19953
+ return isCardEnabled ? (jsx(Card, __assign({ className: className, style: style }, { children: children }))) : (jsx("div", __assign({ className: className, style: style }, { children: children })));
19954
+ };
19955
+ return (jsx(WrapperComponent, __assign({ className: "bunny-p-4 bunny-flex bunny-flex-col ".concat(shadow, " ").concat(className), style: style }, { children: purchaseSucceeded ? (jsx(Fragment, { children: (quote === null || quote === void 0 ? void 0 : quote.currencyId) !== undefined ? (jsx(PaymentSuccessDisplay, { amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, className: "bunny-w-full", companyName: companyName, returnUrl: returnUrl, currencyId: quote === null || quote === void 0 ? void 0 : quote.currencyId })) : (jsx("div", { children: "No currency ID found from Quote" })) })) : (jsxs("div", __assign({ className: "bunny-flex ".concat(isMobile ? "bunny-flex-col" : "bunny-flex-row", " bunny-h-full bunny-w-full") }, { children: [jsx("div", __assign({ className: "bunny-flex bunny-flex-col ".concat(isMobile ? "bunny-items-center" : "bunny-w-1/2 bunny-items-center") }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "".concat(isMobile ? "bunny-h-full" : "bunny-my-4") }, { children: jsx(Divider, { className: "bunny-h-full", type: isMobile ? undefined : "vertical" }) })), jsx("div", __assign({ className: "bunny-flex ".concat(isMobile
19956
+ ? "bunny-items-center bunny-justify-center bunny-my-12"
19957
+ : "bunny-w-1/2 bunny-items-center bunny-justify-center bunny-my-12") }, { children: jsx("div", __assign({ className: "".concat(isMobile ? "bunny-w-full" : "bunny-w-1/2") }, { children: jsx(PaymentForms, { quote: quote, handlePaymentSuccess: handlePaymentSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId, overrideToken: portalSessionToken, customCheckoutFunction: accountSignupFunction }) })) }))] }))) })));
20133
19958
  }
20134
- var Text$e = Typography.Text;
20135
- var CheckoutSummaryDivider = function () {
20136
- return (jsx("div", __assign({ className: "bunny-my-2" }, { children: jsx(Divider, { className: "m-0" }) })));
19959
+
19960
+ var createRequestHeaders = function (token) {
19961
+ var bearerToken = token ? "Bearer ".concat(token) : null;
19962
+ var headers = {
19963
+ "Content-type": "application/json; charset=utf-8",
19964
+ };
19965
+ if (bearerToken) {
19966
+ headers["Authorization"] = bearerToken;
19967
+ }
19968
+ return headers;
19969
+ };
19970
+ var getGraphQLBaseURL = function (apiHost) {
19971
+ return "".concat(apiHost, "/graphql");
19972
+ };
19973
+ var useGraphQLRequest = function () {
19974
+ return function (query, apiHost, token, variables) { return __awaiter(void 0, void 0, void 0, function () {
19975
+ var error_1;
19976
+ return __generator(this, function (_a) {
19977
+ switch (_a.label) {
19978
+ case 0:
19979
+ _a.trys.push([0, 2, , 3]);
19980
+ return [4 /*yield*/, request(getGraphQLBaseURL(apiHost), query, variables, createRequestHeaders(token))];
19981
+ case 1: return [2 /*return*/, _a.sent()];
19982
+ case 2:
19983
+ error_1 = _a.sent();
19984
+ throw error_1;
19985
+ case 3: return [2 /*return*/];
19986
+ }
19987
+ });
19988
+ }); };
20137
19989
  };
20138
- var showSuccessNotification = useSuccessNotification();
20139
- function CheckoutSummary(_a) {
20140
- var quote = _a.quote, className = _a.className; _a.onAddCoupon; var priceListData = _a.priceListData; _a.isAddingCoupon;
20141
- return (jsxs("div", __assign({ className: "".concat(className, " bunny-space-y-4") }, { children: [jsxs(Text$e, { children: [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] })), jsx("div", __assign({ className: "bunny-space-y-4" }, { children: quote === null || quote === void 0 ? void 0 : quote.quoteChanges.map(function (quoteChange) {
20142
- return quoteChange === null || quoteChange === void 0 ? void 0 : quoteChange.charges.map(function (charge) {
20143
- var multiplier = charge.kind === 'COUPON' ? -1 : 1;
20144
- return (jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsx("div", { children: charge.name }), jsx("div", { children: charge.quantity }), jsx("div", { children: formatCurrency(multiplier * charge.amount, charge.currencyId) })] }), charge.id));
20145
- });
20146
- }) })), jsx(CheckoutSummaryDivider, {}), jsxs("div", __assign({ className: "bunny-space-y-4" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsx("div", { children: "Subtotal" }), jsx("div", { children: formatCurrency(quote.amountDue, quote.currencyId) })] })), jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsx("div", { children: "Taxes" }), jsx("div", { children: formatCurrency(quote.taxAmount, quote.currencyId) })] }))] })), jsx(CheckoutSummaryDivider, {}), jsxs("div", __assign({ className: "bunny-flex bunny-justify-between" }, { children: [jsx("div", { children: "Total" }), jsx("div", { children: formatCurrency(quote.amountDue + quote.taxAmount, quote.currencyId) })] }))] }), false ] })));
20147
- }
20148
19990
 
20149
19991
  var useQuoteSubscriptionUpgrade = function () {
20150
19992
  var graphQLRequest = useGraphQLRequest();
@@ -20205,6 +20047,27 @@ var useQuoteDelete = function () {
20205
20047
  }); };
20206
20048
  };
20207
20049
 
20050
+ var QUOTE_QUERY = function (id) { return "\n query quote {\n quote ".concat(id ? "(id: ".concat(id, ")") : '', " {\n accountId\n amount\n amountDue\n smallUnitAmountDue\n currencyId\n formattedQuote {\n html\n }\n id\n payableId\n periodAmount\n subtotal\n taxAmount\n amountsByPeriod {\n amount\n startDate\n }\n quoteChanges {\n currencyId\n id\n charges {\n amountsByPeriod {\n amount\n startDate\n }\n amount\n billingPeriod\n currencyId\n feature {\n unitName\n }\n id\n name\n priceListCharge {\n id\n }\n priceList {\n id\n }\n quantity\n }\n priceList {\n id\n plan {\n name\n }\n product {\n name\n }\n }\n\n }\n }\n }"); };
20051
+ var getQuote = function (_a) {
20052
+ var id = _a.id, token = _a.token, apiHost = _a.apiHost;
20053
+ return __awaiter(void 0, void 0, void 0, function () {
20054
+ var response;
20055
+ return __generator(this, function (_b) {
20056
+ switch (_b.label) {
20057
+ case 0: return [4 /*yield*/, gqlRequest({
20058
+ query: QUOTE_QUERY(id),
20059
+ token: token,
20060
+ vars: {},
20061
+ apiHost: apiHost,
20062
+ })];
20063
+ case 1:
20064
+ response = _b.sent();
20065
+ return [2 /*return*/, response === null || response === void 0 ? void 0 : response.quote];
20066
+ }
20067
+ });
20068
+ });
20069
+ };
20070
+
20208
20071
  var SUBSCRIPTIONS_QUERY = "\nquery subscriptions {\n subscriptions {\n nodes {\n cancellationDate\n currencyId\n endDate\n evergreen\n id\n period\n plan { id name selfServiceBuy selfServiceCancel selfServiceRenew }\n priceList { id periodMonths }\n product { id name showProductNameOnLineItem }\n startDate\n state\n trialEndDate\n trialPeriod\n trialStartDate\n charges {\n priceListCharge {\n priceListChargeTiers {\n price\n starts\n }\n }\n amount\n billingPeriod\n chargeType\n discount\n discountedPrice\n endDate\n expired\n feature { name }\n id\n isAmendment\n isRamp\n kind\n name\n periodPrice\n price\n priceDecimals\n priceListChargeId\n priceTiers { starts price }\n pricingModel\n quantity\n selfServiceQuantity\n startDate\n trial\n }\n }\n }\n }";
20209
20072
  var getSubscriptions = function (_a) {
20210
20073
  var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, token = _a.token;
@@ -20277,7 +20140,8 @@ var getTaxationRequiredAccountFields = function (_a) {
20277
20140
  case 1:
20278
20141
  response = _d.sent();
20279
20142
  return [2 /*return*/, ((_c = (_b = response === null || response === void 0 ? void 0 : response.currentUser) === null || _b === void 0 ? void 0 : _b.taxationRequiredAccountFields) === null || _c === void 0 ? void 0 : _c.length) > 0
20280
- ? response.currentUser.taxationRequiredAccountFields
20143
+ ? response.currentUser
20144
+ .taxationRequiredAccountFields
20281
20145
  : null];
20282
20146
  }
20283
20147
  });
@@ -20293,6 +20157,35 @@ var useHasTaxPlugin = function (_a) {
20293
20157
  return Boolean(plugins === null || plugins === void 0 ? void 0 : plugins.some(function (plugin) { return plugin.type === "taxation"; }));
20294
20158
  };
20295
20159
 
20160
+ var useCurrentUserData = function () {
20161
+ var queryClient = useQueryClient();
20162
+ var token = useToken();
20163
+ var currentUser = queryClient.getQueryData(QueryKeyFactory.default.currentUserKey(token));
20164
+ if (!currentUser)
20165
+ return {};
20166
+ return currentUser;
20167
+ };
20168
+
20169
+ var BunnyFooterIcon = function (_a) {
20170
+ var color = _a.color;
20171
+ return (jsxs("svg", __assign({ width: "45", height: "15", viewBox: "0 0 39 13", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsxs("g", __assign({ clipPath: "url(#clip0_6_851)" }, { children: [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 }), 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 }), 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 }), 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 }), 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 }), 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 })] })), jsx("defs", { children: jsx("clipPath", __assign({ id: "clip0_6_851" }, { children: jsx("rect", { width: "39", height: "13", fill: "white" }) })) })] })));
20172
+ };
20173
+
20174
+ var Footer = function (_a) {
20175
+ var className = _a.className;
20176
+ var _b = useCurrentUserData(), privacyUrl = _b.privacyUrl, termsUrl = _b.termsUrl;
20177
+ var isMobile = useIsMobile();
20178
+ return (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-justify-between bunny-shrink-0 ".concat(isMobile ? 'bunny-flex-col bunny-gap-2 bunny-grow' : '', " ").concat(className) }, { children: [(termsUrl || privacyUrl) && (jsxs("div", __assign({ className: "bunny-flex bunny-items-center bunny-gap-3" }, { children: [termsUrl && (jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: termsUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Terms" }))), privacyUrl && (jsx(StyedLink, __assign({ className: "bunny-text-xs bunny-text-slate-400", href: privacyUrl, rel: "noopener noreferrer", target: "_blank", type: "text" }, { children: "Privacy" })))] }))), jsx(BunnyMarketingLink, {})] })));
20179
+ };
20180
+ var BunnyMarketingLink = function () {
20181
+ var _a = useState(false), isHovered = _a[0], setIsHovered = _a[1];
20182
+ var isMobile = useIsMobile();
20183
+ return (jsx("div", __assign({ className: "bunny-flex bunny-items-end bunny-justify-end ".concat(isMobile ? '' : 'grow') }, { children: 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: jsxs("div", __assign({ className: "bunny-flex bunny-items-center", onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); } }, { children: ["Powered by\u00A0", jsx("div", __assign({ style: { paddingTop: '5px' } }, { children: jsx(BunnyFooterIcon, { color: isHovered ? PRIMARY_COLOR : SLATE_400 }) }))] })) })) })));
20184
+ };
20185
+ var StyedLink = styled.a(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"], ["\n color: ", ";\n transition: color 0.3s;\n &:hover {\n color: ", ";\n }\n text-decoration: none;\n font-size: 14px;\n"])), SLATE_400, SLATE_500);
20186
+ var StyledBunnyLink = styled(StyedLink)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n &:hover {\n color: ", " !important;\n }\n"], ["\n &:hover {\n color: ", " !important;\n }\n"])), PRIMARY_COLOR);
20187
+ var templateObject_1$5, templateObject_2$1;
20188
+
20296
20189
  var MUTATION$1 = "\nmutation accountUpdate(\n $id: ID!,\n $attributes: AccountAttributes!) {\n accountUpdate(\n id: $id,\n attributes: $attributes\n ) {\n account {\n id\n billingCountry\n billingState\n billingStreet\n billingCity\n billingZip\n name\n }\n errors\n }\n }\n";
20297
20190
  var accountUpdate = function (_a) {
20298
20191
  var accountId = _a.accountId, attributes = _a.attributes, token = _a.token, apiHost = _a.apiHost;
@@ -20367,10 +20260,10 @@ var FormBillingState = function (_a) {
20367
20260
 
20368
20261
  var QuoteCheckout = function (_a) {
20369
20262
  var account = _a.account, onSuccess = _a.onSuccess, onFail = _a.onFail, quote = _a.quote, taxationRequiredAccountFields = _a.taxationRequiredAccountFields;
20370
- var apiHost = useContext(BunnyContext).apiHost;
20263
+ var _b = useContext(BunnyContext), apiHost = _b.apiHost; _b.graphQLClient;
20371
20264
  var token = useToken();
20372
20265
  var isMobile = useIsMobile();
20373
- var _b = useState(false), isSaving = _b[0], setIsSaving = _b[1];
20266
+ var _c = useState(false), isSaving = _c[0], setIsSaving = _c[1];
20374
20267
  var paymentRequired = getQuoteAmountDue(quote) > 0;
20375
20268
  var checkoutMutation = useMutation({
20376
20269
  mutationFn: function () { return __awaiter(void 0, void 0, void 0, function () {
@@ -20378,9 +20271,9 @@ var QuoteCheckout = function (_a) {
20378
20271
  switch (_a.label) {
20379
20272
  case 0:
20380
20273
  if (!quote)
20381
- throw new Error('Quote is required');
20274
+ throw new Error("Quote is required");
20382
20275
  if (paymentRequired)
20383
- throw new Error('Payment is required');
20276
+ throw new Error("Payment is required");
20384
20277
  return [4 /*yield*/, checkout({ quoteId: quote.id, token: token, apiHost: apiHost })];
20385
20278
  case 1: return [2 /*return*/, _a.sent()];
20386
20279
  }
@@ -20401,17 +20294,17 @@ var QuoteCheckout = function (_a) {
20401
20294
  }
20402
20295
  if (taxationRequiredAccountFields)
20403
20296
  return (jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsx(TaxationForm, { account: account, quote: quote }) })));
20404
- return (jsx(Fragment, { children: paymentRequired ? (jsx(PaymentForm, { onFail: onFail, onPaymentSuccess: onSuccess, quote: quote })) : (jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(isMobile ? 'bunny-shadow-padding-x' : '') }, { children: [jsx(Button, __assign({ onClick: handleCheckoutNoPayment, type: "primary" }, { children: isSaving ? 'Processing...' : 'Complete order' })), jsx("div", __assign({ className: "bunny-text-xs bunny-text-slate-500" }, { children: "No payment is required" }))] })) }))) }));
20297
+ return (jsx(Fragment, { children: paymentRequired ? (jsx(PaymentForm, { onFail: onFail, onPaymentSuccess: onSuccess, quote: quote })) : (jsx(PaymentFormWrapper, __assign({ setMaxHeight: false }, { children: jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-2 ".concat(isMobile ? "bunny-shadow-padding-x" : "") }, { children: [jsx(Button, __assign({ onClick: handleCheckoutNoPayment, type: "primary" }, { children: isSaving ? "Processing..." : "Complete order" })), jsx("div", __assign({ className: "bunny-text-xs bunny-text-slate-500" }, { children: "No payment is required" }))] })) }))) }));
20405
20298
  };
20406
20299
  var PaymentFormWrapper = function (_a) {
20407
20300
  var children = _a.children, setMaxHeight = _a.setMaxHeight, className = _a.className;
20408
20301
  var isMobile = useIsMobile();
20409
- return (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-6 bunny-shrink-0 ".concat(isMobile ? 'bunny-w-full bunny-shadow-padding-xb' : '', " ").concat(className), style: __assign({}, (isMobile
20302
+ return (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-gap-6 bunny-shrink-0 ".concat(isMobile ? "bunny-w-full bunny-shadow-padding-xb" : "", " ").concat(className), style: __assign({}, (isMobile
20410
20303
  ? setMaxHeight
20411
- ? { maxHeight: '60vh' }
20304
+ ? { maxHeight: "60vh" }
20412
20305
  : {}
20413
20306
  : {
20414
- width: '350px',
20307
+ width: "350px",
20415
20308
  })) }, { children: children })));
20416
20309
  };
20417
20310
 
@@ -20428,18 +20321,18 @@ var Checkout = function (_a) {
20428
20321
  var queryClient = useQueryClient();
20429
20322
  // Queries
20430
20323
  var _d = useQuery({
20431
- queryKey: ['getTaxationRequiredAccountFields', token],
20324
+ queryKey: ["getTaxationRequiredAccountFields", token],
20432
20325
  queryFn: function () { return getTaxationRequiredAccountFields({ apiHost: apiHost, token: token }); },
20433
20326
  enabled: Boolean(quote),
20434
20327
  staleTime: 0,
20435
20328
  }), taxationRequiredAccountFields = _d.data, isLoadingTaxationRequiredAccountFields = _d.isLoading;
20436
20329
  var _e = useQuery({
20437
- queryKey: ['account', quote === null || quote === void 0 ? void 0 : quote.accountId],
20330
+ queryKey: ["account", quote === null || quote === void 0 ? void 0 : quote.accountId],
20438
20331
  queryFn: function () {
20439
- return (quote === null || quote === void 0 ? void 0 : quote.accountId) &&
20440
- getAccount({ id: quote.accountId, apiHost: apiHost, token: token, componentsVersion: PACKAGE_VERSION });
20332
+ return (quote === null || quote === void 0 ? void 0 : quote.accountId) && getAccount({ id: quote.accountId, apiHost: apiHost, token: token });
20441
20333
  },
20442
- enabled: Boolean(quote === null || quote === void 0 ? void 0 : quote.accountId) && ((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
20334
+ enabled: Boolean(quote === null || quote === void 0 ? void 0 : quote.accountId) &&
20335
+ ((taxationRequiredAccountFields === null || taxationRequiredAccountFields === void 0 ? void 0 : taxationRequiredAccountFields.length) || 0) > 0,
20443
20336
  }), account = _e.data, isLoadingAccount = _e.isLoading;
20444
20337
  useQuery({
20445
20338
  queryKey: queryKeyFactory.createQuoteTaxCalculateKey({
@@ -20461,7 +20354,7 @@ var Checkout = function (_a) {
20461
20354
  updatedQuote = _a.sent();
20462
20355
  if (updatedQuote) {
20463
20356
  quoteKey = queryKeyFactory.createObjectKey({
20464
- objectName: 'editingQuote',
20357
+ objectName: "editingQuote",
20465
20358
  id: updatedQuote.id,
20466
20359
  token: token,
20467
20360
  });
@@ -20490,7 +20383,7 @@ var Checkout = function (_a) {
20490
20383
  return null;
20491
20384
  return (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: {
20492
20385
  zIndex: 1001,
20493
- } }, { children: jsxs("div", __assign({ className: pageWrapperClassName(isMobile) }, { children: [jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full" }, { children: jsx(CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-gap-6 bunny-pt-4 ".concat(isMobile ? 'bunny-flex-col' : 'bunny-shadow-padding-xb') }, { children: [((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_b = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _b === void 0 ? void 0 : _b.html)) && (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)) && (jsx(Divider, { className: "bunny-h-full", type: "vertical" })), invoice ? (jsx("div", __assign({ className: "bunny-w-full bunny-pt-12" }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: invoice }) }))) : quote ? (jsx(QuoteCheckout, { account: account, onFail: function (error) {
20386
+ } }, { children: jsxs("div", __assign({ className: pageWrapperClassName(isMobile) }, { children: [jsx("div", __assign({ className: "bunny-flex bunny-justify-end bunny-w-full" }, { children: jsx(CloseOutlined, { className: "bunny-text-base bunny-shadow-padding-xb", onClick: onCancel }) })), jsxs("div", __assign({ className: "bunny-flex bunny-justify-end bunny-gap-6 bunny-pt-4 ".concat(isMobile ? "bunny-flex-col" : "bunny-shadow-padding-xb") }, { children: [((invoice === null || invoice === void 0 ? void 0 : invoice.html) || ((_b = quote === null || quote === void 0 ? void 0 : quote.formattedQuote) === null || _b === void 0 ? void 0 : _b.html)) && (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)) && (jsx(Divider, { className: "bunny-h-full", type: "vertical" })), invoice ? (jsx("div", __assign({ className: "bunny-w-full bunny-pt-12" }, { children: jsx(PaymentForm, { onPaymentSuccess: onSuccess, onFail: onFail, invoice: invoice }) }))) : quote ? (jsx(QuoteCheckout, { account: account, onFail: function (error) {
20494
20387
  onFail(error);
20495
20388
  }, onSuccess: onSuccess, quote: quote, taxationRequiredAccountFields: taxationRequiredAccountFields, token: token })) : (jsx(PaymentForm, { onFail: function (error) {
20496
20389
  onFail(error);
@@ -20515,12 +20408,15 @@ var SubscriptionsContext = createContext({});
20515
20408
 
20516
20409
  var QUOTE_CHARGE_UPDATE = "\n mutation QuoteChargeUpdate (\n $discount: Float,\n $endDate: ISO8601Date,\n $name: String,\n $price: Float,\n $quantity: Int,\n $quoteChargeId: ID!\n $startDate: ISO8601Date\n $subtotal: Float,\n ) {\n quoteChargeUpdate(\n discount: $discount\n endDate: $endDate\n name: $name\n price: $price\n quantity: $quantity\n quoteChargeId: $quoteChargeId\n startDate: $startDate\n subtotal: $subtotal\n ) {\n quoteCharge {\n id\n }\n }\n }\n";
20517
20410
  var quoteChargeUpdate = function (_a) {
20518
- var discount = _a.discount, name = _a.name, price = _a.price, quantity = _a.quantity, quoteChargeId = _a.quoteChargeId, startDate = _a.startDate, subtotal = _a.subtotal, apiHost = _a.apiHost, token = _a.token;
20411
+ var discount = _a.discount,
20412
+ // endDate,
20413
+ name = _a.name, price = _a.price, quantity = _a.quantity, quoteChargeId = _a.quoteChargeId, startDate = _a.startDate, subtotal = _a.subtotal, apiHost = _a.apiHost, token = _a.token;
20519
20414
  return gqlRequest({
20520
20415
  query: QUOTE_CHARGE_UPDATE,
20521
20416
  vars: {
20522
20417
  subtotal: subtotal,
20523
20418
  discount: discount,
20419
+ // endDate,
20524
20420
  name: name,
20525
20421
  price: price,
20526
20422
  quantity: quantity,
@@ -20777,17 +20673,22 @@ var PlanPickerCheckoutBar = function (_a) {
20777
20673
  var quote;
20778
20674
  return __generator(this, function (_a) {
20779
20675
  switch (_a.label) {
20780
- case 0: return [4 /*yield*/, getQuote({
20781
- id: quoteIdRef.current || '',
20782
- token: token,
20783
- apiHost: apiHost,
20784
- })];
20676
+ case 0:
20677
+ if (!quoteIdRef.current) {
20678
+ throw new Error('Quote ID is required');
20679
+ }
20680
+ return [4 /*yield*/, getQuote({
20681
+ id: quoteIdRef.current,
20682
+ token: token,
20683
+ apiHost: apiHost,
20684
+ })];
20785
20685
  case 1:
20786
20686
  quote = _a.sent();
20787
20687
  return [2 /*return*/, quote];
20788
20688
  }
20789
20689
  });
20790
20690
  }); },
20691
+ enabled: Boolean(quoteIdRef.current),
20791
20692
  }).data;
20792
20693
  useEffect(function () {
20793
20694
  if (!(upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.id)) {
@@ -21015,18 +20916,18 @@ var PriceListCardButton = function (_a) {
21015
20916
  var isPriceListNonSubscribedCurrentPlan = (upgradingSubscription === null || upgradingSubscription === void 0 ? void 0 : upgradingSubscription.plan.id) === priceList.plan.id && !isPriceListCurrentSubscription;
21016
20917
  var createButtonText = function () {
21017
20918
  if (isPriceListCurrentSubscription)
21018
- return 'Current';
20919
+ return "Current";
21019
20920
  if (isSelected)
21020
- return 'Selected';
20921
+ return "Selected";
21021
20922
  if (subscriptionPlan && !isPriceListNonSubscribedCurrentPlan)
21022
- return 'Subscribed';
20923
+ return "Subscribed";
21023
20924
  if (priceList.plan.pricingStyle === PricingStyle.CONTACT_US)
21024
20925
  return priceList.plan.contactUsLabel;
21025
- return 'Select';
20926
+ return "Select";
21026
20927
  };
21027
20928
  return (jsx("div", __assign({ className: "bunny-flex bunny-flex-col bunny-grow bunny-w-full bunny-justify-end" }, { children: jsx(StyledCardButton, __assign({ className: "bunny-flex bunny-justify-center bunny-w-full" }, { children: jsx(Button, __assign({ className: "bunny-w-full", disabled: disableOnClick, style: {
21028
- maxWidth: '240px',
21029
- }, type: isSelected ? 'primary' : 'default' }, { children: createButtonText() })) })) })));
20929
+ maxWidth: "240px",
20930
+ }, type: isSelected ? "primary" : "default" }, { children: createButtonText() })) })) })));
21030
20931
  };
21031
20932
  var StyledCardButton = styled.div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n .ant-btn-primary {\n border-color: transparent !important;\n }\n .ant-btn-primary:disabled {\n background: ", ";\n color: ", ";\n }\n"], ["\n .ant-btn-primary {\n border-color: transparent !important;\n }\n .ant-btn-primary:disabled {\n background: ", ";\n color: ", ";\n }\n"])), SLATE_200, SLATE_600);
21032
20933
  var templateObject_1$3;
@@ -21057,16 +20958,16 @@ var PlanPickerGridCell = function (_a) {
21057
20958
 
21058
20959
  var PriceListCardDesktop = function (_a) {
21059
20960
  var description = _a.description, disableOnClick = _a.disableOnClick, feature = _a.feature, isPriceListCurrentSubscription = _a.isPriceListCurrentSubscription, isSelected = _a.isSelected, onClick = _a.onClick, priceList = _a.priceList, subscriptionPlan = _a.subscriptionPlan, trialRemainingDays = _a.trialRemainingDays;
21060
- return (jsx(PlanPickerGridCell, { children: 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(disableOnClick ? '' : 'cursor-pointer'), onClick: function () {
20961
+ return (jsx(PlanPickerGridCell, { children: 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 bunny-pb-4 ".concat(disableOnClick ? "" : "cursor-pointer"), onClick: function () {
21061
20962
  if (!disableOnClick) {
21062
20963
  if (priceList.plan.pricingStyle === PricingStyle.CONTACT_US) {
21063
- window.open(priceList.plan.contactUsUrl, '_blank');
20964
+ window.open(priceList.plan.contactUsUrl, "_blank");
21064
20965
  }
21065
20966
  else
21066
20967
  onClick(priceList);
21067
20968
  }
21068
20969
  }, style: {
21069
- height: '100%',
20970
+ height: "100%",
21070
20971
  } }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-3" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsx(PriceListCardDescription, { description: description })] })), jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsx(PriceListCardPrice, { priceList: priceList }), jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] }))] })), jsx(PriceListCardButton, { disableOnClick: disableOnClick, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, subscriptionPlan: subscriptionPlan })] })) }));
21071
20972
  };
21072
20973
 
@@ -21628,7 +21529,7 @@ var getFeatureUsage = function (_a) {
21628
21529
  if ((_b = response.featureUsageHistogram) === null || _b === void 0 ? void 0 : _b.data)
21629
21530
  return [2 /*return*/, response.featureUsageHistogram];
21630
21531
  else
21631
- throw new Error('No data found');
21532
+ throw new Error("No data found");
21632
21533
  }
21633
21534
  });
21634
21535
  });
@@ -22295,8 +22196,8 @@ var QuoteChangeSummarySection = function (_a) {
22295
22196
  : openCheckout, disabled: !editingQuoteData, size: isMobile ? "large" : "middle", type: "primary" }, { children: (editingQuoteData === null || editingQuoteData === void 0 ? void 0 : editingQuoteData.isTrial) ? "Activate Trial" : "Proceed to checkout" })) }))] })));
22296
22197
  };
22297
22198
 
22298
- var QUANTITY_CHANGE_HEADER_TITLE = 'Update unit quantity';
22299
- var QUANTITY_CHANGE_HEADER_DESCRIPTION = 'Adjust quantities below. The change will take effect immediately after checkout has been completed.';
22199
+ var QUANTITY_CHANGE_HEADER_TITLE = "Update unit quantity";
22200
+ var QUANTITY_CHANGE_HEADER_DESCRIPTION = "Adjust quantities below. The change will take effect immediately after checkout has been completed.";
22300
22201
  var QuantityChangeDrawerDesktop = function (_a) {
22301
22202
  var editingQuote = _a.editingQuote, editingQuoteData = _a.editingQuoteData, onClose = _a.onClose, open = _a.open, openCheckout = _a.openCheckout, setEditingQuoteData = _a.setEditingQuoteData, subscriptions = _a.subscriptions;
22302
22203
  var _b = useState(open), openLocal = _b[0], setOpenLocal = _b[1];
@@ -22318,22 +22219,22 @@ var QuantityChangeDrawerDesktop = function (_a) {
22318
22219
  return (jsxs(Drawer, __assign({ closeIcon: null, destroyOnClose: true, onClose: onClose, open: open, styles: isMobile
22319
22220
  ? {
22320
22221
  body: {
22321
- padding: '1rem',
22322
- overflow: 'hidden',
22222
+ padding: "1rem",
22223
+ overflow: "hidden",
22323
22224
  background: SLATE_50,
22324
22225
  },
22325
22226
  wrapper: {
22326
- width: '100vw',
22227
+ width: "100vw",
22327
22228
  },
22328
22229
  }
22329
22230
  : {
22330
22231
  wrapper: {
22331
- minWidth: '600px',
22232
+ minWidth: "600px",
22332
22233
  },
22333
22234
  }, title: jsx(DrawerHeader, { description: QUANTITY_CHANGE_HEADER_DESCRIPTION, onClose: onClose, title: QUANTITY_CHANGE_HEADER_TITLE, closeButtonClassName: "ant-drawer-close" }) }, { children: [jsxs("div", __assign({ className: "bunny-grid bunny-pb-4", style: {
22334
- gridTemplateColumns: '2fr 1fr 1fr',
22335
- rowGap: '0.75rem',
22336
- columnGap: '1rem',
22235
+ gridTemplateColumns: "2fr 1fr 1fr",
22236
+ rowGap: "0.75rem",
22237
+ columnGap: "1rem",
22337
22238
  } }, { children: [jsx(QuantityChangeGridTitle, { children: "ACTIVE SUBSCRIPTIONS" }), jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "CURRENT QUANTITY" })), jsx(QuantityChangeGridTitle, __assign({ right: true }, { children: "NEW QUANTITY" })), jsx(Divider, { className: "bunny-col-span-full bunny-py-2" }), subscriptions.map(function (subscription, index) {
22338
22239
  var _a;
22339
22240
  var isTrial = ((_a = subscription.state) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === SubscriptionState$2.TRIAL;
@@ -22341,7 +22242,7 @@ var QuantityChangeDrawerDesktop = function (_a) {
22341
22242
  var _a;
22342
22243
  if ((isTrial && !charge.trial) ||
22343
22244
  (!isTrial && charge.trial) ||
22344
- ((_a = charge.chargeType) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === 'USAGE')
22245
+ ((_a = charge.chargeType) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === "USAGE")
22345
22246
  return null;
22346
22247
  return (jsx(QuantityChangeGridRow, { chargeIndex: chargeIndex, editingQuote: editingQuote, setEditingQuoteData: setEditingQuoteData, subscription: subscription, subscriptionCharge: charge, subscriptionIndex: index, subscriptions: subscriptions }, chargeIndex));
22347
22248
  }) }), index));
@@ -22381,7 +22282,7 @@ var SubscriptionsNavigation = function (_a) {
22381
22282
 
22382
22283
  var Text$1 = Typography.Text;
22383
22284
  var SubscriptionsWrapper = function (_a) {
22384
- var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, _b = _a.isInPreviewMode, isInPreviewMode = _b === void 0 ? false : _b, productId = _a.productId, className = _a.className, _c = _a.styles, userStyles = _c === void 0 ? {} : _c, noSubscriptionsComponent = _a.noSubscriptionsComponent, _d = _a.hideTitle, hideTitle = _d === void 0 ? false : _d, hideExpired = _a.hideExpired, _e = _a.hideExpiredToggle, hideExpiredToggle = _e === void 0 ? false : _e;
22285
+ var handlePortalErrors = _a.handlePortalErrors, companyName = _a.companyName, _b = _a.isInPreviewMode, isInPreviewMode = _b === void 0 ? false : _b, productId = _a.productId, className = _a.className, _c = _a.styles, userStyles = _c === void 0 ? {} : _c, noSubscriptionsComponent = _a.noSubscriptionsComponent, _d = _a.hideTitle, hideTitle = _d === void 0 ? false : _d, _e = _a.hideExpiredToggle, hideExpiredToggle = _e === void 0 ? false : _e;
22385
22286
  var defaultStyles = {
22386
22287
  gap: 4,
22387
22288
  shadow: 'sm',
@@ -22402,7 +22303,6 @@ var SubscriptionsWrapper = function (_a) {
22402
22303
  subscriptionProductNameStyle: styles.subscriptionProductNameStyle,
22403
22304
  productId: productId,
22404
22305
  isInPreviewMode: isInPreviewMode,
22405
- hideExpired: hideExpired,
22406
22306
  upgradingSubscription: upgradingSubscription,
22407
22307
  setUpgradingSubscription: setUpgradingSubscription,
22408
22308
  updatingChargeQuantityId: updatingChargeQuantityId,
@@ -22418,15 +22318,14 @@ var Subscriptions = function (_a) {
22418
22318
  // Context
22419
22319
  var token = useToken();
22420
22320
  var apiHost = useContext(BunnyContext).apiHost;
22421
- var _b = useContext(SubscriptionsContext), setUpgradingSubscription = _b.setUpgradingSubscription, updatingChargeQuantityId = _b.updatingChargeQuantityId, setUpdatingChargeQuantityId = _b.setUpdatingChargeQuantityId, setSubscriptionUpgradeId = _b.setSubscriptionUpgradeId, className = _b.className, isInPreviewMode = _b.isInPreviewMode, hideExpiredOverride = _b.hideExpired;
22321
+ var _b = useContext(SubscriptionsContext), setUpgradingSubscription = _b.setUpgradingSubscription, updatingChargeQuantityId = _b.updatingChargeQuantityId, setUpdatingChargeQuantityId = _b.setUpdatingChargeQuantityId, setSubscriptionUpgradeId = _b.setSubscriptionUpgradeId, className = _b.className, isInPreviewMode = _b.isInPreviewMode;
22422
22322
  // Local state
22423
22323
  var _c = useState(), editingQuoteData = _c[0], setEditingQuoteData = _c[1];
22424
22324
  var _d = useState(false), payModalVisible = _d[0], setPayModalVisible = _d[1];
22425
- var _e = useState(true), hideExpiredState = _e[0], setHideExpiredState = _e[1];
22325
+ var _e = useState(true), hideExpired = _e[0], setHideExpired = _e[1];
22426
22326
  var _f = useState(false), quantityDrawerOpen = _f[0], setQuantityDrawerOpen = _f[1];
22427
22327
  var _g = useState(false), expiredSwitchVisible = _g[0], setExpiredSwitchVisible = _g[1];
22428
22328
  var _h = useState(false), isChangingPlan = _h[0], setIsChangingPlan = _h[1];
22429
- var hideExpired = hideExpiredOverride !== null && hideExpiredOverride !== void 0 ? hideExpiredOverride : hideExpiredState;
22430
22329
  // Hooks
22431
22330
  var queryClient = useQueryClient();
22432
22331
  var showSuccessNotification = useSuccessNotification();
@@ -22500,7 +22399,7 @@ var Subscriptions = function (_a) {
22500
22399
  });
22501
22400
  showSuccessNotification('Your plan has been updated', 'Payment successful');
22502
22401
  setPayModalVisible(false);
22503
- setHideExpiredState(true);
22402
+ setHideExpired(true);
22504
22403
  };
22505
22404
  var onCancel = function () {
22506
22405
  setPayModalVisible(false);
@@ -22530,7 +22429,7 @@ var Subscriptions = function (_a) {
22530
22429
  });
22531
22430
  useEffect(function () {
22532
22431
  if (allSubscriptionsExpired && subscriptions.length > 0)
22533
- setHideExpiredState(false);
22432
+ setHideExpired(false);
22534
22433
  }, [allSubscriptionsExpired, subscriptions]);
22535
22434
  useEffect(function () {
22536
22435
  if (hasExpiredOrCanceledSubscriptions && subscriptions.length > 0)
@@ -22541,7 +22440,7 @@ var Subscriptions = function (_a) {
22541
22440
  setIsChangingPlan(false);
22542
22441
  }, handlePortalErrors: handlePortalErrors }));
22543
22442
  }
22544
- return (jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsx(PageTitle, { title: 'Subscriptions' }) : null, jsx(PageHeaderWithActions, __assign({ title: jsx(Fragment, { children: !hideExpiredToggle && (jsxs(Text$1, __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: { minWidth: '120px' } }, { children: [hideExpired ? 'Active subscriptions' : 'All subscriptions', isMobile && expiredSwitchVisible && (jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpiredState }))] }))) }) }, { children: !isMobile && (jsx(SubscriptionsNavigation, { expiredSwitchVisible: !hideExpiredToggle && expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpiredState, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsx("div", __assign({ className: "bunny-pt-4 bunny-pb-2" }, { children: jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpiredState, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: defaultPaymentMethod })] })));
22443
+ return (jsxs("div", __assign({ className: "".concat(className) }, { children: [!hideTitle ? jsx(PageTitle, { title: 'Subscriptions' }) : null, jsx(PageHeaderWithActions, __assign({ title: jsx(Fragment, { children: !hideExpiredToggle && (jsxs(Text$1, __assign({ className: "bunny-flex bunny-items-center bunny-justify-between", style: { minWidth: '120px' } }, { children: [hideExpired ? 'Active subscriptions' : 'All subscriptions', isMobile && expiredSwitchVisible && (jsx(HideExpiredToggle, { hideExpired: hideExpired, setHideExpired: setHideExpired }))] }))) }) }, { children: !isMobile && (jsx(SubscriptionsNavigation, { expiredSwitchVisible: !hideExpiredToggle && expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions })) })), jsx(SubscriptionsListContainer, { companyName: companyName, hideExpired: hideExpired, onCancelSubscriptionClick: onCancelSubscriptionClick, onChangePlanClick: onChangePlanClick, subscriptions: subscriptions, subscriptionsAreLoading: subscriptionsAreLoading, noSubscriptionsComponent: noSubscriptionsComponent }), isMobile && (jsx("div", __assign({ className: "bunny-pt-4 bunny-pb-2" }, { children: jsx(SubscriptionsNavigation, { expiredSwitchVisible: expiredSwitchVisible, hideExpired: hideExpired, setHideExpired: setHideExpired, setQuantityDrawerOpen: setQuantityDrawerOpen, subscriptions: subscriptions }) }))), jsx(QuantityChangeDrawerDesktop, { editingQuote: quote, editingQuoteData: editingQuoteData, onClose: onClose, open: quantityDrawerOpen, openCheckout: function () { return setPayModalVisible(true); }, setEditingQuoteData: setEditingQuoteData, subscriptions: subscriptions }), jsx(Checkout, { onCancel: onCancel, onSuccess: onSuccess, onFail: onFail, open: payModalVisible, quote: quote, token: token, isMobile: isMobile, storedPaymentMethod: defaultPaymentMethod })] })));
22545
22444
  };
22546
22445
  var PageHeaderWithActions = function (_a) {
22547
22446
  var children = _a.children, title = _a.title;