@bunnyapp/components 1.0.16 → 1.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +245 -297
- package/dist/cjs/src/components/BillingDetails/BillingDetails.d.ts +2 -7
- package/dist/cjs/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +2 -3
- package/dist/cjs/src/components/PaymentForm/PaymentForm.d.ts +2 -3
- package/dist/cjs/src/components/PaymentForm/Stripe/hooks/usePay.d.ts +2 -3
- package/dist/cjs/src/components/Quote/Quote.stories.d.ts +15 -16
- package/dist/cjs/src/components/Signup/PaymentForms.d.ts +3 -4
- package/dist/cjs/src/components/Signup/Signup.d.ts +3 -1
- package/dist/cjs/src/contexts/PaymentContext.d.ts +1 -2
- package/dist/cjs/src/hooks/usePaymentMethod.d.ts +1 -1
- package/dist/esm/index.js +245 -297
- package/dist/esm/src/components/BillingDetails/BillingDetails.d.ts +2 -7
- package/dist/esm/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts +2 -3
- package/dist/esm/src/components/PaymentForm/PaymentForm.d.ts +2 -3
- package/dist/esm/src/components/PaymentForm/Stripe/hooks/usePay.d.ts +2 -3
- package/dist/esm/src/components/Quote/Quote.stories.d.ts +15 -16
- package/dist/esm/src/components/Signup/PaymentForms.d.ts +3 -4
- package/dist/esm/src/components/Signup/Signup.d.ts +3 -1
- package/dist/esm/src/contexts/PaymentContext.d.ts +1 -2
- package/dist/esm/src/hooks/usePaymentMethod.d.ts +1 -1
- package/dist/index.d.ts +6 -9
- package/package.json +1 -1
- package/dist/cjs/src/hooks/useToken.d.ts +0 -2
- package/dist/esm/src/hooks/useToken.d.ts +0 -2
package/dist/esm/index.js
CHANGED
|
@@ -4,7 +4,7 @@ import React__default, { createContext as createContext$1, useContext as useCont
|
|
|
4
4
|
import { Markup } from 'interweave';
|
|
5
5
|
import { ConfigProvider, Button as Button$1, Typography, Tag, Divider, Popconfirm, Input, Checkbox, Collapse, Modal, Form, Drawer, Card as Card$1, Select, Image, Dropdown, Skeleton } from 'antd';
|
|
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, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins,
|
|
7
|
+
import { DEFAULT_ACCENT_COLOR, DEFAULT_BRAND_COLOR, DEFAULT_SECONDARY_COLOR, DEFAULT_TOP_NAV_IMAGE_URL, gqlRequest as gqlRequest$1, QueryKeyFactory, useIsMobile, isColorTooDark, MARK_PRO, INPUT_BORDER_COLOR, SLATE_50, SLATE_400, SLATE_200, getPlugins, useErrorNotification, formatCurrency, invokePlugin, GRAY_500, GRAY_200, useSuccessNotification, BreakpointNumbers, useAllErrorFormats, getFormattedInvoice, PAYABLE_INVOICE_STATES, DOCUMENT_NAME as DOCUMENT_NAME$1, useGraphQLmutation, formatDate, FrontendTransaction, SLATE_600, WHITE, TransactionKind, Lists, getAccount as getAccount$1, DEFAULT_CONFIG, SubscriptionState as SubscriptionState$2, MODAL_MAX_HEIGHT, SLATE_500, StringUtils, DataInterval, TAG_COLORS, ChargeType } from '@bunnyapp/common';
|
|
8
8
|
import { QueryClient, QueryClientProvider, useQuery, useQueryClient, keepPreviousData, useMutation, onlineManager } from '@tanstack/react-query';
|
|
9
9
|
import theme from 'antd/lib/theme';
|
|
10
10
|
import { RecoilRoot } from 'recoil';
|
|
@@ -42,7 +42,7 @@ function styleInject(css, ref) {
|
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
var css_248z = ".ant-divider-horizontal {\n margin: 0;\n}\n.ant-tag {\n border: none;\n border-radius: 14px;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n font-weight: 500;\n white-space: nowrap;\n margin: 0;\n}\n.ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n}\n.plan-step-line {\n height: 1px;\n min-width: 128px;\n background: #717d94;\n}\n.plan-step-number {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid #717d94;\n background: white;\n width: 24px;\n height: 24px;\n color: #717d94;\n}\n.plan-step-number.active {\n border: none;\n color: white;\n background: #ff6e1c;\n}\n.hidden {\n display: none;\n}\n.cardElement {\n padding: 8px 11px;\n border: 1px solid #e5e7eb;\n background-color: white;\n font-family: Inter !important;\n}\n.tooltip {\n visibility: hidden;\n position: absolute !important;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\n}\n.show-on-hover {\n opacity: 0;\n}\n.show-on-hover-container:hover .show-on-hover {\n opacity: 1;\n}\n.pdf-only {\n display: none !important;\n}\n.notes p {\n margin: 0;\n padding: 0;\n padding-bottom: 0.25rem;\n}\n#form-element #finix-form-container .field-holder label {\n color: #717d94 !important;\n font-size: 12px !important;\n}\n#form-element #finix-form-container > *:first-child,\n#form-element #finix-form-container > *:last-child {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container > *:not(:first-child):not(:last-child) {\n margin-top: 12px !important;\n}\n#form-element #finix-form-container .field-array > * {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container .field-holder .field,\n#form-element #finix-form-container iframe {\n height: 34px !important;\n}\n#form-element #finix-form-container .field {\n margin-top: 0 !important;\n padding-top: 2px !important;\n}\n#form-element #finix-form-container .field-holder .validation {\n font-size: 11px !important;\n color: #ff4d4f !important;\n}\n.icon-path {\n transition: fill 0.3s;\n}\n.shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.shadow-padding-xb {\n padding-right: 1rem;\n padding-left: 1rem;\n padding-bottom: 0.5rem;\n}\n.content-container {\n width: 100%;\n margin: 0 auto;\n}\n@media (min-width: 1220px) {\n .content-container {\n width: 1220px !important;\n margin: 0 auto;\n }\n}\n@media (min-width: 768px) {\n .shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .shadow-padding-xb {\n padding-right: 2rem;\n padding-left: 2rem;\n padding-bottom: 0.5rem;\n }\n .sm\\:flex {\n display: flex !important;\n }\n .sm\\:hidden {\n display: none !important;\n }\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.border {\n border-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.font-light {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-medium {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-bold {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n line-height: 1.15;\n}\nbody {\n color: #232323;\n background-color: #f8fafc;\n}\nth {\n font-weight: normal;\n}\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\", monospace;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type=\"text\"],\n input[type=\"password\"],\n input[type=\"datetime\"],\n input[type=\"datetime-local\"],\n input[type=\"date\"],\n input[type=\"month\"],\n input[type=\"time\"],\n input[type=\"week\"],\n input[type=\"number\"],\n input[type=\"email\"],\n input[type=\"url\"],\n input[type=\"search\"],\n input[type=\"tel\"],\n input[type=\"color\"] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
|
|
45
|
+
var css_248z = ".ant-collapse-header {\n cursor: default !important;\n padding: 0 !important;\n}\n.ant-tag {\n border: none;\n border-radius: 14px;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n font-weight: 500;\n white-space: nowrap;\n margin: 0;\n}\n.ant-tag-blue {\n color: #3b82f6 !important;\n background: #bfdbfe !important;\n}\n.ant-tag-green {\n color: #059669 !important;\n background: #a7f3d0 !important;\n}\n.ant-tag-red {\n color: #ef4444 !important;\n background: #fecaca !important;\n}\n.ant-tag-orange {\n color: #f97316 !important;\n background: #fed7aa !important;\n}\n.ant-tag-yellow {\n color: #f59e0b !important;\n background: #fde68a !important;\n}\n.ant-tag-purple {\n color: #8b5cf6 !important;\n background: #ddd6fe !important;\n}\n.ant-tag-black {\n color: white !important;\n background: black !important;\n}\n.ant-popover {\n z-index: 1050;\n}\n.ant-popover-inner-content {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-width: 300px;\n}\n.ant-popover-message-title {\n padding: 0;\n text-align: center;\n font-size: 1rem;\n}\n.ant-popover-buttons {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ant-btn-link:disabled {\n color: #717d94 !important;\n}\n.ant-btn-link:disabled:hover {\n background-color: transparent !important;\n}\n.ant-input-affix-wrapper .ant-input-prefix {\n transition: color 0.3s;\n}\n.ant-form-item-label {\n text-transform: none !important;\n font-size: 0.75rem;\n padding-bottom: 2px !important;\n}\n.ant-form-item-label > label {\n width: 100%;\n color: #4b5563 !important;\n}\n.ant-form-item-explain-error {\n font-size: 11px;\n min-height: 11px;\n line-height: 11px;\n padding-top: 2px;\n}\n.ant-form-item {\n margin-bottom: 0;\n}\n.ant-notification {\n width: min-content;\n}\n.ant-notification-topRight {\n right: 0 !important;\n left: 0 !important;\n margin-left: auto !important;\n margin-right: auto !important;\n}\n.ant-notification-notice-wrapper {\n width: 350px !important;\n overflow: hidden !important;\n}\n.ant-notification-notice {\n padding: 16px !important;\n width: 350px !important;\n display: flex !important;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.08), 0px 1px 18px rgba(0, 0, 0, 0.08), 0px 3px 5px rgba(0, 0, 0, 0.16) !important;\n}\n.ant-notification-notice-description {\n padding: 0 14px 0 0 !important;\n color: #232323 !important;\n font-size: 14px !important;\n word-break: break-all !important;\n overflow-wrap: break-word !important;\n}\n.ant-notification-notice-success {\n background-color: #edfffa !important;\n}\n.ant-notification-notice-error {\n background-color: #fff8f4 !important;\n}\n.ant-notification-notice-error .ant-notification-notice-message {\n color: #ff6e1c !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-error .ant-notification-notice-icon {\n color: #ff6e1c;\n}\n.ant-notification-notice-success .ant-notification-notice-message {\n color: #00b76a !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji !important;\n font-weight: 500;\n}\n.ant-notification-notice-success .ant-notification-notice-icon {\n color: #00b76a !important;\n}\n.ant-notification-notice-message {\n margin-bottom: 0 !important;\n}\n.ant-notification-notice-close {\n top: 16px !important;\n right: 16px !important;\n}\n.ant-menu-submenu-popup > .ant-menu .ant-menu-item {\n display: flex !important;\n align-items: center !important;\n}\n.ant-menu-submenu::after {\n display: none !important;\n}\n.ant-drawer-title {\n font-weight: 400 !important;\n}\n.ant-drawer-header-title {\n flex-direction: row-reverse !important;\n align-items: start !important ;\n}\n.ant-drawer-close {\n margin-inline-end: 0 !important;\n}\n@media (min-width: 768px) {\n .ant-input,\n .ant-picker,\n .ant-select,\n .ant-input-affix-wrapper {\n font-size: 1rem !important;\n }\n .ant-drawer-header {\n padding-right: 1.5rem !important;\n padding-left: 1.5rem !important;\n }\n}\n:root {\n --row-background: #ffffff;\n --row-background-alternate: rgba(100, 116, 139, 0.04);\n --row-background-dark: #121212;\n --row-background-alternate-dark: #1e1e1e;\n}\n.plan-step-line {\n height: 1px;\n min-width: 128px;\n background: #717d94;\n}\n.plan-step-number {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid #717d94;\n background: white;\n width: 24px;\n height: 24px;\n color: #717d94;\n}\n.plan-step-number.active {\n border: none;\n color: white;\n background: #ff6e1c;\n}\n.hidden {\n display: none;\n}\n.cardElement {\n padding: 8px 11px;\n border: 1px solid #e5e7eb;\n background-color: white;\n font-family: Inter !important;\n}\n.tooltip {\n visibility: hidden;\n position: absolute !important;\n}\n.has-tooltip:hover .tooltip {\n visibility: visible;\n z-index: 100;\n}\n.show-on-hover {\n opacity: 0;\n}\n.show-on-hover-container:hover .show-on-hover {\n opacity: 1;\n}\n.pdf-only {\n display: none !important;\n}\n.notes p {\n margin: 0;\n padding: 0;\n padding-bottom: 0.25rem;\n}\n#form-element #finix-form-container .field-holder label {\n color: #717d94 !important;\n font-size: 12px !important;\n}\n#form-element #finix-form-container > *:first-child,\n#form-element #finix-form-container > *:last-child {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container > *:not(:first-child):not(:last-child) {\n margin-top: 12px !important;\n}\n#form-element #finix-form-container .field-array > * {\n margin-top: 0 !important;\n}\n#form-element #finix-form-container .field-holder .field,\n#form-element #finix-form-container iframe {\n height: 34px !important;\n}\n#form-element #finix-form-container .field {\n margin-top: 0 !important;\n padding-top: 2px !important;\n}\n#form-element #finix-form-container .field-holder .validation {\n font-size: 11px !important;\n color: #ff4d4f !important;\n}\n.icon-path {\n transition: fill 0.3s;\n}\n.shadow-padding-x {\n padding-right: 1rem;\n padding-left: 1rem;\n}\n.shadow-padding-xb {\n padding-right: 1rem;\n padding-left: 1rem;\n padding-bottom: 0.5rem;\n}\n.content-container {\n width: 100%;\n margin: 0 auto;\n}\n@media (min-width: 1220px) {\n .content-container {\n width: 1220px !important;\n margin: 0 auto;\n }\n}\n@media (min-width: 768px) {\n .shadow-padding-x {\n padding-right: 2rem;\n padding-left: 2rem;\n }\n .shadow-padding-xb {\n padding-right: 2rem;\n padding-left: 2rem;\n padding-bottom: 0.5rem;\n }\n .sm\\:flex {\n display: flex !important;\n }\n .sm\\:hidden {\n display: none !important;\n }\n}\n.rotate-45,\n.transform {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n}\n.shadow,\n.shadow-lg,\n.shadow-md,\n.shadow-none,\n.shadow-sm,\n.shadow-xl {\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\n.col-span-3 {\n grid-column: span 3 / span 3;\n}\n.m-0 {\n margin: 0px;\n}\n.mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n}\n.my-12 {\n margin-top: 3rem;\n margin-bottom: 3rem;\n}\n.my-2 {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mr-8 {\n margin-right: 2rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.mt-8 {\n margin-top: 2rem;\n}\n.block {\n display: block;\n}\n.flex {\n display: flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-4 {\n height: 1rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-full {\n height: 100%;\n}\n.w-1\\/2 {\n width: 50%;\n}\n.w-1\\/3 {\n width: 33.333333%;\n}\n.w-2\\/3 {\n width: 66.666667%;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.max-w-32 {\n max-width: 8rem;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.grow {\n flex-grow: 1;\n}\n.border-collapse {\n border-collapse: collapse;\n}\n.rotate-45 {\n --tw-rotate: 45deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.items-end {\n align-items: flex-end;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-6 {\n gap: 1.5rem;\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-nowrap {\n text-wrap: nowrap;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.border {\n border-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-gray-400 {\n --tw-border-opacity: 1;\n border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));\n}\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\n.border-slate-300 {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\n.border-slate-700 {\n --tw-border-opacity: 1;\n border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\n.bg-emerald-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 243 208 / var(--tw-bg-opacity, 1));\n}\n.bg-green-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));\n}\n.bg-orange-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));\n}\n.bg-red-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));\n}\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 240 138 / var(--tw-bg-opacity, 1));\n}\n.p-0 {\n padding: 0px;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.p-8 {\n padding: 2rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\n.pb-2 {\n padding-bottom: 0.5rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-6 {\n padding-bottom: 1.5rem;\n}\n.pb-8 {\n padding-bottom: 2rem;\n}\n.pl-0 {\n padding-left: 0px;\n}\n.pl-2 {\n padding-left: 0.5rem;\n}\n.pl-4 {\n padding-left: 1rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-12 {\n padding-top: 3rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.pt-5 {\n padding-top: 1.25rem;\n}\n.pt-6 {\n padding-top: 1.5rem;\n}\n.pt-8 {\n padding-top: 2rem;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-right {\n text-align: right;\n}\n.align-middle {\n vertical-align: middle;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.capitalize {\n text-transform: capitalize;\n}\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(249 115 22 / var(--tw-text-opacity, 1));\n}\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-yellow-500 {\n --tw-text-opacity: 1;\n color: rgb(234 179 8 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.font-light {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-medium {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n.font-bold {\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n}\n@media (min-width: 768px) {\n .sm\\:flex {\n display: flex;\n }\n .sm\\:hidden {\n display: none;\n }\n}\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box !important;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;\n line-height: 1.15;\n}\nbody {\n color: #232323;\n background-color: #f8fafc;\n}\nth {\n font-weight: normal;\n}\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\", monospace;\n}\n@media only screen and (max-width: 768px) {\n select,\n textarea,\n input[type=\"text\"],\n input[type=\"password\"],\n input[type=\"datetime\"],\n input[type=\"datetime-local\"],\n input[type=\"date\"],\n input[type=\"month\"],\n input[type=\"time\"],\n input[type=\"week\"],\n input[type=\"number\"],\n input[type=\"email\"],\n input[type=\"url\"],\n input[type=\"search\"],\n input[type=\"tel\"],\n input[type=\"color\"] {\n font-size: 16px !important;\n }\n}\n@keyframes App-logo-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n";
|
|
46
46
|
styleInject(css_248z);
|
|
47
47
|
|
|
48
48
|
/******************************************************************************
|
|
@@ -1681,19 +1681,6 @@ function ContextualWrapper(_a) {
|
|
|
1681
1681
|
colorSplit: darkMode ? SLATE_400 : SLATE_200,
|
|
1682
1682
|
verticalMarginInline: 0,
|
|
1683
1683
|
},
|
|
1684
|
-
Form: {
|
|
1685
|
-
itemMarginBottom: 0,
|
|
1686
|
-
verticalLabelPadding: "4px",
|
|
1687
|
-
},
|
|
1688
|
-
Input: {
|
|
1689
|
-
fontSize: 16,
|
|
1690
|
-
},
|
|
1691
|
-
Select: {
|
|
1692
|
-
fontSize: 16,
|
|
1693
|
-
},
|
|
1694
|
-
DatePicker: {
|
|
1695
|
-
fontSize: 16,
|
|
1696
|
-
},
|
|
1697
1684
|
} }, configProviderProps) }, { children: children })) })) }));
|
|
1698
1685
|
}
|
|
1699
1686
|
|
|
@@ -1761,31 +1748,20 @@ var useDownloadFile = function (id, onError) {
|
|
|
1761
1748
|
|
|
1762
1749
|
var InvoiceQuoteContext = createContext$1({});
|
|
1763
1750
|
|
|
1764
|
-
var PaymentContext = createContext$1({});
|
|
1765
|
-
|
|
1766
|
-
// Use this hook instead of getting the token from BunnyContext directly
|
|
1767
|
-
// Because we have overrideToken as an option, this token ensures the correct token is used
|
|
1768
|
-
function useToken() {
|
|
1769
|
-
var tokenFromContext = useContext$1(BunnyContext).token;
|
|
1770
|
-
var overrideToken = useContext$1(PaymentContext).overrideToken;
|
|
1771
|
-
return overrideToken || tokenFromContext;
|
|
1772
|
-
}
|
|
1773
|
-
|
|
1774
1751
|
var MarkupContainer = styled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
1775
1752
|
var InvoiceQuoteView = function (_a) {
|
|
1776
1753
|
var children = _a.children, formattedInvoice = _a.formattedInvoice, html = _a.html, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick, onDownloadError = _a.onDownloadError;
|
|
1777
1754
|
var downloadFile = useDownloadFile(formattedInvoice === null || formattedInvoice === void 0 ? void 0 : formattedInvoice.id, onDownloadError);
|
|
1778
1755
|
var secondaryColor = useContext$1(BrandContext).secondaryColor;
|
|
1779
|
-
var
|
|
1780
|
-
var
|
|
1781
|
-
var _b = useContext$1(InvoiceQuoteContext), shadow = _b.shadow, hideDownloadButton = _b.hideDownloadButton;
|
|
1756
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
1757
|
+
var _c = useContext$1(InvoiceQuoteContext), shadow = _c.shadow, hideDownloadButton = _c.hideDownloadButton;
|
|
1782
1758
|
var isMobile = useIsMobile();
|
|
1783
1759
|
var buttonsVisible = formattedInvoice && (!hideDownloadButton || onBackButtonClick);
|
|
1784
1760
|
return (jsxs("div", __assign({ className: "flex flex-col w-full grow ".concat(isMobile ? "overflow-hidden" : "") }, { children: [buttonsVisible ? (jsxs("div", __assign({ className: "flex justify-between items-center pb-4 ".concat(isMobile ? "shadow-padding-x" : ""), id: "acceptance" }, { children: [jsx("div", { children: onBackButtonClick ? (jsx(Button$1, __assign({ className: "text-xs pl-0", onClick: onBackButtonClick, style: {
|
|
1785
1761
|
color: secondaryColor,
|
|
1786
1762
|
}, type: "link" }, { children: backButtonName || "Back" }))) : null }), !hideDownloadButton ? (jsx(Button$1, __assign({ icon: jsx(DownloadOutlined$1, {}), onClick: function () {
|
|
1787
1763
|
return downloadFile(apiHost + "/api/pdf/invoice/" + formattedInvoice.id, token);
|
|
1788
|
-
} }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 grow w-full shadow-padding-xb overflow-auto" }, { children: [jsx(Markup, { content: html }), children] }))) : (jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 p-
|
|
1764
|
+
} }, { children: "Download" }))) : null] }))) : null, isMobile ? (jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 grow w-full shadow-padding-xb overflow-auto" }, { children: [jsx(Markup, { content: html }), children] }))) : (jsxs(MarkupContainer, __assign({ className: "flex flex-col gap-4 p-4 w-full bg-white ".concat(shadow ? shadow : "shadow-md", " rounded-md"), style: {
|
|
1789
1765
|
minWidth: "750px",
|
|
1790
1766
|
} }, { children: [jsx(Markup, { content: html }), children] })))] })));
|
|
1791
1767
|
};
|
|
@@ -1841,15 +1817,17 @@ function InvoicePDF(_a) {
|
|
|
1841
1817
|
}, title: "Invoice PDF", width: "100%" }));
|
|
1842
1818
|
}
|
|
1843
1819
|
|
|
1820
|
+
var PaymentContext = createContext$1({});
|
|
1821
|
+
|
|
1844
1822
|
var paymentMethodsQuery = "query paymentMethods ($filter: String, $first: Int, $sort: String) {\n paymentMethods (filter: $filter, first: $first, sort: $sort) {\n nodes {\n id\n disabled\n pluginId\n accountId\n expirationDate\n plugin {\n guid\n id\n }\n state\n metadata {\n issuer\n identifier\n kind\n description\n icon\n }\n }\n }\n}";
|
|
1845
|
-
var usePaymentMethod = function (graphQLClient) {
|
|
1823
|
+
var usePaymentMethod = function (graphQLClient, accountId) {
|
|
1846
1824
|
var result = useQuery({
|
|
1847
1825
|
queryKey: QueryKeyFactory.default.accountPaymentMethodKey,
|
|
1848
1826
|
queryFn: function () {
|
|
1849
1827
|
return graphQLClient
|
|
1850
1828
|
.request(paymentMethodsQuery, {
|
|
1851
1829
|
first: 1,
|
|
1852
|
-
filter: "disabled is false",
|
|
1830
|
+
filter: "disabled is false".concat(accountId ? " and accountId is ".concat(accountId) : ""),
|
|
1853
1831
|
})
|
|
1854
1832
|
.then(function (data) {
|
|
1855
1833
|
var _a, _b;
|
|
@@ -1910,34 +1888,6 @@ var getQuoteAmountDue = function (quote) {
|
|
|
1910
1888
|
return quote.amountDue;
|
|
1911
1889
|
};
|
|
1912
1890
|
|
|
1913
|
-
var DEFAULT_HEADERS = {
|
|
1914
|
-
"Content-type": "application/json; charset=utf-8",
|
|
1915
|
-
};
|
|
1916
|
-
// !!! Duplicated from @bunnyapp/common due to bug in signup. Uses BunnyProvider token instead of apiToken.
|
|
1917
|
-
var gqlRequest = function (_a) {
|
|
1918
|
-
var query = _a.query, _b = _a.vars, vars = _b === void 0 ? {} : _b, headers = _a.headers, token = _a.token, isInPreviewMode = _a.isInPreviewMode, apiHost = _a.apiHost;
|
|
1919
|
-
return __awaiter(void 0, void 0, void 0, function () {
|
|
1920
|
-
var graphqlEndpoint, requestHeaders, authorizationHeader, error_1;
|
|
1921
|
-
return __generator(this, function (_c) {
|
|
1922
|
-
switch (_c.label) {
|
|
1923
|
-
case 0:
|
|
1924
|
-
_c.trys.push([0, 2, , 3]);
|
|
1925
|
-
graphqlEndpoint = DEFAULT_CONFIG.graphqlEndpoint;
|
|
1926
|
-
requestHeaders = headers || DEFAULT_HEADERS;
|
|
1927
|
-
authorizationHeader = "Bearer ".concat(token);
|
|
1928
|
-
if (!requestHeaders.Authorization && !isInPreviewMode)
|
|
1929
|
-
requestHeaders.Authorization = authorizationHeader;
|
|
1930
|
-
return [4 /*yield*/, request("".concat(apiHost).concat(graphqlEndpoint), query, vars, requestHeaders)];
|
|
1931
|
-
case 1: return [2 /*return*/, _c.sent()];
|
|
1932
|
-
case 2:
|
|
1933
|
-
error_1 = _c.sent();
|
|
1934
|
-
throw error_1;
|
|
1935
|
-
case 3: return [2 /*return*/];
|
|
1936
|
-
}
|
|
1937
|
-
});
|
|
1938
|
-
});
|
|
1939
|
-
};
|
|
1940
|
-
|
|
1941
1891
|
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";
|
|
1942
1892
|
var checkout = function (_a) {
|
|
1943
1893
|
var quoteId = _a.quoteId, invoiceId = _a.invoiceId, paymentMethodId = _a.paymentMethodId, paymentMethodData = _a.paymentMethodData, token = _a.token, apiHost = _a.apiHost;
|
|
@@ -1954,7 +1904,7 @@ var checkout = function (_a) {
|
|
|
1954
1904
|
if (paymentMethodData) {
|
|
1955
1905
|
mutationVars.paymentMethodData = __assign(__assign({}, paymentMethodData), { metadata: paymentMethodData.metadata });
|
|
1956
1906
|
}
|
|
1957
|
-
return [4 /*yield*/, gqlRequest({
|
|
1907
|
+
return [4 /*yield*/, gqlRequest$1({
|
|
1958
1908
|
query: MUTATION$8,
|
|
1959
1909
|
token: token,
|
|
1960
1910
|
vars: mutationVars,
|
|
@@ -1975,12 +1925,10 @@ var checkout = function (_a) {
|
|
|
1975
1925
|
|
|
1976
1926
|
function usePay$1(_a) {
|
|
1977
1927
|
var _this = this;
|
|
1978
|
-
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod
|
|
1979
|
-
var
|
|
1980
|
-
var customCheckoutFunction = useContext$1(PaymentContext).customCheckoutFunction;
|
|
1981
|
-
var token = useToken();
|
|
1928
|
+
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod;
|
|
1929
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
1982
1930
|
var pay = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
1983
|
-
var amountDue, currencyId, response,
|
|
1931
|
+
var amountDue, currencyId, response, error_1;
|
|
1984
1932
|
return __generator(this, function (_a) {
|
|
1985
1933
|
switch (_a.label) {
|
|
1986
1934
|
case 0:
|
|
@@ -1991,30 +1939,23 @@ function usePay$1(_a) {
|
|
|
1991
1939
|
}
|
|
1992
1940
|
_a.label = 1;
|
|
1993
1941
|
case 1:
|
|
1994
|
-
_a.trys.push([1,
|
|
1995
|
-
|
|
1996
|
-
|
|
1942
|
+
_a.trys.push([1, 3, , 4]);
|
|
1943
|
+
return [4 /*yield*/, checkout({
|
|
1944
|
+
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
1945
|
+
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
1946
|
+
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
1947
|
+
token: token,
|
|
1948
|
+
apiHost: apiHost,
|
|
1949
|
+
})];
|
|
1997
1950
|
case 2:
|
|
1998
1951
|
response = _a.sent();
|
|
1999
1952
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2000
|
-
return [3 /*break*/,
|
|
2001
|
-
case 3:
|
|
2002
|
-
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
2003
|
-
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
2004
|
-
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
2005
|
-
token: token,
|
|
2006
|
-
apiHost: apiHost,
|
|
2007
|
-
})];
|
|
2008
|
-
case 4:
|
|
2009
|
-
response = _a.sent();
|
|
2010
|
-
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2011
|
-
_a.label = 5;
|
|
2012
|
-
case 5: return [3 /*break*/, 7];
|
|
2013
|
-
case 6:
|
|
1953
|
+
return [3 /*break*/, 4];
|
|
1954
|
+
case 3:
|
|
2014
1955
|
error_1 = _a.sent();
|
|
2015
1956
|
onPaymentError === null || onPaymentError === void 0 ? void 0 : onPaymentError(error_1);
|
|
2016
|
-
return [3 /*break*/,
|
|
2017
|
-
case
|
|
1957
|
+
return [3 /*break*/, 4];
|
|
1958
|
+
case 4: return [2 /*return*/];
|
|
2018
1959
|
}
|
|
2019
1960
|
});
|
|
2020
1961
|
}); };
|
|
@@ -2023,40 +1964,31 @@ function usePay$1(_a) {
|
|
|
2023
1964
|
|
|
2024
1965
|
function usePay(_a) {
|
|
2025
1966
|
var _this = this;
|
|
2026
|
-
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod
|
|
1967
|
+
var onPaymentSuccess = _a.onPaymentSuccess, onPaymentError = _a.onPaymentError, quote = _a.quote, invoice = _a.invoice, storedPaymentMethod = _a.storedPaymentMethod;
|
|
2027
1968
|
// Hooks
|
|
2028
|
-
var
|
|
2029
|
-
var customCheckoutFunction = useContext$1(PaymentContext).customCheckoutFunction;
|
|
2030
|
-
var token = useToken();
|
|
1969
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
2031
1970
|
var pay = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
2032
|
-
var response,
|
|
1971
|
+
var response, error_1;
|
|
2033
1972
|
return __generator(this, function (_a) {
|
|
2034
1973
|
switch (_a.label) {
|
|
2035
1974
|
case 0:
|
|
2036
|
-
_a.trys.push([0,
|
|
2037
|
-
|
|
2038
|
-
|
|
1975
|
+
_a.trys.push([0, 2, , 3]);
|
|
1976
|
+
return [4 /*yield*/, checkout({
|
|
1977
|
+
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
1978
|
+
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
1979
|
+
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
1980
|
+
token: token,
|
|
1981
|
+
apiHost: apiHost,
|
|
1982
|
+
})];
|
|
2039
1983
|
case 1:
|
|
2040
1984
|
response = _a.sent();
|
|
2041
1985
|
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2042
|
-
return [3 /*break*/,
|
|
2043
|
-
case 2:
|
|
2044
|
-
invoiceId: invoice === null || invoice === void 0 ? void 0 : invoice.id,
|
|
2045
|
-
quoteId: quote === null || quote === void 0 ? void 0 : quote.id,
|
|
2046
|
-
paymentMethodId: storedPaymentMethod === null || storedPaymentMethod === void 0 ? void 0 : storedPaymentMethod.id,
|
|
2047
|
-
token: token,
|
|
2048
|
-
apiHost: apiHost,
|
|
2049
|
-
})];
|
|
2050
|
-
case 3:
|
|
2051
|
-
response = _a.sent();
|
|
2052
|
-
onPaymentSuccess === null || onPaymentSuccess === void 0 ? void 0 : onPaymentSuccess(response);
|
|
2053
|
-
_a.label = 4;
|
|
2054
|
-
case 4: return [3 /*break*/, 6];
|
|
2055
|
-
case 5:
|
|
1986
|
+
return [3 /*break*/, 3];
|
|
1987
|
+
case 2:
|
|
2056
1988
|
error_1 = _a.sent();
|
|
2057
1989
|
onPaymentError === null || onPaymentError === void 0 ? void 0 : onPaymentError(error_1);
|
|
2058
|
-
return [3 /*break*/,
|
|
2059
|
-
case
|
|
1990
|
+
return [3 /*break*/, 3];
|
|
1991
|
+
case 3: return [2 /*return*/];
|
|
2060
1992
|
}
|
|
2061
1993
|
});
|
|
2062
1994
|
}); };
|
|
@@ -2081,7 +2013,6 @@ var ActualCheckoutFooter = function (_a) {
|
|
|
2081
2013
|
quote: quote,
|
|
2082
2014
|
invoice: invoice,
|
|
2083
2015
|
storedPaymentMethod: storedPaymentMethod,
|
|
2084
|
-
plugin: plugin,
|
|
2085
2016
|
}).pay;
|
|
2086
2017
|
var payStripe = usePay({
|
|
2087
2018
|
onPaymentSuccess: onPaymentSuccess,
|
|
@@ -2092,7 +2023,6 @@ var ActualCheckoutFooter = function (_a) {
|
|
|
2092
2023
|
quote: quote,
|
|
2093
2024
|
invoice: invoice,
|
|
2094
2025
|
storedPaymentMethod: storedPaymentMethod,
|
|
2095
|
-
plugin: plugin,
|
|
2096
2026
|
}).pay;
|
|
2097
2027
|
var handlePaymentSubmit = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
2098
2028
|
var _a;
|
|
@@ -2158,13 +2088,13 @@ var PlusIcon = function (_a) {
|
|
|
2158
2088
|
return (jsxs("svg", __assign({ width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsx("path", { d: "M2.9165 7.5H11.0832", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }), jsx("path", { d: "M7 3.41663V11.5833", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] })));
|
|
2159
2089
|
};
|
|
2160
2090
|
|
|
2161
|
-
var Text$
|
|
2091
|
+
var Text$f = Typography.Text;
|
|
2162
2092
|
var CreditCard = function (_a) {
|
|
2163
2093
|
var _b;
|
|
2164
2094
|
var onClickRemove = _a.onClickRemove, onClickUpdate = _a.onClickUpdate, paymentMethodData = _a.paymentMethodData, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, _d = _a.cardEnabled, cardEnabled = _d === void 0 ? true : _d;
|
|
2165
2095
|
var isMobile = useIsMobile();
|
|
2166
2096
|
var Wrapper = cardEnabled ? Card : "div";
|
|
2167
|
-
return (jsxs(Wrapper, __assign({ className: "".concat(cardEnabled ? shadow : "", " m-0") }, { children: [jsxs("div", __assign({ className: "flex items-center justify-between gap-4 p-4" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-4" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Text$
|
|
2097
|
+
return (jsxs(Wrapper, __assign({ className: "".concat(cardEnabled ? shadow : "", " m-0") }, { children: [jsxs("div", __assign({ className: "flex items-center justify-between gap-4 p-4" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-4" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Text$f, { children: (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.identifier })] })), jsx(Tag, __assign({ color: isExpired(paymentMethodData) ? "red" : "green" }, { children: isExpired(paymentMethodData) ? "Expired" : "Valid" }))] })), !isMobile && (jsx(CardActions, { onClickRemove: onClickRemove, onClickUpdate: onClickUpdate }))] })), dayjs(paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.expirationDate).isValid() && (jsxs(Fragment, { children: [jsx(Divider, {}), jsxs("div", __assign({ className: "flex flex-col p-4" }, { children: [jsx(CardAttribute, { title: "EXPIRATION", value: expirationDate(paymentMethodData) }), isMobile && (jsx(CardActions, { onClickRemove: onClickRemove, onClickUpdate: onClickUpdate }))] }))] }))] })));
|
|
2168
2098
|
};
|
|
2169
2099
|
var MiniCreditCard = function (_a) {
|
|
2170
2100
|
var _b;
|
|
@@ -2176,7 +2106,7 @@ var MiniCreditCard = function (_a) {
|
|
|
2176
2106
|
var backgroundColor = useMemo(function () {
|
|
2177
2107
|
return darkMode ? "var(--row-background-alternate)" : "bg-slate-50";
|
|
2178
2108
|
}, [darkMode]);
|
|
2179
|
-
return (jsx("div", __assign({ className: "flex flex-row justify-between items-center p-1 px-3 border-solid ".concat(backgroundColor, " ").concat(borderColor, " rounded-md border") }, { children: paymentMethodData ? (jsxs(Fragment, { children: [jsx("div", __assign({ className: "flex flex-row gap-4" }, { children: jsxs("div", __assign({ className: "flex items-center gap-4 space-between w-full" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Text$
|
|
2109
|
+
return (jsx("div", __assign({ className: "flex flex-row justify-between items-center p-1 px-3 border-solid ".concat(backgroundColor, " ").concat(borderColor, " rounded-md border") }, { children: paymentMethodData ? (jsxs(Fragment, { children: [jsx("div", __assign({ className: "flex flex-row gap-4" }, { children: jsxs("div", __assign({ className: "flex items-center gap-4 space-between w-full" }, { children: [jsx(CardImage, { paymentMethodData: paymentMethodData }), jsx(Text$f, { children: (_b = paymentMethodData === null || paymentMethodData === void 0 ? void 0 : paymentMethodData.metadata) === null || _b === void 0 ? void 0 : _b.identifier }), jsx(Tag, __assign({ color: isExpired(paymentMethodData) ? "red" : "green" }, { children: isExpired(paymentMethodData) ? "Expired" : "Valid" }))] })) })), !hideRemoveButton && (jsx(Popconfirm, __assign({ title: "Remove card?", onConfirm: onClickRemove }, { children: jsx(Button$1, __assign({ className: "font-normal p-0", type: "link" }, { children: "Remove" })) })))] })) : (jsxs("div", __assign({ className: "flex flex-row gap-2 items-center" }, { children: [jsx(CreditCardOutlined$1, {}), jsx(Text$f, __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: "No payment method selected" })), jsx(Button$1, { disabled: true, type: "link" })] }))) })));
|
|
2180
2110
|
};
|
|
2181
2111
|
var CardImage = function (_a) {
|
|
2182
2112
|
var _b, _c;
|
|
@@ -2195,7 +2125,7 @@ var CardImage = function (_a) {
|
|
|
2195
2125
|
};
|
|
2196
2126
|
var CardAttribute = function (_a) {
|
|
2197
2127
|
var title = _a.title, value = _a.value;
|
|
2198
|
-
return (jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsx("div", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: title })), jsx(Text$
|
|
2128
|
+
return (jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsx("div", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: title })), jsx(Text$f, { children: value })] })));
|
|
2199
2129
|
};
|
|
2200
2130
|
var CardActions = function (_a) {
|
|
2201
2131
|
var onClickRemove = _a.onClickRemove, onClickUpdate = _a.onClickUpdate;
|
|
@@ -2376,7 +2306,7 @@ function useSave$1(_a) {
|
|
|
2376
2306
|
return { save: save, isSaving: isSaving };
|
|
2377
2307
|
}
|
|
2378
2308
|
|
|
2379
|
-
var Text$
|
|
2309
|
+
var Text$e = Typography.Text;
|
|
2380
2310
|
var TEST_CARD = "4242424242424242";
|
|
2381
2311
|
var DemoPayForm = function (_a) {
|
|
2382
2312
|
var onFail = _a.onFail, onSavePaymentMethod = _a.onSavePaymentMethod, plugin = _a.plugin;
|
|
@@ -2437,7 +2367,7 @@ var DemoPayForm = function (_a) {
|
|
|
2437
2367
|
var onCardCvcChange = function (cvc) {
|
|
2438
2368
|
setCardDetails(__assign(__assign({}, cardDetails), { cvc: cvc }));
|
|
2439
2369
|
};
|
|
2440
|
-
return (jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxs(StyledInputs, __assign({ className: "flex flex-col gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxs("div", __assign({ className: "flex gap-2" }, { children: [jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsx(Text$
|
|
2370
|
+
return (jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxs(StyledInputs, __assign({ className: "flex flex-col gap-2", darkMode: darkMode !== null && darkMode !== void 0 ? darkMode : false }, { children: [jsx(DemoPayCardNumber, { onChange: onCardNumberChange, value: cardDetails.number }), jsxs("div", __assign({ className: "flex gap-2" }, { children: [jsx(DemoPayExpiry, { onChange: onCardExpiryChange, value: cardDetails.expiry }), jsx(DemoPayCardCvc, { onChange: onCardCvcChange, value: cardDetails.cvc })] }))] })), jsx(Text$e, __assign({ className: "text-xs" }, { children: "DemoPay is for testing only." })), jsx(SavePaymentMethodFooter, { isSaving: isSaving, onSave: onSave })] })));
|
|
2441
2371
|
};
|
|
2442
2372
|
var StyledInputs = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n .ant-input {\n background-color: ", " !important;\n }\n .ant-input:not(:focus) {\n border-color: ", " !important;\n }\n"], ["\n .ant-input {\n background-color: ", " !important;\n }\n .ant-input:not(:focus) {\n border-color: ", " !important;\n }\n"])), function (_a) {
|
|
2443
2373
|
var darkMode = _a.darkMode;
|
|
@@ -2540,8 +2470,7 @@ function useSave(_a) {
|
|
|
2540
2470
|
var _b = useState(false), isSaving = _b[0], setIsSaving = _b[1];
|
|
2541
2471
|
var elements = useElements();
|
|
2542
2472
|
var stripe = useStripe();
|
|
2543
|
-
var
|
|
2544
|
-
var token = useToken();
|
|
2473
|
+
var _c = useContext$1(BunnyContext), token = _c.token, apiHost = _c.apiHost;
|
|
2545
2474
|
var accountId = useContext$1(PaymentContext).accountId;
|
|
2546
2475
|
var save = function (_a) {
|
|
2547
2476
|
var plugin = _a.plugin;
|
|
@@ -2675,7 +2604,7 @@ var CardIcon = function () {
|
|
|
2675
2604
|
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" })] })));
|
|
2676
2605
|
};
|
|
2677
2606
|
|
|
2678
|
-
var Text$
|
|
2607
|
+
var Text$d = Typography.Text;
|
|
2679
2608
|
var PaymentMethodSelector = function (_a) {
|
|
2680
2609
|
var paymentMethodAllowedPlugins = _a.paymentMethodAllowedPlugins, onSelect = _a.onSelect, value = _a.value;
|
|
2681
2610
|
return (jsx("div", __assign({ className: "flex flex-col 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)); }) })));
|
|
@@ -2688,7 +2617,7 @@ var PaymentOption = function (_a) {
|
|
|
2688
2617
|
var isCard = name === null || name === void 0 ? void 0 : name.toLowerCase().includes("card");
|
|
2689
2618
|
return (jsxs(PaymentOptionContainer, __assign({ "$brandColor": brandColor, "$selected": selected, className: "flex justify-between items-center w-full cursor-pointer py-2 px-4 rounded border-solid ".concat(darkMode
|
|
2690
2619
|
? "var(--row-background-dark) border-gray-500"
|
|
2691
|
-
: "bg-slate-50 border-slate-200", " border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxs("div", __assign({ className: "flex gap-2 items-center" }, { children: [jsx(Checkbox, { checked: selected, className: darkMode ? "border-gray-400" : "" }), jsx(Text$
|
|
2620
|
+
: "bg-slate-50 border-slate-200", " border"), onClick: function () { return onClick(paymentPlugin); } }, { children: [jsxs("div", __assign({ className: "flex gap-2 items-center" }, { children: [jsx(Checkbox, { checked: selected, className: darkMode ? "border-gray-400" : "" }), jsx(Text$d, { children: name })] })), isAch ? (jsx(BankOutlined$1, { className: "text-slate-400" })) : isCard ? (jsx(CardIcon, {})) : (jsx(CardIcon, {}))] })));
|
|
2692
2621
|
};
|
|
2693
2622
|
var PaymentOptionContainer = styled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n transition: border 0.3s ease;\n\n ", "\n\n &:hover {\n border-color: ", ";\n }\n"], ["\n transition: border 0.3s ease;\n\n ", "\n\n &:hover {\n border-color: ", ";\n }\n"])), function (_a) {
|
|
2694
2623
|
var $brandColor = _a.$brandColor, $selected = _a.$selected;
|
|
@@ -2731,17 +2660,16 @@ function useRemovePaymentMethod(paymentPlugins, token, apiHost, accountId) {
|
|
|
2731
2660
|
|
|
2732
2661
|
var Panel = Collapse.Panel;
|
|
2733
2662
|
var PaymentForm = function (_a) {
|
|
2734
|
-
var entityId = _a.entityId, invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, overrideToken = _a.overrideToken, graphQLClient = _a.graphQLClient
|
|
2663
|
+
var entityId = _a.entityId, invoice = _a.invoice, onFail = _a.onFail, onPaymentSuccess = _a.onPaymentSuccess, quote = _a.quote, accountId = _a.accountId, onSavePaymentMethod = _a.onSavePaymentMethod, overrideToken = _a.overrideToken, graphQLClient = _a.graphQLClient;
|
|
2735
2664
|
// Local state
|
|
2736
2665
|
var _b = useState(), selectedPaymentMethod = _b[0], setSelectedPaymentMethod = _b[1];
|
|
2737
2666
|
var _c = useState(false), showPaymentMethodForm = _c[0], setShowPaymentMethodForm = _c[1];
|
|
2738
2667
|
var paying = !!(quote || invoice);
|
|
2739
2668
|
// Hooks
|
|
2740
|
-
var
|
|
2741
|
-
var
|
|
2742
|
-
var storedPaymentMethod = usePaymentMethod(graphQLClient).data;
|
|
2669
|
+
var _d = useContext$1(BunnyContext), token = _d.token, apiHost = _d.apiHost;
|
|
2670
|
+
var storedPaymentMethod = usePaymentMethod(graphQLClient, accountId).data;
|
|
2743
2671
|
var isPaymentMethodFetched = storedPaymentMethod !== undefined;
|
|
2744
|
-
var
|
|
2672
|
+
var _e = usePaymentPlugins({ entityId: entityId, apiHost: apiHost, token: overrideToken || token }), paymentMethodAllowedPlugins = _e.paymentMethodAllowedPlugins, arePluginsFetched = _e.isFetched;
|
|
2745
2673
|
var onClickRemove = useRemovePaymentMethod(paymentMethodAllowedPlugins || [], overrideToken || token, apiHost, accountId);
|
|
2746
2674
|
var queryClient = useQueryClient();
|
|
2747
2675
|
// Set default plugin
|
|
@@ -2787,10 +2715,9 @@ var PaymentForm = function (_a) {
|
|
|
2787
2715
|
accountId: accountId,
|
|
2788
2716
|
overrideToken: overrideToken,
|
|
2789
2717
|
storedPaymentMethod: storedPaymentMethod,
|
|
2790
|
-
customCheckoutFunction: customCheckoutFunction,
|
|
2791
2718
|
} }, { children: jsx(StripeWrapper, __assign({ plugin: selectedPaymentMethod, token: token, apiHost: apiHost, accountId: accountId }, { children: jsx("div", __assign({ className: "flex flex-col gap-0 w-full" }, { children: jsxs(Fragment, { children: [jsx("div", __assign({ className: "px-4" }, { children: jsx(MiniCreditCard, { onClickRemove: function () { return onClickRemove(storedPaymentMethod); }, paymentMethodData: storedPaymentMethod }) })), paying && storedPaymentMethod ? (jsx("div", __assign({ className: "px-4" }, { children: jsx(CheckoutFooter, { quote: quote, invoice: invoice, onPaymentSuccess: handlePaymentSuccess, plugin: selectedPaymentMethod }) }))) : (
|
|
2792
2719
|
//if not paying and payment method is saved, show Collapse
|
|
2793
|
-
jsx(Collapse, __assign({ bordered: false, activeKey: showPaymentMethodForm ? "1" : undefined, ghost: true, collapsible: "disabled", destroyInactivePanel: true }, { children: jsx(Panel, __assign({ header: jsx(Fragment, { children: !showPaymentMethodForm ? (jsx("div", __assign({ className: "pt-
|
|
2720
|
+
jsx(Collapse, __assign({ bordered: false, activeKey: showPaymentMethodForm ? "1" : undefined, ghost: true, collapsible: "disabled", destroyInactivePanel: true }, { children: jsx(Panel, __assign({ header: jsx(Fragment, { children: !showPaymentMethodForm ? (jsx("div", __assign({ className: "pt-4 px-4" }, { children: jsxs(Button$1, __assign({ onClick: function () {
|
|
2794
2721
|
setShowPaymentMethodForm(true);
|
|
2795
2722
|
}, type: "default", className: "w-full" }, { children: [storedPaymentMethod ? "Update" : "Add", " payment method"] })) }))) : null }), showArrow: false }, { children: jsx("div", { children: selectedPaymentMethod ? (jsxs("div", __assign({ className: "flex flex-col gap-2 mt-2" }, { children: [showPaymentMethodSelector && (jsx(PaymentMethodSelector, { onSelect: setSelectedPaymentMethod, paymentMethodAllowedPlugins: paymentMethodAllowedPlugins, value: selectedPaymentMethod })), jsx("div", __assign({ className: "flex flex-col" }, { children: jsx(PaymentMethodDetails, { onFail: onFail, onSavePaymentMethod: handleSavePaymentMethod, paymentMethod: selectedPaymentMethod }) }))] }))) : (jsx("div", { children: "No payment method selected" })) }) }), "1") })))] }) })) })) })));
|
|
2796
2723
|
};
|
|
@@ -2821,8 +2748,7 @@ function ActualInvoice() {
|
|
|
2821
2748
|
var _a = useContext$1(InvoiceQuoteContext), id = _a.id, invoiceQuoteViewComponent = _a.invoiceQuoteViewComponent, backButtonName = _a.backButtonName, onBackButtonClick = _a.onBackButtonClick,
|
|
2822
2749
|
// onPaymentSuccess,
|
|
2823
2750
|
entityId = _a.entityId, className = _a.className;
|
|
2824
|
-
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired, graphQLClient = _b.graphQLClient;
|
|
2825
|
-
var token = useToken();
|
|
2751
|
+
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, token = _b.token, onTokenExpired = _b.onTokenExpired, graphQLClient = _b.graphQLClient;
|
|
2826
2752
|
// Local state
|
|
2827
2753
|
var isMobile = useIsMobile(BreakpointNumbers.lg);
|
|
2828
2754
|
// Hooks
|
|
@@ -3026,8 +2952,7 @@ var useIsExpired = function (expiresAt) {
|
|
|
3026
2952
|
|
|
3027
2953
|
var PandadocPollingModal = function (_a) {
|
|
3028
2954
|
var isVisible = _a.isVisible, setVisible = _a.setVisible, id = _a.id;
|
|
3029
|
-
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
3030
|
-
var token = useToken();
|
|
2955
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost, onTokenExpired = _b.onTokenExpired;
|
|
3031
2956
|
var graphQLMutation = useGraphQLmutation(function () {
|
|
3032
2957
|
console.log("graphQLMutation navigateOnTokenExpired not yet implemented");
|
|
3033
2958
|
}, apiHost || "", function () {
|
|
@@ -3113,7 +3038,7 @@ var DOCUMENT_NAME;
|
|
|
3113
3038
|
DOCUMENT_NAME["QUOTE"] = "quote";
|
|
3114
3039
|
})(DOCUMENT_NAME || (DOCUMENT_NAME = {}));
|
|
3115
3040
|
|
|
3116
|
-
var Text$
|
|
3041
|
+
var Text$c = Typography.Text;
|
|
3117
3042
|
var documentName = DOCUMENT_NAME.QUOTE;
|
|
3118
3043
|
styled.div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n span {\n width: 100%;\n }\n"], ["\n span {\n width: 100%;\n }\n"])));
|
|
3119
3044
|
function Quote(_a) {
|
|
@@ -3134,8 +3059,7 @@ function ActualQuote(_a) {
|
|
|
3134
3059
|
var _b, _c;
|
|
3135
3060
|
var entityId = _a.entityId;
|
|
3136
3061
|
// Context
|
|
3137
|
-
var _d = useContext$1(BunnyContext), apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired;
|
|
3138
|
-
var token = useToken();
|
|
3062
|
+
var _d = useContext$1(BunnyContext), token = _d.token, apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired;
|
|
3139
3063
|
var entityBranding = useContext$1(BrandContext);
|
|
3140
3064
|
var _e = useContext$1(InvoiceQuoteContext), className = _e.className, id = _e.id, hideDownloadButton = _e.hideDownloadButton;
|
|
3141
3065
|
// Queries
|
|
@@ -3183,7 +3107,7 @@ function ActualQuote(_a) {
|
|
|
3183
3107
|
documentName: documentName,
|
|
3184
3108
|
}) }), jsx("meta", { property: "og:description", content: quoteMetaDescription(formattedQuote.vendorName) })] }), jsxs("div", __assign({ className: "flex flex-col gap-4 ".concat(className) }, { children: [jsxs("div", __assign({ className: "flex flex-row justify-end items-center gap-4", id: "acceptance", style: {
|
|
3185
3109
|
color: entityBranding.secondaryColor,
|
|
3186
|
-
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsx(Text$
|
|
3110
|
+
} }, { children: [isAccepted && formattedQuote.acceptedAt ? (jsx(Text$c, { children: "Quote was accepted by ".concat(formattedQuote.acceptedByName, " on ").concat(formatDate(formattedQuote.acceptedAt)) })) : null, (!isMobile || !isAccepted) && (jsxs("div", __assign({ className: isMobile
|
|
3187
3111
|
? "flex w-full justify-end gap-2"
|
|
3188
3112
|
: "flex items-center justify-end gap-2" }, { children: [!isMobile && !hideDownloadButton ? (jsx(Button$1, __assign({ icon: jsx(DownloadOutlined$1, {}), onClick: function () {
|
|
3189
3113
|
return downloadFile(apiHost + "/api/pdf/quote", token);
|
|
@@ -3278,10 +3202,10 @@ var getColor = function (state) {
|
|
|
3278
3202
|
}
|
|
3279
3203
|
};
|
|
3280
3204
|
|
|
3281
|
-
var Text$
|
|
3205
|
+
var Text$b = Typography.Text;
|
|
3282
3206
|
var TransactionDate = function (_a) {
|
|
3283
3207
|
var date = _a.date;
|
|
3284
|
-
return jsx(Text$
|
|
3208
|
+
return jsx(Text$b, __assign({ className: "text-sm" }, { children: formatDate(date) }));
|
|
3285
3209
|
};
|
|
3286
3210
|
|
|
3287
3211
|
// TODO: delete
|
|
@@ -3315,10 +3239,10 @@ var TransactionGridCell = styled.div.withConfig({
|
|
|
3315
3239
|
})(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n ", "\n\n display: flex;\n align-items: center;\n justify-content: ", ";\n\n text-align: ", ";\n white-space: nowrap;\n font-size: 14px;\n color: ", ";\n\n background-color: inherit;\n\n padding: 1rem;\n min-width: 48px;\n"], ["\n ", "\n\n display: flex;\n align-items: center;\n justify-content: ", ";\n\n text-align: ", ";\n white-space: nowrap;\n font-size: 14px;\n color: ", ";\n\n background-color: inherit;\n\n padding: 1rem;\n min-width: 48px;\n"])), function (props) { return props.gridColumn && "grid-column: ".concat(props.gridColumn, ";"); }, function (props) { return (props.right ? "flex-end" : "flex-start"); }, function (props) { return (props.right ? "right" : "left"); }, SLATE_600);
|
|
3316
3240
|
var templateObject_1$3;
|
|
3317
3241
|
|
|
3318
|
-
var Text$
|
|
3242
|
+
var Text$a = Typography.Text;
|
|
3319
3243
|
var TransactionsEmptyState = function () {
|
|
3320
3244
|
var noTransactionsMessage = useContext$1(TransactionsListContext).noTransactionsMessage;
|
|
3321
|
-
return (jsx(Text$
|
|
3245
|
+
return (jsx(Text$a, __assign({ className: "flex justify-center p-4 text-base" }, { children: noTransactionsMessage || "There are no transactions" })));
|
|
3322
3246
|
};
|
|
3323
3247
|
|
|
3324
3248
|
var isInvoice = function (transaction) {
|
|
@@ -3335,12 +3259,11 @@ var TransactionRowTitle = function (_a) {
|
|
|
3335
3259
|
return (jsx("span", __assign({ className: "text-slate-400", style: { fontSize: "11px" } }, { children: transaction.transactionable.number })));
|
|
3336
3260
|
};
|
|
3337
3261
|
|
|
3338
|
-
var Text$
|
|
3262
|
+
var Text$9 = Typography.Text;
|
|
3339
3263
|
var TransactionsListDesktop = function (_a) {
|
|
3340
3264
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
3341
3265
|
var columns = useContext$1(TransactionsListContext).columns;
|
|
3342
|
-
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3343
|
-
var token = useToken();
|
|
3266
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3344
3267
|
var showAmount = columns.includes("amount");
|
|
3345
3268
|
var showDateAndTitle = columns.includes("date-and-title");
|
|
3346
3269
|
var showDownload = columns.includes("download");
|
|
@@ -3356,16 +3279,15 @@ var TransactionsListDesktop = function (_a) {
|
|
|
3356
3279
|
backgroundColor: index % 2 === 0
|
|
3357
3280
|
? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
|
|
3358
3281
|
: "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
|
|
3359
|
-
} }, { children: [!showDateAndTitle && !showState && !showAmount && !showDownload && (jsx(TransactionGridCell, { children: jsx(Text$
|
|
3282
|
+
} }, { children: [!showDateAndTitle && !showState && !showAmount && !showDownload && (jsx(TransactionGridCell, { children: jsx(Text$9, { children: "No columns selected" }) })), showDateAndTitle && (jsxs(Fragment, { children: [jsx(TransactionGridCell, __assign({ right: false }, { children: jsx(TransactionDate, { date: transaction.createdAt }) })), jsxs(TransactionGridCell, __assign({ right: false, className: "flex items-center gap-2" }, { children: [jsx(Text$9, { children: capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] }))] })), 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$9, { children: formatCurrency(((_a = transaction === null || transaction === void 0 ? void 0 : transaction.transactionable) === null || _a === void 0 ? void 0 : _a.amount) || transaction.amount, transaction.currencyId) }) })))] }), index));
|
|
3360
3283
|
});
|
|
3361
3284
|
};
|
|
3362
3285
|
|
|
3363
|
-
var Text$
|
|
3286
|
+
var Text$8 = Typography.Text;
|
|
3364
3287
|
var TransactionsListMobile = function (_a) {
|
|
3365
3288
|
var transactions = _a.transactions, onTransactionClick = _a.onTransactionClick;
|
|
3366
3289
|
var columns = useContext$1(TransactionsListContext).columns;
|
|
3367
|
-
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3368
|
-
var token = useToken();
|
|
3290
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost, darkMode = _b.darkMode;
|
|
3369
3291
|
var showAmount = columns.includes("amount");
|
|
3370
3292
|
var showDateAndTitle = columns.includes("date-and-title");
|
|
3371
3293
|
var showDownload = columns.includes("download");
|
|
@@ -3380,11 +3302,11 @@ var TransactionsListMobile = function (_a) {
|
|
|
3380
3302
|
backgroundColor: index % 2 === 0
|
|
3381
3303
|
? "var(--row-background".concat(darkMode ? "-dark" : "", ")")
|
|
3382
3304
|
: "var(--row-background-alternate".concat(darkMode ? "-dark" : "", ")"),
|
|
3383
|
-
} }, { children: [jsx(TransactionGridCell, { children: jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsxs(Fragment, { children: [jsx(Text$
|
|
3305
|
+
} }, { children: [jsx(TransactionGridCell, { children: jsxs("div", __assign({ className: "flex flex-col gap-2" }, { children: [jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsxs(Fragment, { children: [jsx(Text$8, { children: capitalize(transaction.kind.toLowerCase()) }), jsx(TransactionRowTitle, { transaction: transaction })] })), showState && jsx(StateTag, { state: transaction.state })] })), jsxs("div", __assign({ className: "flex items-center gap-2" }, { children: [showDateAndTitle && (jsx(TransactionDate, { date: transaction.createdAt })), showAmount && showDateAndTitle && jsx(Text$8, { children: "\u00B7" }), showAmount && (jsx(Text$8, { children: formatCurrency(transaction.transactionable.amount || transaction.amount, transaction.currencyId) }))] }))] })) }), showDownload && (jsx(TransactionGridCell, __assign({ right: true }, { children: jsx(TransactionDownload, { transaction: transaction, token: token, apiHost: apiHost }) })))] }), index));
|
|
3384
3306
|
});
|
|
3385
3307
|
};
|
|
3386
3308
|
|
|
3387
|
-
var Text$
|
|
3309
|
+
var Text$7 = Typography.Text;
|
|
3388
3310
|
var DISPLAY_WIDTH = 1200;
|
|
3389
3311
|
function Transactions(_a) {
|
|
3390
3312
|
var transactionComponent = _a.transactionComponent, _b = _a.showSearchBar, showSearchBar = _b === void 0 ? true : _b, _c = _a.showTitle, showTitle = _c === void 0 ? true : _c, _d = _a.title, title = _d === void 0 ? "Past transactions" : _d, _e = _a.columns, columns = _e === void 0 ? ["date-and-title", "state", "amount", "download"] : _e, className = _a.className, _f = _a.shadow, shadow = _f === void 0 ? "shadow-md" : _f, searchBarClassName = _a.searchBarClassName, _g = _a.useModal, useModal = _g === void 0 ? false : _g, onTransactionClick = _a.onTransactionClick, _h = _a.suppressTransactionDisplay, suppressTransactionDisplay = _h === void 0 ? false : _h, _j = _a.kindsToShow, kindsToShow = _j === void 0 ? [
|
|
@@ -3415,10 +3337,9 @@ function Transactions(_a) {
|
|
|
3415
3337
|
filterTransactions: filterTransactions,
|
|
3416
3338
|
sortTransactions: sortTransactions,
|
|
3417
3339
|
};
|
|
3418
|
-
var
|
|
3419
|
-
var token = useToken();
|
|
3340
|
+
var _l = useContext$1(BunnyContext), token = _l.token, apiHost = _l.apiHost;
|
|
3420
3341
|
// Local state
|
|
3421
|
-
var
|
|
3342
|
+
var _m = useState(""), search = _m[0], setSearch = _m[1];
|
|
3422
3343
|
var filterValue = filter ||
|
|
3423
3344
|
(search ? "filter: \"transaction.transactionableId is ".concat(search, "\"") : "");
|
|
3424
3345
|
// Queries
|
|
@@ -3493,7 +3414,7 @@ function TransactionsDisplay(_a) {
|
|
|
3493
3414
|
onTransactionDisplayClose === null || onTransactionDisplayClose === void 0 ? void 0 : onTransactionDisplayClose(selectedTransaction);
|
|
3494
3415
|
setDrawerOpen(false);
|
|
3495
3416
|
}
|
|
3496
|
-
return (jsxs("div", __assign({ style: style }, { children: [jsxs("div", __assign({ className: "flex flex-col w-full shadow-padding-xb gap-2 ".concat(isMobile ? "overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col gap-1" : "flex-row items-center", " justify-between") }, { children: [showTitle ? (jsx(Text$
|
|
3417
|
+
return (jsxs("div", __assign({ style: style }, { children: [jsxs("div", __assign({ className: "flex flex-col w-full shadow-padding-xb gap-2 ".concat(isMobile ? "overflow-hidden" : "", " ").concat(className) }, { children: [showTitle || showSearchBar ? (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col gap-1" : "flex-row items-center", " justify-between") }, { children: [showTitle ? (jsx(Text$7, __assign({ className: "shrink-0 font-medium", style: { color: darkMode ? undefined : secondaryColor } }, { children: title }))) : (jsx("div", {}) // Empty div so justify-between works
|
|
3497
3418
|
), showSearchBar && (jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "") }, { children: jsx(Input, { className: searchBarClassName
|
|
3498
3419
|
? searchBarClassName
|
|
3499
3420
|
: "border border-slate-200", onChange: function (e) {
|
|
@@ -3512,7 +3433,7 @@ function TransactionsDisplay(_a) {
|
|
|
3512
3433
|
}) })) : (jsx(Fragment, { children: TransactionsListDesktop({
|
|
3513
3434
|
transactions: updatedTransactions,
|
|
3514
3435
|
onTransactionClick: handleTransactionClick,
|
|
3515
|
-
}) })) }))] })), useModal ? (jsx(Modal, __assign({ title:
|
|
3436
|
+
}) })) }))] })), useModal ? (jsx(Modal, __assign({ title: "Basic Modal", open: drawerOpen, onOk: handleDisplayClose, onCancel: handleDisplayClose, width: DISPLAY_WIDTH, footer: null }, { children: jsx(Invoice, { id: (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.transactionableId) || "", entityId: entityId }) }))) : (jsx(Drawer, __assign({ title: drawerTitle(), onClose: handleDisplayClose, open: drawerOpen, width: DISPLAY_WIDTH }, { children: transactionComponent ? (transactionComponent) : (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind) === "INVOICE" ? (jsx(Invoice, { id: selectedTransaction.transactionableId, entityId: entityId })) : (jsxs(Card$1, __assign({ className: "shadow-md" }, { children: [jsx(Typography.Title, __assign({ level: 2, className: "mb-4" }, { children: "Transaction Details" })), jsxs(Typography.Paragraph, { children: [jsx("strong", { children: "Amount:" }), " ", jsx(Typography.Text, { children: formatCurrency((selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.amount) || 0, (selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.currencyId) || "USD") })] }), jsxs(Typography.Paragraph, { children: [jsx("strong", { children: "Description:" }), " ", jsx(Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.description })] }), jsxs(Typography.Paragraph, { children: [jsx("strong", { children: "Kind:" }), " ", jsx(Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.kind })] }), jsxs(Typography.Paragraph, { children: [jsx("strong", { children: "State:" }), " ", jsx(Typography.Text, { children: selectedTransaction === null || selectedTransaction === void 0 ? void 0 : selectedTransaction.state })] })] }))) })))] })));
|
|
3516
3437
|
}
|
|
3517
3438
|
|
|
3518
3439
|
function Quotes(_a) {
|
|
@@ -3578,11 +3499,10 @@ function Quotes(_a) {
|
|
|
3578
3499
|
return (jsx(TransactionsListContext.Provider, __assign({ value: contextValues }, { children: jsx(QuotesWrapper, {}) })));
|
|
3579
3500
|
}
|
|
3580
3501
|
function QuotesWrapper() {
|
|
3581
|
-
var
|
|
3582
|
-
var token = useToken();
|
|
3502
|
+
var _a = useContext$1(BunnyContext), token = _a.token, apiHost = _a.apiHost;
|
|
3583
3503
|
var filterFromContext = useContext$1(TransactionsListContext).filter;
|
|
3584
3504
|
// Local state
|
|
3585
|
-
var
|
|
3505
|
+
var _b = useState(""), search = _b[0], setSearch = _b[1];
|
|
3586
3506
|
var filter = filterFromContext || (search ? "filter: \"quote.id is ".concat(search, "\"") : "");
|
|
3587
3507
|
// Queries
|
|
3588
3508
|
var data = useQuery({
|
|
@@ -3610,16 +3530,14 @@ function QuotesWrapper() {
|
|
|
3610
3530
|
return (jsx(TransactionsDisplay, { transactions: quotesAsTransactions, onSearchValueChanged: setSearch, search: search }));
|
|
3611
3531
|
}
|
|
3612
3532
|
|
|
3613
|
-
var Text$7 = Typography.Text;
|
|
3614
3533
|
var DrawerHeader = function (_a) {
|
|
3615
3534
|
var description = _a.description, onClose = _a.onClose, title = _a.title;
|
|
3616
|
-
return (jsxs("div", __assign({ className: "flex flex-col gap-4" }, { children: [jsxs("div", __assign({ className: "flex items-center justify-between gap-2" }, { children: [jsx(
|
|
3535
|
+
return (jsxs("div", __assign({ className: "flex flex-col gap-4" }, { children: [jsxs("div", __assign({ className: "flex items-center justify-between gap-2" }, { children: [jsx("div", __assign({ className: "text-xl" }, { children: title })), jsx("button", __assign({ onClick: onClose, className: "ant-drawer-close" }, { children: jsx(CloseOutlined$1, {}) }))] })), description && jsx("div", __assign({ className: "text-xs" }, { children: description }))] })));
|
|
3617
3536
|
};
|
|
3618
3537
|
|
|
3619
3538
|
var PaymentMethod = function (_a) {
|
|
3620
3539
|
var entityId = _a.entityId, className = _a.className, _b = _a.shadow, shadow = _b === void 0 ? "shadow-md" : _b, _c = _a.cardEnabled, cardEnabled = _c === void 0 ? true : _c;
|
|
3621
|
-
var _d = useContext$1(BunnyContext), apiHost = _d.apiHost, graphQLClient = _d.graphQLClient, onTokenExpired = _d.onTokenExpired;
|
|
3622
|
-
var token = useToken();
|
|
3540
|
+
var _d = useContext$1(BunnyContext), token = _d.token, apiHost = _d.apiHost, graphQLClient = _d.graphQLClient, onTokenExpired = _d.onTokenExpired;
|
|
3623
3541
|
// Hooks
|
|
3624
3542
|
var queryClient = useQueryClient();
|
|
3625
3543
|
var paymentPlugins = usePaymentPlugins({ entityId: entityId, apiHost: apiHost, token: token }).paymentPlugins;
|
|
@@ -3751,11 +3669,10 @@ var TaxationForm = function (_a) {
|
|
|
3751
3669
|
var account = _a.account, quote = _a.quote;
|
|
3752
3670
|
// Hooks
|
|
3753
3671
|
var queryClient = useQueryClient();
|
|
3754
|
-
var
|
|
3755
|
-
var token = useToken();
|
|
3672
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
3756
3673
|
var form = Form.useForm()[0];
|
|
3757
3674
|
// Mutations
|
|
3758
|
-
var
|
|
3675
|
+
var _c = useMutation({
|
|
3759
3676
|
mutationFn: function (changedFormData) { return __awaiter(void 0, void 0, void 0, function () {
|
|
3760
3677
|
var account;
|
|
3761
3678
|
return __generator(this, function (_a) {
|
|
@@ -3777,7 +3694,7 @@ var TaxationForm = function (_a) {
|
|
|
3777
3694
|
queryKey: ["getTaxationRequiredAccountFields", token],
|
|
3778
3695
|
});
|
|
3779
3696
|
},
|
|
3780
|
-
}), updateAccount =
|
|
3697
|
+
}), updateAccount = _c.mutate, isUpdatingAccount = _c.isPending;
|
|
3781
3698
|
return (jsxs(Form, __assign({ className: "flex flex-col gap-4", form: form, initialValues: account, layout: "vertical", onFinish: updateAccount }, { children: [jsx(Form.Item, __assign({ label: "Billing street", name: "billingStreet" }, { children: jsx(Input, { placeholder: "Street" }) })), jsx(Form.Item, __assign({ label: "Billing city", name: "billingCity" }, { children: jsx(Input, { placeholder: "City" }) })), jsx(FormBillingState, { form: form }), jsx(Form.Item, __assign({ label: "Billing country", name: "billingCountry", rules: [{ required: true }] }, { children: jsx(Select, { options: Lists.COUNTRY_LIST, placeholder: "Select a country", showSearch: true, filterOption: function (input, option) {
|
|
3782
3699
|
var _a, _b;
|
|
3783
3700
|
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : "").toLowerCase().includes(input.toLowerCase()) ||
|
|
@@ -3793,8 +3710,7 @@ var FormBillingState = function (_a) {
|
|
|
3793
3710
|
|
|
3794
3711
|
var QuoteCheckout = function (_a) {
|
|
3795
3712
|
var account = _a.account, onSuccess = _a.onSuccess, onFail = _a.onFail, quote = _a.quote, taxationRequiredAccountFields = _a.taxationRequiredAccountFields, entityId = _a.entityId;
|
|
3796
|
-
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, graphQLClient = _b.graphQLClient;
|
|
3797
|
-
var token = useToken();
|
|
3713
|
+
var _b = useContext$1(BunnyContext), apiHost = _b.apiHost, token = _b.token, graphQLClient = _b.graphQLClient;
|
|
3798
3714
|
var isMobile = useIsMobile();
|
|
3799
3715
|
var _c = useState(false), isSaving = _c[0], setIsSaving = _c[1];
|
|
3800
3716
|
var paymentRequired = getQuoteAmountDue(quote) > 0;
|
|
@@ -3911,6 +3827,37 @@ var Checkout = function (_a) {
|
|
|
3911
3827
|
}, onPaymentSuccess: onSuccess, graphQLClient: graphQLClient }))] }))] })) })));
|
|
3912
3828
|
};
|
|
3913
3829
|
|
|
3830
|
+
var DEFAULT_HEADERS = {
|
|
3831
|
+
"Content-type": "application/json; charset=utf-8",
|
|
3832
|
+
};
|
|
3833
|
+
// !!! Duplicated from @bunnyapp/common due to bug in signup. Uses BunnyProvider token instead of apiToken.
|
|
3834
|
+
var gqlRequest = function (_a) {
|
|
3835
|
+
var query = _a.query, _b = _a.vars, vars = _b === void 0 ? {} : _b, headers = _a.headers, token = _a.token, isInPreviewMode = _a.isInPreviewMode, apiHost = _a.apiHost;
|
|
3836
|
+
return __awaiter(void 0, void 0, void 0, function () {
|
|
3837
|
+
var graphqlEndpoint, requestHeaders, authorizationHeader, error_1;
|
|
3838
|
+
return __generator(this, function (_c) {
|
|
3839
|
+
switch (_c.label) {
|
|
3840
|
+
case 0:
|
|
3841
|
+
console.log("token in gqlRequest", token);
|
|
3842
|
+
_c.label = 1;
|
|
3843
|
+
case 1:
|
|
3844
|
+
_c.trys.push([1, 3, , 4]);
|
|
3845
|
+
graphqlEndpoint = DEFAULT_CONFIG.graphqlEndpoint;
|
|
3846
|
+
requestHeaders = headers || DEFAULT_HEADERS;
|
|
3847
|
+
authorizationHeader = "Bearer ".concat(token);
|
|
3848
|
+
if (!requestHeaders.Authorization && !isInPreviewMode)
|
|
3849
|
+
requestHeaders.Authorization = authorizationHeader;
|
|
3850
|
+
return [4 /*yield*/, request("".concat(apiHost).concat(graphqlEndpoint), query, vars, requestHeaders)];
|
|
3851
|
+
case 2: return [2 /*return*/, _c.sent()];
|
|
3852
|
+
case 3:
|
|
3853
|
+
error_1 = _c.sent();
|
|
3854
|
+
throw error_1;
|
|
3855
|
+
case 4: return [2 /*return*/];
|
|
3856
|
+
}
|
|
3857
|
+
});
|
|
3858
|
+
});
|
|
3859
|
+
};
|
|
3860
|
+
|
|
3914
3861
|
var MUTATION$4 = function () { return "\nmutation AccountSignup (\n $entityId: ID!,\n $pluginId: String!,\n $paymentMethodId: String,\n $priceListCode: String!,\n $accountId: ID!,\n $quoteId: ID!\n) {\n accountSignup(\n entityId: $entityId,\n pluginId: $pluginId,\n paymentMethodId: $paymentMethodId,\n priceListCode: $priceListCode,\n accountId: $accountId,\n quoteId: $quoteId\n ) {\n errors\n quote {\n acceptedByName\n acceptedByTitle\n accountId\n amount\n amountDue\n applicationDate\n applied\n backdatedPeriods\n backdatedQuote\n billingDay\n contactId\n createdAt\n credits\n currencyId\n dealId\n discount\n discountValue\n endDate\n evergreen\n expiresAt\n id\n invoiceImmediately\n invoiceImmediatelyAvailable\n invoiceUntil\n isPendingApprovalRequest\n kind\n message\n name\n netPaymentDays\n notes\n number\n ownerId\n payableId\n periodAmount\n poNumber\n requiresApproval\n smallUnitAmountDue\n splitInvoice\n startDate\n state\n subtotal\n taxAmount\n taxCode\n updatedAt\n uuid\n }\n }\n}"; };
|
|
3915
3862
|
var accountSignup = function (_a) {
|
|
3916
3863
|
var token = _a.token, apiHost = _a.apiHost, entityId = _a.entityId, accountId = _a.accountId, quoteId = _a.quoteId, paymentToken = _a.paymentToken, paymentMethodId = _a.paymentMethodId, pluginId = _a.pluginId, priceListCode = _a.priceListCode;
|
|
@@ -3954,12 +3901,14 @@ var portalSessionCreate = function (_a) {
|
|
|
3954
3901
|
var _b;
|
|
3955
3902
|
return __generator(this, function (_c) {
|
|
3956
3903
|
switch (_c.label) {
|
|
3957
|
-
case 0:
|
|
3958
|
-
|
|
3959
|
-
|
|
3960
|
-
|
|
3961
|
-
|
|
3962
|
-
|
|
3904
|
+
case 0:
|
|
3905
|
+
console.log("token in portalSessionCreate", token);
|
|
3906
|
+
return [4 /*yield*/, gqlRequest({
|
|
3907
|
+
query: MUTATION$3,
|
|
3908
|
+
token: token,
|
|
3909
|
+
vars: { tenantCode: tenantCode, expiry: expiry, returnUrl: returnUrl },
|
|
3910
|
+
apiHost: apiHost,
|
|
3911
|
+
})];
|
|
3963
3912
|
case 1:
|
|
3964
3913
|
response = _c.sent();
|
|
3965
3914
|
errors = (response === null || response === void 0 ? void 0 : response.portalSessionCreate).errors;
|
|
@@ -4025,24 +3974,41 @@ var getPriceList = function (_a) {
|
|
|
4025
3974
|
};
|
|
4026
3975
|
|
|
4027
3976
|
function PaymentForms(_a) {
|
|
4028
|
-
var quote = _a.quote,
|
|
3977
|
+
var quote = _a.quote, handlePaymentSaveSuccess = _a.handlePaymentSaveSuccess, handlePaymentFail = _a.handlePaymentFail, handleSubmit = _a.handleSubmit, proceedingToPayment = _a.proceedingToPayment, entityId = _a.entityId, accountId = _a.accountId, overrideToken = _a.overrideToken;
|
|
4029
3978
|
var apiHost = useContext$1(BunnyContext).apiHost;
|
|
4030
|
-
return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: overrideToken ? (jsx(PaymentForm, { entityId: entityId, onFail: handlePaymentFail, onPaymentSuccess:
|
|
3979
|
+
return (jsx(Fragment, { children: quote ? (jsx(Fragment, { children: overrideToken ? (jsx(PaymentForm, { entityId: entityId, onFail: handlePaymentFail, onPaymentSuccess: handlePaymentSaveSuccess, accountId: accountId, quote: quote, overrideToken: overrideToken, graphQLClient: createGraphQLClient(overrideToken, apiHost) })) : null })) : (jsx(InitialSignupForm, { onSubmit: handleSubmit, submitting: proceedingToPayment })) }));
|
|
4031
3980
|
}
|
|
4032
3981
|
function InitialSignupForm(_a) {
|
|
4033
3982
|
var onSubmit = _a.onSubmit, submitting = _a.submitting;
|
|
4034
|
-
var
|
|
4035
|
-
|
|
4036
|
-
|
|
4037
|
-
|
|
4038
|
-
|
|
4039
|
-
}
|
|
4040
|
-
|
|
3983
|
+
var _b = useState({
|
|
3984
|
+
firstName: "",
|
|
3985
|
+
lastName: "",
|
|
3986
|
+
email: "",
|
|
3987
|
+
accountName: "",
|
|
3988
|
+
}), formData = _b[0], setFormData = _b[1];
|
|
3989
|
+
var handleInputChange = function (e) {
|
|
3990
|
+
var _a;
|
|
3991
|
+
var _b = e.target, name = _b.name, value = _b.value;
|
|
3992
|
+
setFormData(__assign(__assign({}, formData), (_a = {}, _a[name] = value, _a)));
|
|
3993
|
+
};
|
|
3994
|
+
return (jsxs(Form, __assign({ className: "flex flex-col justify-between h-full w-full", onFinish: function () { return onSubmit(formData); } }, { children: [jsxs("div", __assign({ className: "flex flex-col space-y-2" }, { children: [jsx(Form.Item, __assign({ rules: [{ required: true, message: "Please input your first name!" }], initialValue: formData.firstName }, { children: jsx(Input, { placeholder: "First name", value: formData.firstName, onChange: function (e) {
|
|
3995
|
+
handleInputChange(e);
|
|
3996
|
+
setFormData(__assign(__assign({}, formData), { firstName: e.target.value }));
|
|
3997
|
+
} }) })), jsx(Form.Item, __assign({ rules: [{ required: true, message: "Please input your last name!" }], initialValue: formData.lastName }, { children: jsx(Input, { placeholder: "Last name", value: formData.lastName, onChange: function (e) {
|
|
3998
|
+
handleInputChange(e);
|
|
3999
|
+
setFormData(__assign(__assign({}, formData), { lastName: e.target.value }));
|
|
4000
|
+
} }) })), jsx(Form.Item, __assign({ rules: [
|
|
4041
4001
|
{ required: true, message: "Please input your email!" },
|
|
4042
4002
|
{ type: "email", message: "Please enter a valid email!" },
|
|
4043
|
-
] }, { children: jsx(Input, { placeholder: "Email"
|
|
4003
|
+
], initialValue: formData.email }, { children: jsx(Input, { placeholder: "Email", value: formData.email, onChange: function (e) {
|
|
4004
|
+
handleInputChange(e);
|
|
4005
|
+
setFormData(__assign(__assign({}, formData), { email: e.target.value }));
|
|
4006
|
+
} }) })), jsx(Form.Item, __assign({ rules: [
|
|
4044
4007
|
{ required: true, message: "Please input your account name!" },
|
|
4045
|
-
] }, { children: jsx(Input, { placeholder: "Account name"
|
|
4008
|
+
], initialValue: formData.accountName }, { children: jsx(Input, { placeholder: "Account name", value: formData.accountName, onChange: function (e) {
|
|
4009
|
+
handleInputChange(e);
|
|
4010
|
+
setFormData(__assign(__assign({}, formData), { accountName: e.target.value }));
|
|
4011
|
+
} }) }))] })), jsx(Form.Item, { children: jsx(Button$1, __assign({ type: "primary", htmlType: "submit", loading: submitting, className: "w-full mt-4" }, { children: "Proceed to payment" })) })] })));
|
|
4046
4012
|
}
|
|
4047
4013
|
|
|
4048
4014
|
var Title = Typography.Title, Text$6 = Typography.Text;
|
|
@@ -4056,31 +4022,32 @@ function PriceListDisplay(_a) {
|
|
|
4056
4022
|
var priceListData = _a.priceListData, topNavImageUrl = _a.topNavImageUrl;
|
|
4057
4023
|
if (!priceListData)
|
|
4058
4024
|
return null;
|
|
4059
|
-
|
|
4060
|
-
return (jsx(Fragment, { children: jsx("div", __assign({ className: "flex flex-col justify-between h-full my-12" }, { children: jsxs("div", __assign({ className: "flex flex-col space-y-8" }, { children: [jsx(Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false }), jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsx(Text$5, __assign({ className: "text-slate-500 font-bold text-lg" }, { children: priceListData.name })), jsxs(Text$5, __assign({ className: "font-bold text-xl" }, { children: [formatCurrency(priceListData.basePrice, priceListData.currencyId), " ", "/ month"] }))] })), priceListData.trialAllowed ? (jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxs(Text$5, __assign({ style: { fontSize: "16px" }, className: "text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsx(Text$5, __assign({ className: "text-slate-500", style: { fontSize: "12px" } }, { children: "You will not be charged until the last day of the trial." }))] }))) : null] })) })) }));
|
|
4025
|
+
return (jsx(Fragment, { children: jsx("div", __assign({ className: "flex flex-col justify-between h-full my-12" }, { children: jsxs("div", __assign({ className: "flex flex-col space-y-8" }, { children: [jsx(Image, { width: 24, src: topNavImageUrl, alt: "Logo", preview: false }), jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsx(Text$5, __assign({ className: "text-slate-500 font-bold text-lg" }, { children: priceListData.name })), jsxs(Text$5, __assign({ className: "font-bold text-xl" }, { children: [formatCurrency(priceListData.basePrice, priceListData.currencyId), " ", "/ month"] }))] })), jsxs("div", __assign({ className: "flex flex-col" }, { children: [jsxs(Text$5, __assign({ style: { fontSize: "16px" }, className: "text-slate-500" }, { children: [priceListData.trialLengthDays, " day trial"] })), jsx(Text$5, __assign({ className: "text-slate-500", style: { fontSize: "12px" } }, { children: "You will not be charged until the last day of the trial." }))] }))] })) })) }));
|
|
4061
4026
|
}
|
|
4062
4027
|
|
|
4063
4028
|
var showErrorNotification = useErrorNotification();
|
|
4064
4029
|
function Signup(_a) {
|
|
4065
|
-
var companyName = _a.companyName, entityId = _a.entityId, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, className = _a.className, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, style = _a.style;
|
|
4030
|
+
var apiToken = _a.apiToken, companyName = _a.companyName, entityId = _a.entityId, priceListCode = _a.priceListCode, returnUrl = _a.returnUrl, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, className = _a.className, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, style = _a.style;
|
|
4066
4031
|
// Hooks
|
|
4067
4032
|
var _d = useContext$1(BunnyContext), apiHost = _d.apiHost, graphQLClient = _d.graphQLClient;
|
|
4068
|
-
var token = useToken();
|
|
4069
4033
|
var isMobile = useIsMobile();
|
|
4070
4034
|
var topNavImageUrl = useContext$1(BrandContext).topNavImageUrl;
|
|
4071
|
-
console.log("topNavImageUrl in signup", topNavImageUrl);
|
|
4072
4035
|
var _e = useState(undefined), quote = _e[0], setQuote = _e[1];
|
|
4073
4036
|
var _f = useState(undefined), accountId = _f[0], setAccountId = _f[1];
|
|
4074
|
-
var _g = useState(undefined),
|
|
4075
|
-
var _h = useState(
|
|
4076
|
-
var _j = useState(
|
|
4077
|
-
var _k = useState(
|
|
4078
|
-
var
|
|
4037
|
+
var _g = useState(undefined), quoteId = _g[0], setQuoteId = _g[1];
|
|
4038
|
+
var _h = useState(undefined), portalSessionToken = _h[0], setPortalSessionToken = _h[1];
|
|
4039
|
+
var _j = useState(undefined), formData = _j[0], setFormData = _j[1];
|
|
4040
|
+
var _k = useState(false), proceedingToPayment = _k[0], setProceedingToPayment = _k[1];
|
|
4041
|
+
var _l = useState(false), purchaseSucceeded = _l[0], setPurchaseSucceeded = _l[1];
|
|
4042
|
+
var _m = useState(undefined), paymentMethodGraphQLClient = _m[0], setPaymentMethodGraphQLClient = _m[1];
|
|
4043
|
+
var paymentMethod = usePaymentMethod(paymentMethodGraphQLClient || graphQLClient, accountId).data;
|
|
4079
4044
|
var queryClient = useQueryClient();
|
|
4080
4045
|
// Queries
|
|
4081
4046
|
var priceListData = useQuery({
|
|
4082
4047
|
queryKey: ["priceList", priceListCode],
|
|
4083
|
-
queryFn: function () {
|
|
4048
|
+
queryFn: function () {
|
|
4049
|
+
return getPriceList({ token: apiToken, apiHost: apiHost, code: priceListCode });
|
|
4050
|
+
},
|
|
4084
4051
|
}).data;
|
|
4085
4052
|
function handleSubmit(formData) {
|
|
4086
4053
|
return __awaiter(this, void 0, void 0, function () {
|
|
@@ -4090,8 +4057,9 @@ function Signup(_a) {
|
|
|
4090
4057
|
case 0:
|
|
4091
4058
|
_a.trys.push([0, 3, , 4]);
|
|
4092
4059
|
setProceedingToPayment(true);
|
|
4060
|
+
setFormData(formData);
|
|
4093
4061
|
return [4 /*yield*/, quoteAccountSignup({
|
|
4094
|
-
token:
|
|
4062
|
+
token: apiToken,
|
|
4095
4063
|
apiHost: apiHost,
|
|
4096
4064
|
entityId: entityId,
|
|
4097
4065
|
priceListCode: priceListCode,
|
|
@@ -4105,8 +4073,9 @@ function Signup(_a) {
|
|
|
4105
4073
|
case 1:
|
|
4106
4074
|
data = _a.sent();
|
|
4107
4075
|
setAccountId(data.account.id);
|
|
4076
|
+
console.log("apiToken", apiToken);
|
|
4108
4077
|
return [4 /*yield*/, portalSessionCreate({
|
|
4109
|
-
token:
|
|
4078
|
+
token: apiToken,
|
|
4110
4079
|
apiHost: apiHost,
|
|
4111
4080
|
tenantCode: data.tenant.code,
|
|
4112
4081
|
expiry: 24,
|
|
@@ -4121,8 +4090,12 @@ function Signup(_a) {
|
|
|
4121
4090
|
queryClient.invalidateQueries({
|
|
4122
4091
|
queryKey: QueryKeyFactory.default.accountPaymentMethodKey,
|
|
4123
4092
|
});
|
|
4093
|
+
setQuoteId(data.quote.id);
|
|
4124
4094
|
setProceedingToPayment(false);
|
|
4125
|
-
setQuote(
|
|
4095
|
+
setQuote({
|
|
4096
|
+
amountDue: data.quote.amountDue,
|
|
4097
|
+
currencyId: data.quote.currencyId,
|
|
4098
|
+
});
|
|
4126
4099
|
return [3 /*break*/, 4];
|
|
4127
4100
|
case 3:
|
|
4128
4101
|
error_1 = _a.sent();
|
|
@@ -4134,39 +4107,39 @@ function Signup(_a) {
|
|
|
4134
4107
|
});
|
|
4135
4108
|
});
|
|
4136
4109
|
}
|
|
4137
|
-
function
|
|
4138
|
-
return __awaiter(this, void 0, void 0, function () {
|
|
4139
|
-
return __generator(this, function (_a) {
|
|
4140
|
-
setPurchaseSucceeded(true);
|
|
4141
|
-
return [2 /*return*/];
|
|
4142
|
-
});
|
|
4143
|
-
});
|
|
4144
|
-
}
|
|
4145
|
-
function accountSignupFunction(plugin) {
|
|
4110
|
+
function handlePaymentSaveSuccess() {
|
|
4146
4111
|
return __awaiter(this, void 0, void 0, function () {
|
|
4112
|
+
var plugin;
|
|
4147
4113
|
return __generator(this, function (_a) {
|
|
4148
4114
|
switch (_a.label) {
|
|
4149
4115
|
case 0:
|
|
4150
|
-
if (!
|
|
4151
|
-
throw new Error("
|
|
4116
|
+
if (!formData) {
|
|
4117
|
+
throw new Error("Form data is required");
|
|
4118
|
+
}
|
|
4119
|
+
plugin = { id: "" };
|
|
4120
|
+
if (!(plugin === null || plugin === void 0 ? void 0 : plugin.id)) {
|
|
4121
|
+
throw new Error("Plugin ID is required");
|
|
4152
4122
|
}
|
|
4153
4123
|
if (!accountId) {
|
|
4154
4124
|
throw new Error("Account ID is required");
|
|
4155
4125
|
}
|
|
4156
|
-
if (!
|
|
4157
|
-
throw new Error("
|
|
4126
|
+
if (!portalSessionToken) {
|
|
4127
|
+
throw new Error("Portal session token is required");
|
|
4158
4128
|
}
|
|
4159
4129
|
return [4 /*yield*/, accountSignup({
|
|
4160
4130
|
token: portalSessionToken,
|
|
4161
4131
|
apiHost: apiHost,
|
|
4162
4132
|
entityId: entityId,
|
|
4163
|
-
quoteId:
|
|
4133
|
+
quoteId: quoteId,
|
|
4164
4134
|
paymentMethodId: paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id,
|
|
4165
|
-
pluginId: plugin
|
|
4135
|
+
pluginId: plugin.id.toString(),
|
|
4166
4136
|
priceListCode: priceListCode,
|
|
4167
4137
|
accountId: accountId,
|
|
4168
4138
|
})];
|
|
4169
|
-
case 1:
|
|
4139
|
+
case 1:
|
|
4140
|
+
_a.sent();
|
|
4141
|
+
setPurchaseSucceeded(true);
|
|
4142
|
+
return [2 /*return*/];
|
|
4170
4143
|
}
|
|
4171
4144
|
});
|
|
4172
4145
|
});
|
|
@@ -4180,7 +4153,7 @@ function Signup(_a) {
|
|
|
4180
4153
|
};
|
|
4181
4154
|
return (jsx(WrapperComponent, __assign({ className: "p-4 flex flex-col ".concat(shadow, " ").concat(className), style: style }, { children: purchaseSucceeded ? (jsx(PaymentSuccessDisplay, { amountPaid: (quote === null || quote === void 0 ? void 0 : quote.amountDue) || 0, className: "w-full", companyName: companyName, returnUrl: returnUrl })) : (jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col" : "flex-row", " h-full w-full") }, { children: [jsx("div", __assign({ className: "flex flex-col ".concat(isMobile ? "items-center" : "w-1/2 items-center") }, { children: jsx(PriceListDisplay, { priceListData: priceListData, topNavImageUrl: topNavImageUrl }) })), jsx("div", __assign({ className: "".concat(isMobile ? "h-full" : "my-4") }, { children: jsx(Divider, { className: "h-full", type: isMobile ? undefined : "vertical" }) })), jsx("div", __assign({ className: "flex ".concat(isMobile
|
|
4182
4155
|
? "items-center justify-center my-12"
|
|
4183
|
-
: "w-1/2 items-center justify-center my-12") }, { children: jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2") }, { children: jsx(PaymentForms, { entityId: entityId, quote: quote,
|
|
4156
|
+
: "w-1/2 items-center justify-center my-12") }, { children: jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2") }, { children: jsx(PaymentForms, { entityId: entityId, quote: quote, handlePaymentSaveSuccess: handlePaymentSaveSuccess, handlePaymentFail: handlePaymentFail, handleSubmit: handleSubmit, proceedingToPayment: proceedingToPayment, accountId: accountId, overrideToken: portalSessionToken }) })) }))] }))) })));
|
|
4184
4157
|
}
|
|
4185
4158
|
|
|
4186
4159
|
// WARNING: There is a preview button on APP that will need to be changed if this query is changed
|
|
@@ -4609,9 +4582,8 @@ var SubscriptionCardActions = function (_a) {
|
|
|
4609
4582
|
var _b, _c;
|
|
4610
4583
|
var planChangeOptions = _a.planChangeOptions, subscription = _a.subscription, setEditingQuoteData = _a.setEditingQuoteData, setPayModalVisible = _a.setPayModalVisible;
|
|
4611
4584
|
// Context
|
|
4612
|
-
var
|
|
4613
|
-
var
|
|
4614
|
-
var _d = useContext$1(SubscriptionsContext), onChangePlanClick = _d.onChangePlanClick, onClickUpgrade = _d.onClickUpgrade, isTempViewOnly = _d.isTempViewOnly;
|
|
4585
|
+
var _d = useContext$1(BunnyContext), token = _d.token, apiHost = _d.apiHost;
|
|
4586
|
+
var _e = useContext$1(SubscriptionsContext), onChangePlanClick = _e.onChangePlanClick, onClickUpgrade = _e.onClickUpgrade, isTempViewOnly = _e.isTempViewOnly;
|
|
4615
4587
|
// Hooks
|
|
4616
4588
|
useSuccessNotification();
|
|
4617
4589
|
// const cancelSubscription = useCancelSubscription();
|
|
@@ -4799,8 +4771,7 @@ var SubscriptionCardDesktop = function (_a) {
|
|
|
4799
4771
|
var SubscriptionCardDesktopRow = function (_a) {
|
|
4800
4772
|
var charge = _a.charge, chargeIndex = _a.chargeIndex, subscription = _a.subscription;
|
|
4801
4773
|
// Context
|
|
4802
|
-
var
|
|
4803
|
-
var token = useToken();
|
|
4774
|
+
var _b = useContext$1(BunnyContext), token = _b.token, apiHost = _b.apiHost;
|
|
4804
4775
|
// Derived state
|
|
4805
4776
|
var isRamp = charge.isRamp;
|
|
4806
4777
|
var prevCharge = subscription.charges[chargeIndex - 1];
|
|
@@ -4921,8 +4892,7 @@ var SubscriptionsNavigation = function (_a) {
|
|
|
4921
4892
|
var Subscriptions = function (_a) {
|
|
4922
4893
|
var companyName = _a.companyName, entityId = _a.entityId, gap = _a.gap, shadow = _a.shadow, _b = _a.showTitle, showTitle = _b === void 0 ? true : _b, className = _a.className;
|
|
4923
4894
|
// Context
|
|
4924
|
-
var _c = useContext$1(BunnyContext), apiHost = _c.apiHost, onTokenExpired = _c.onTokenExpired;
|
|
4925
|
-
var token = useToken();
|
|
4895
|
+
var _c = useContext$1(BunnyContext), token = _c.token, apiHost = _c.apiHost, onTokenExpired = _c.onTokenExpired;
|
|
4926
4896
|
// Recoil state
|
|
4927
4897
|
// const [updatingChargeQuantityId, setUpdatingChargeQuantityId] =
|
|
4928
4898
|
// useRecoilState(updatingChargeQuantityIdState);
|
|
@@ -8200,53 +8170,39 @@ var getAccount = function (_a) {
|
|
|
8200
8170
|
};
|
|
8201
8171
|
|
|
8202
8172
|
var BillingDetails = function (_a) {
|
|
8203
|
-
var entityId = _a.entityId, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, className = _a.className
|
|
8204
|
-
var _d = useContext$1(BunnyContext), apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired, graphQLClient = _d.graphQLClient;
|
|
8205
|
-
var token = useToken();
|
|
8173
|
+
var entityId = _a.entityId, accountId = _a.accountId, _b = _a.isCardEnabled, isCardEnabled = _b === void 0 ? true : _b, _c = _a.shadow, shadow = _c === void 0 ? "shadow-md" : _c, className = _a.className;
|
|
8174
|
+
var _d = useContext$1(BunnyContext), token = _d.token, apiHost = _d.apiHost, onTokenExpired = _d.onTokenExpired, graphQLClient = _d.graphQLClient;
|
|
8206
8175
|
// Hooks
|
|
8207
8176
|
var isMobile = useIsMobile();
|
|
8208
8177
|
var queryClient = useQueryClient();
|
|
8178
|
+
var form = Form.useForm()[0];
|
|
8179
|
+
var _e = useState(false), isFormEdited = _e[0], setIsFormEdited = _e[1];
|
|
8209
8180
|
var showSuccessNotification = useSuccessNotification();
|
|
8210
8181
|
var showErrorNotification = useErrorNotification();
|
|
8211
8182
|
var handleAllErrorFormats = useAllErrorFormats(onTokenExpired);
|
|
8212
|
-
var paymentMethod = usePaymentMethod(graphQLClient).data;
|
|
8213
|
-
// State
|
|
8214
|
-
var form = Form.useForm()[0];
|
|
8215
|
-
var _e = useState(false), isFormEdited = _e[0], setIsFormEdited = _e[1];
|
|
8216
|
-
var _f = useState(accountIdProp), accountId = _f[0], setAccountId = _f[1];
|
|
8217
|
-
var filteredCountryList = useMemo(function () {
|
|
8218
|
-
return countryListFilter
|
|
8219
|
-
? Lists.COUNTRY_LIST.filter(countryListFilter)
|
|
8220
|
-
: Lists.COUNTRY_LIST;
|
|
8221
|
-
}, [countryListFilter]);
|
|
8222
8183
|
// Queries
|
|
8223
|
-
var
|
|
8184
|
+
var _f = useQuery({
|
|
8224
8185
|
queryKey: ["account", accountId],
|
|
8225
8186
|
queryFn: function () { return getAccount({ token: token, apiHost: apiHost, id: accountId }); },
|
|
8226
|
-
|
|
8227
|
-
|
|
8228
|
-
var _h = useMutation({
|
|
8187
|
+
}), account = _f.data, isLoadingAccount = _f.isLoading;
|
|
8188
|
+
var _g = useMutation({
|
|
8229
8189
|
mutationFn: function (changedFormData) { return __awaiter(void 0, void 0, void 0, function () {
|
|
8230
8190
|
var account;
|
|
8231
8191
|
return __generator(this, function (_a) {
|
|
8232
8192
|
switch (_a.label) {
|
|
8233
|
-
case 0:
|
|
8234
|
-
|
|
8235
|
-
|
|
8236
|
-
|
|
8237
|
-
|
|
8238
|
-
|
|
8239
|
-
|
|
8240
|
-
|
|
8241
|
-
|
|
8242
|
-
|
|
8243
|
-
|
|
8244
|
-
|
|
8245
|
-
|
|
8246
|
-
},
|
|
8247
|
-
token: token,
|
|
8248
|
-
apiHost: apiHost,
|
|
8249
|
-
})];
|
|
8193
|
+
case 0: return [4 /*yield*/, accountUpdate({
|
|
8194
|
+
accountId: accountId,
|
|
8195
|
+
attributes: {
|
|
8196
|
+
name: changedFormData.name,
|
|
8197
|
+
billingStreet: changedFormData.billingStreet,
|
|
8198
|
+
billingCity: changedFormData.billingCity,
|
|
8199
|
+
billingZip: changedFormData.billingZip,
|
|
8200
|
+
billingState: changedFormData.billingState,
|
|
8201
|
+
billingCountry: changedFormData.billingCountry,
|
|
8202
|
+
},
|
|
8203
|
+
token: token,
|
|
8204
|
+
apiHost: apiHost,
|
|
8205
|
+
})];
|
|
8250
8206
|
case 1:
|
|
8251
8207
|
account = _a.sent();
|
|
8252
8208
|
queryClient.setQueryData(["account", accountId], function (old) {
|
|
@@ -8257,17 +8213,11 @@ var BillingDetails = function (_a) {
|
|
|
8257
8213
|
});
|
|
8258
8214
|
}); },
|
|
8259
8215
|
onSuccess: function () {
|
|
8260
|
-
showSuccessNotification("Your account details have been saved");
|
|
8261
8216
|
queryClient.invalidateQueries({
|
|
8262
8217
|
queryKey: ["getTaxationRequiredAccountFields", token],
|
|
8263
8218
|
});
|
|
8264
8219
|
},
|
|
8265
|
-
}), updateAccount =
|
|
8266
|
-
useEffect(function () {
|
|
8267
|
-
if (paymentMethod) {
|
|
8268
|
-
setAccountId(paymentMethod.accountId);
|
|
8269
|
-
}
|
|
8270
|
-
}, [paymentMethod]);
|
|
8220
|
+
}), updateAccount = _g.mutate, isUpdatingAccount = _g.isPending;
|
|
8271
8221
|
useEffect(function () {
|
|
8272
8222
|
if (account) {
|
|
8273
8223
|
form.setFieldsValue({
|
|
@@ -8284,35 +8234,33 @@ var BillingDetails = function (_a) {
|
|
|
8284
8234
|
showSuccessNotification("Your payment method has been saved");
|
|
8285
8235
|
}, [queryClient]);
|
|
8286
8236
|
var savePaymentPreCondition = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
8237
|
+
var error_1;
|
|
8287
8238
|
return __generator(this, function (_a) {
|
|
8288
|
-
|
|
8289
|
-
|
|
8290
|
-
|
|
8291
|
-
|
|
8292
|
-
|
|
8293
|
-
|
|
8294
|
-
|
|
8295
|
-
|
|
8296
|
-
|
|
8297
|
-
|
|
8298
|
-
|
|
8299
|
-
|
|
8300
|
-
|
|
8301
|
-
|
|
8302
|
-
showErrorNotification("Failed to update account", error_1.message);
|
|
8303
|
-
}
|
|
8304
|
-
else {
|
|
8305
|
-
showErrorNotification("Please fill out all required fields");
|
|
8306
|
-
}
|
|
8307
|
-
return [2 /*return*/, false];
|
|
8308
|
-
case 3:
|
|
8309
|
-
setIsFormEdited(false);
|
|
8310
|
-
return [7 /*endfinally*/];
|
|
8311
|
-
case 4: return [2 /*return*/];
|
|
8239
|
+
switch (_a.label) {
|
|
8240
|
+
case 0:
|
|
8241
|
+
_a.trys.push([0, 3, 4, 5]);
|
|
8242
|
+
return [4 /*yield*/, form.validateFields()];
|
|
8243
|
+
case 1:
|
|
8244
|
+
_a.sent();
|
|
8245
|
+
return [4 /*yield*/, updateAccount(form.getFieldsValue())];
|
|
8246
|
+
case 2:
|
|
8247
|
+
_a.sent();
|
|
8248
|
+
return [2 /*return*/, true];
|
|
8249
|
+
case 3:
|
|
8250
|
+
error_1 = _a.sent();
|
|
8251
|
+
if (error_1 instanceof Error) {
|
|
8252
|
+
showErrorNotification("Failed to update account", error_1.message);
|
|
8312
8253
|
}
|
|
8313
|
-
|
|
8314
|
-
|
|
8315
|
-
|
|
8254
|
+
else {
|
|
8255
|
+
showErrorNotification("Please fill out all required fields");
|
|
8256
|
+
}
|
|
8257
|
+
return [2 /*return*/, false];
|
|
8258
|
+
case 4:
|
|
8259
|
+
setIsFormEdited(false);
|
|
8260
|
+
showSuccessNotification("Your account details have been saved");
|
|
8261
|
+
return [7 /*endfinally*/];
|
|
8262
|
+
case 5: return [2 /*return*/];
|
|
8263
|
+
}
|
|
8316
8264
|
});
|
|
8317
8265
|
}); };
|
|
8318
8266
|
function handleValuesChange(changedValues) {
|
|
@@ -8327,13 +8275,13 @@ var BillingDetails = function (_a) {
|
|
|
8327
8275
|
};
|
|
8328
8276
|
setIsFormEdited(isFormEdited());
|
|
8329
8277
|
}
|
|
8330
|
-
return (jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxs("div", __assign({ className: "flex p-2 my-2 ".concat(isMobile ? "flex-col space-y-4" : "flex-row", " gap-4") }, { children: [jsxs("div", __assign({ className: "".concat(isMobile
|
|
8278
|
+
return (jsx(WrapperComponent, __assign({ isCardEnabled: isCardEnabled, shadow: shadow, className: className }, { children: jsxs("div", __assign({ className: "flex p-2 my-2 ".concat(isMobile ? "flex-col space-y-4" : "flex-row", " gap-4") }, { children: [jsxs("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2", " px-4") }, { children: [jsx(ReactQueryDevtools2, {}), jsx(Skeleton, __assign({ loading: isLoadingAccount }, { children: jsxs(Form, __assign({ className: "flex flex-col gap-2", form: form, layout: "vertical", disabled: isUpdatingAccount, onValuesChange: function (changedValues) {
|
|
8331
8279
|
handleValuesChange(changedValues);
|
|
8332
8280
|
} }, { children: [jsx(Form.Item, __assign({ label: "Account name", name: "name", rules: [
|
|
8333
8281
|
{ required: true, message: "Account name is required" },
|
|
8334
8282
|
] }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Street address", name: "billingStreet", rules: [
|
|
8335
8283
|
{ required: true, message: "Street address is required" },
|
|
8336
|
-
] }, { children: jsx(Input, {}) })), jsxs("div", __assign({ className: "flex gap-4" }, { children: [jsx(Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: "City is required" }], className: "flex-1" }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: "Zipcode is required" }], className: "flex-1" }, { children: jsx(Input, {}) }))] })), jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col pb-2" : "flex-row", " gap-4") }, { children: [jsx(Form.Item, __assign({ label: "State", name: "billingState", className: "flex-1" }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Country", name: "billingCountry", className: "flex-1", rules: [{ required: true, message: "Country is required" }] }, { children: jsx(Select, { options:
|
|
8284
|
+
] }, { children: jsx(Input, {}) })), jsxs("div", __assign({ className: "flex gap-4" }, { children: [jsx(Form.Item, __assign({ label: "City", name: "billingCity", rules: [{ required: true, message: "City is required" }], className: "flex-1" }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Zipcode", name: "billingZip", rules: [{ required: true, message: "Zipcode is required" }], className: "flex-1" }, { children: jsx(Input, {}) }))] })), jsxs("div", __assign({ className: "flex ".concat(isMobile ? "flex-col pb-2" : "flex-row", " gap-4") }, { children: [jsx(Form.Item, __assign({ label: "State", name: "billingState", className: "flex-1" }, { children: jsx(Input, {}) })), jsx(Form.Item, __assign({ label: "Country", name: "billingCountry", className: "flex-1", rules: [{ required: true, message: "Country is required" }] }, { children: jsx(Select, { options: Lists.COUNTRY_LIST, placeholder: "Select a country", showSearch: true, filterOption: function (input, option) {
|
|
8337
8285
|
var _a, _b;
|
|
8338
8286
|
return ((_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : "")
|
|
8339
8287
|
.toLowerCase()
|
|
@@ -8341,13 +8289,13 @@ var BillingDetails = function (_a) {
|
|
|
8341
8289
|
((_b = option === null || option === void 0 ? void 0 : option.value) !== null && _b !== void 0 ? _b : "")
|
|
8342
8290
|
.toLowerCase()
|
|
8343
8291
|
.includes(input.toLowerCase());
|
|
8344
|
-
} }) }))] })), jsx(Form.Item, __assign({ label: "Email", name: "email" }, { children: jsx(Input, { disabled: true
|
|
8292
|
+
} }) }))] })), jsx(Form.Item, __assign({ label: "Email", name: "email" }, { children: jsx(Input, { disabled: true }) }))] })) })), jsx(Button$1, __assign({ disabled: !isFormEdited || isUpdatingAccount, className: "w-full mt-4", type: "primary", onClick: function () {
|
|
8345
8293
|
savePaymentPreCondition();
|
|
8346
|
-
} }, { children: "Save" }))] })),
|
|
8347
|
-
|
|
8348
|
-
|
|
8349
|
-
|
|
8350
|
-
|
|
8294
|
+
} }, { children: "Save" }))] })), isMobile ? (jsx("div", __assign({ className: "mx-4" }, { children: jsx(Divider, {}) }))) : (jsx("div", { children: jsx(Divider, { className: "h-full", type: "vertical" }) })), jsx("div", __assign({ className: "".concat(isMobile ? "w-full" : "w-1/2 pt-4", " flex justify-center") }, { children: jsx(PaymentForm, { entityId: entityId, onFail: function (error) {
|
|
8295
|
+
handleAllErrorFormats(error);
|
|
8296
|
+
}, onSavePaymentMethod: function () {
|
|
8297
|
+
onSuccess();
|
|
8298
|
+
}, graphQLClient: graphQLClient }) }))] })) })));
|
|
8351
8299
|
};
|
|
8352
8300
|
var WrapperComponent = function (_a) {
|
|
8353
8301
|
var children = _a.children, isCardEnabled = _a.isCardEnabled, shadow = _a.shadow, className = _a.className;
|