@bunnyapp/components 1.8.0-beta.2 → 1.8.0-beta.21

package/dist/cjs/types/src/ajax.d.ts

@@ -1 +1 @@
-export declare const useDownloadFile: (id?: string, onError?: (error: any) => void) => (url: string, token?: string) => Promise<any>;
+export declare const useDownloadFile: (id?: string | null | undefined, onError?: (error: any) => void) => (url: string, token?: string) => Promise<any>;

package/dist/cjs/types/src/components/Checkout/QuoteCheckout.d.ts

@@ -11,7 +11,7 @@ export declare const QuoteCheckout_QuoteFragment: import("gql.tada").TadaDocumen
     quoteChanges: ({
         id: string | null;
         charges: {
-            kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE" | null;
+            kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE" | null;
             coupon: {
                 couponCode: string;
             } | null;
@@ -19,7 +19,7 @@ export declare const QuoteCheckout_QuoteFragment: import("gql.tada").TadaDocumen
     }[] & {
         currencyId: string;
         id: string | null;
-        kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+        kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
         charges: {
             subtotal: number | null;
             amountsByPeriod: {
@@ -44,7 +44,7 @@ export declare const QuoteCheckout_QuoteFragment: import("gql.tada").TadaDocumen
                 couponCode: string;
             } | null;
             quantity: number | null;
-            kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE" | null;
+            kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE" | null;
         }[];
         priceList: {
             id: string;
@@ -70,9 +70,9 @@ export declare const QuoteCheckout_QuoteFragment: import("gql.tada").TadaDocumen
         amount: number | null;
         startDate: unknown;
     }[];
-    kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+    kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
     [$tada.fragmentRefs]: {
-        shouldShowCouponEditor_QuoteFragment: "Quote";
+        canApplyCoupons_QuoteFragment: "Quote";
     } & {
         PaymentForm_QuoteFragment: "Quote";
     } & {
@@ -86,7 +86,7 @@ export declare const QuoteCheckout_QuoteFragment: import("gql.tada").TadaDocumen
 export declare const QuoteCheckout_SubscriptionFragment: import("gql.tada").TadaDocumentNode<{
     id: string;
     [$tada.fragmentRefs]: {
-        shouldShowCouponEditor_SubscriptionFragment: "Subscription";
+        canApplyCoupons_SubscriptionFragment: "Subscription";
     };
 }, {}, {
     fragment: "QuoteCheckout_SubscriptionFragment";

package/dist/cjs/types/src/components/DocumentTemplatePreview.d.ts

@@ -1,4 +1,8 @@
-declare const DocumentTemplatePreview: ({ targetUrl }: {
+export type DocumentPreviewFullscreenApi = {
+    toggleFullScreen: () => void;
+};
+declare const DocumentTemplatePreview: ({ targetUrl, onFullscreenApiChange, }: {
     targetUrl: string;
+    onFullscreenApiChange?: (api: DocumentPreviewFullscreenApi | null) => void;
 }) => import("react/jsx-runtime").JSX.Element;
 export default DocumentTemplatePreview;

package/dist/cjs/types/src/components/Invoice/InvoiceQuoteView/DownloadQuoteButton.d.ts

@@ -0,0 +1,5 @@
+type DownloadQuoteButtonProps = {
+    id?: string | null;
+};
+declare const DownloadQuoteButton: ({ id }: DownloadQuoteButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default DownloadQuoteButton;

package/dist/cjs/types/src/components/Invoice/InvoiceQuoteView/InvoiceQuoteView.d.ts

@@ -0,0 +1,8 @@
+import { type DocumentPreviewFullscreenApi } from '../../DocumentTemplatePreview';
+type InvoiceQuoteViewOnlyProps = {
+    html: string | null | undefined;
+    targetUrl?: string;
+    onDocumentPreviewFullscreenApiChange?: (api: DocumentPreviewFullscreenApi | null) => void;
+};
+declare const InvoiceQuoteView: ({ html, targetUrl, onDocumentPreviewFullscreenApiChange, }: InvoiceQuoteViewOnlyProps) => import("react/jsx-runtime").JSX.Element;
+export default InvoiceQuoteView;

package/dist/cjs/types/src/components/Invoice/InvoiceQuoteView/InvoiceQuoteViewWithButtons.d.ts

@@ -0,0 +1,14 @@
+import FormattedInvoice from '@/types/FormattedInvoice';
+import { ReactNode } from 'react';
+import { type DocumentPreviewFullscreenApi } from '../../DocumentTemplatePreview';
+declare const InvoiceQuoteViewWithButtons: ({ children, formattedInvoice, html, backButtonName, onBackButtonClick, onDownloadError, targetUrl, onDocumentPreviewFullscreenApiChange, }: {
+    html: string | null;
+    children?: ReactNode;
+    formattedInvoice?: FormattedInvoice;
+    backButtonName?: string;
+    onBackButtonClick?: () => void;
+    onDownloadError?: () => void;
+    targetUrl?: string;
+    onDocumentPreviewFullscreenApiChange?: (api: DocumentPreviewFullscreenApi | null) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default InvoiceQuoteViewWithButtons;

package/dist/cjs/types/src/components/PandadocPollingModal.d.ts

@@ -1,7 +1,7 @@
 interface PandadocPollingModalProps {
     isVisible: boolean;
     setVisible: (visible: boolean) => void;
-    id?: string;
+    id?: string | null | undefined;
 }
 declare const PandadocPollingModal: ({ isVisible, setVisible, id }: PandadocPollingModalProps) => import("react/jsx-runtime").JSX.Element;
 export default PandadocPollingModal;

package/dist/cjs/types/src/components/PaymentForm/DemoPay/CreditCard/MiniCreditCard.d.ts

@@ -9,6 +9,8 @@ export declare const MiniCreditCard_PaymentMethodFragment: import("gql.tada").Ta
         type: string | null;
         identifier: string | null;
     } | null;
+    state: "FAILED" | "UNKNOWN" | "SUCCESS" | null;
+    failureReason: string | null;
     id: string;
 }, {}, {
     fragment: "MiniCreditCard_PaymentMethodFragment";

package/dist/cjs/types/src/components/PaymentForm/DemoPay/DemoPayFormProvider.d.ts

@@ -0,0 +1,10 @@
+export type DemoPayCardDetails = {
+    number: string;
+    expiry: string;
+    cvc: string;
+};
+declare const DemoPayFormProvider: ({ initialValue, children, }: {
+    initialValue?: DemoPayCardDetails | undefined;
+    children?: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, useDemoPayCardDetails: () => [DemoPayCardDetails, import("react").Dispatch<import("react").SetStateAction<DemoPayCardDetails>>];
+export { DemoPayFormProvider, useDemoPayCardDetails };

package/dist/cjs/types/src/components/PaymentForm/DemoPay/hooks/usePay.d.ts

@@ -1,11 +1,9 @@
-import FormattedInvoice from '@/types/FormattedInvoice';
-import Invoice from '@/types/Invoice';
 import { PluginData } from '@/types/frontendTypes';
-export declare function usePay({ onPaymentSuccess, onPaymentError, quoteId, invoice, plugin, }: {
+export declare function usePay({ onPaymentSuccess, onPaymentError, quoteId, invoiceId, plugin, }: {
     onPaymentSuccess?: (response: any) => void;
     onPaymentError?: (error: any) => void;
     quoteId?: string | null;
-    invoice?: FormattedInvoice | Invoice;
+    invoiceId?: string | null;
     plugin: PluginData | undefined;
 }): {
     pay: (paymentMethodId: string) => Promise<void>;

package/dist/cjs/types/src/components/PaymentForm/DemoPay/hooks/useSave.d.ts

@@ -3,11 +3,7 @@ export declare function useSave({ onSaveSuccess, onSaveError, accountId, }: {
     onSaveError?: (error: any) => void;
     accountId: string | undefined;
 }): {
-    save: (cardDetails: {
-        number: string;
-        expiry: string;
-        cvc: string;
-    }) => Promise<string | undefined>;
+    save: () => Promise<string | undefined>;
     isSaving: boolean;
 };
 export default useSave;

package/dist/cjs/types/src/components/PaymentForm/PaymentForm.d.ts

@@ -1,23 +1,32 @@
-import FormattedInvoice from '@/types/FormattedInvoice';
-import Invoice from '@/types/Invoice';
 import { FragmentOf, ResultOf } from 'gql.tada';
+import type { ComponentProps } from 'react';
+import { ReactNode } from 'react';
+import { CheckoutNoPayment } from './components/CheckoutNoPayment';
+import { Pay } from './components/Pay';
+import { PaymentMethodDetails } from './components/PaymentMethodDetails/PaymentMethodDetails';
+import { StoredPaymentMethods } from './components/StoredPaymentMethods';
 import { PaymentForm_PaymentMethodsFragment } from './fragments/PaymentForm_PaymentMethodsFragment';
+import { PaymentForm_QuoteFragment } from './fragments/PaymentForm_QuoteFragment';
 type PaymentMethodFragment = ResultOf<typeof PaymentForm_PaymentMethodsFragment>;
-export declare const PaymentForm_QuoteFragment: import("gql.tada").TadaDocumentNode<{
+export declare const PaymentForm_InvoiceFragment: import("gql.tada").TadaDocumentNode<{
     id: string | null;
     currencyId: string;
     [$tada.fragmentRefs]: {
-        PaymentProvider_QuoteFragment: "Quote";
+        PaymentProvider_InvoiceFragment: "Invoice";
     };
 }, {}, {
-    fragment: "PaymentForm_QuoteFragment";
-    on: "Quote";
+    fragment: "PaymentForm_InvoiceFragment";
+    on: "Invoice";
     masked: true;
 }>;
-export declare function PaymentForm({ currencyId: accountCurrencyId, invoice, quote: maskedQuote, onPaymentSuccess, onPaymentHoldSuccess, paymentHoldPrecondition, accountId, onSavePaymentMethod, onPaymentMethodRemoved, onSetDefaultPaymentMethod, overrideToken, customCheckoutFunction, paymentHoldOptions, disablePayButton, }: {
+declare function PaymentFormRoot({ currencyId: accountCurrencyId, invoice: maskedInvoice, quote: maskedQuote, paymentHold, onPaymentSuccess, onPaymentHoldSuccess, paymentHoldPrecondition, accountId, onSavePaymentMethod, onPaymentMethodRemoved, onSetDefaultPaymentMethod, customCheckoutFunction, children, }: {
     currencyId?: string;
-    invoice?: FormattedInvoice | Invoice;
+    invoice?: FragmentOf<typeof PaymentForm_InvoiceFragment>;
     quote?: FragmentOf<typeof PaymentForm_QuoteFragment>;
+    paymentHold?: {
+        quoteId: string;
+        amountToHold: number;
+    };
     onPaymentSuccess?: (response: any) => void;
     onPaymentHoldSuccess?: (response: any) => void;
     /**
@@ -28,12 +37,24 @@ export declare function PaymentForm({ currencyId: accountCurrencyId, invoice, qu
     onPaymentMethodRemoved?: (paymentMethod: PaymentMethodFragment) => void;
     onSetDefaultPaymentMethod?: () => void;
     accountId?: string;
-    overrideToken?: string;
     customCheckoutFunction?: (pluginId: string, paymentMethodId: string) => Promise<any>;
-    paymentHoldOptions?: {
-        payToAccept?: boolean;
-        amountToHold?: number;
-    };
+    children?: ReactNode | ((state: PaymentFormRenderState) => ReactNode);
+}): import("react/jsx-runtime").JSX.Element;
+type PaymentFormProps = ComponentProps<typeof PaymentFormRoot>;
+export type PaymentFormRenderState = {
+    hasPaymentMethods: boolean;
+    isPaymentMethodDetailsOpen: boolean;
+    isPayableAvailable: boolean;
+    amountDue: number | undefined;
+    paymentPluginsCount: number | undefined;
+};
+declare function PaymentFormInternal(props: PaymentFormProps & {
     disablePayButton?: boolean;
-}): import("react/jsx-runtime").JSX.Element | null;
+}): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentForm: typeof PaymentFormInternal & {
+    StoredPaymentMethods: typeof StoredPaymentMethods;
+    Pay: typeof Pay;
+    CheckoutNoPayment: typeof CheckoutNoPayment;
+    PaymentMethodDetails: typeof PaymentMethodDetails;
+};
 export {};

package/dist/cjs/types/src/components/PaymentForm/Stripe/StripeFormProvider.d.ts

@@ -0,0 +1,4 @@
+export declare function StripeFormProvider({ children, currencyId, }: {
+    children: React.ReactNode;
+    currencyId: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/src/components/PaymentForm/Stripe/hooks/usePay.d.ts

@@ -1,11 +1,9 @@
-import FormattedInvoice from '@/types/FormattedInvoice';
-import Invoice from '@/types/Invoice';
 import { PluginData } from '@/types/frontendTypes';
-export declare function usePay({ onPaymentSuccess, onPaymentError, quoteId, invoice, plugin, }: {
+export declare function usePay({ onPaymentSuccess, onPaymentError, quoteId, invoiceId, plugin, }: {
     onPaymentSuccess?: (response: any) => void;
     onPaymentError?: (error: any) => void;
     quoteId?: string | null;
-    invoice?: FormattedInvoice | Invoice;
+    invoiceId?: string | null;
     plugin: PluginData | undefined;
 }): {
     pay: (paymentMethodId: string) => Promise<void>;

package/dist/cjs/types/src/components/PaymentForm/Stripe/stripeUtils.d.ts

@@ -27,7 +27,7 @@ export declare const createPaymentHold: ({ quote, plugin, token, apiHost, paymen
     apiHost: string;
     paymentMethodId: string;
 }) => Promise<any>;
-export declare const useStripePlugin: (plugin: PluginData | undefined, currencyId: string, accountId?: string) => {
+export declare const useStripePlugin: (plugin: PluginData | undefined, currencyId: string) => {
     stripe: Stripe | null;
     options: import("@stripe/stripe-js").StripeElementsOptionsMode;
 };

package/dist/cjs/types/src/components/PaymentForm/components/CheckoutNoPayment.d.ts

@@ -0,0 +1,11 @@
+type Props = {
+    className?: string;
+    disabled?: boolean;
+    onClickPrecondition?: () => Promise<boolean>;
+    buttonTextOverride?: {
+        text: string;
+        isProcessingText: string;
+    };
+};
+export declare function CheckoutNoPayment(props?: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/types/src/components/PaymentForm/components/Pay.d.ts

@@ -0,0 +1,6 @@
+type PayProps = {
+    disabled?: boolean;
+    onClickPrecondition?: () => boolean | Promise<boolean>;
+};
+export declare function Pay(props?: PayProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/types/src/components/PaymentForm/components/PaymentMethodDetails/PaymentMethodDetails.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+import { Cancel } from './components/Cancel';
+import { Save } from './components/Save';
+type PaymentMethodDetailsProps = {
+    footer?: ReactNode;
+};
+declare function PaymentMethodDetailsRoot(props?: PaymentMethodDetailsProps): import("react/jsx-runtime").JSX.Element;
+export declare const PaymentMethodDetails: typeof PaymentMethodDetailsRoot & {
+    Cancel: typeof Cancel;
+    Save: typeof Save;
+};
+export {};

package/dist/cjs/types/src/components/PaymentForm/components/PaymentMethodDetails/components/Cancel.d.ts

@@ -0,0 +1 @@
+export declare function Cancel(): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/src/components/PaymentForm/components/PaymentMethodDetails/components/Save.d.ts

@@ -0,0 +1,9 @@
+type SaveButtonTextOverride = {
+    text: string;
+    isProcessingText: string;
+};
+export declare function Save({ onClickPrecondition, buttonTextOverride, }: {
+    onClickPrecondition?: () => boolean | Promise<boolean>;
+    buttonTextOverride?: SaveButtonTextOverride;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/types/src/components/PaymentForm/components/StoredPaymentMethods.d.ts

@@ -0,0 +1,5 @@
+type StoredPaymentMethodsProps = {
+    className?: string;
+};
+export declare function StoredPaymentMethods(props?: StoredPaymentMethodsProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/types/src/components/PaymentForm/context/AccountIdContext.d.ts

@@ -0,0 +1,5 @@
+declare const AccountIdProvider: ({ value, children }: {
+    value: string | undefined;
+    children?: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, useAccountId: () => string | undefined;
+export { AccountIdProvider, useAccountId };

package/dist/cjs/types/src/components/PaymentForm/context/CallbacksContext.d.ts

@@ -0,0 +1,14 @@
+import { PaymentMethodFragment } from './PaymentMethodFormVisibilityContext';
+export type PaymentCallbacksContextValue = {
+    onPaymentSuccess: ((response: any) => void) | undefined;
+    onSetDefaultPaymentMethod: (() => void) | undefined;
+    onPaymentMethodRemoved: ((paymentMethod: PaymentMethodFragment) => void) | undefined;
+    onSavePaymentMethod: ((response: any) => void) | undefined;
+    onPaymentHoldSuccess: ((response: any) => void) | undefined;
+    paymentHoldPrecondition: (() => boolean | Promise<boolean>) | undefined;
+};
+declare const PaymentFormCallbacksProvider: ({ value, children }: {
+    value: PaymentCallbacksContextValue;
+    children?: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, usePaymentFormCallbacks: () => PaymentCallbacksContextValue;
+export { PaymentFormCallbacksProvider, usePaymentFormCallbacks };

package/dist/cjs/types/src/components/PaymentForm/context/PaymentMethodFormVisibilityContext.d.ts

@@ -0,0 +1,12 @@
+import { ResultOf } from 'gql.tada';
+import { PaymentForm_PaymentMethodsFragment } from '../fragments/PaymentForm_PaymentMethodsFragment';
+export type PaymentMethodFragment = ResultOf<typeof PaymentForm_PaymentMethodsFragment>;
+export type PaymentMethodFormVisibilityContextValue = {
+    showPaymentMethodForm: boolean;
+    setShowPaymentMethodForm: (show: boolean) => void;
+};
+declare const PaymentMethodFormVisibilityProvider: ({ value, children }: {
+    value: PaymentMethodFormVisibilityContextValue;
+    children?: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, usePaymentMethodFormVisibility: () => PaymentMethodFormVisibilityContextValue;
+export { PaymentMethodFormVisibilityProvider, usePaymentMethodFormVisibility };

package/dist/cjs/types/src/components/PaymentForm/context/PaymentProvider.d.ts

@@ -1,51 +1,76 @@
-import FormattedInvoice from '@/types/FormattedInvoice';
-import Invoice from '@/types/Invoice';
 import { FragmentOf } from 'gql.tada';
-import { ReactNode } from 'react';
 import { PaymentType } from '../types/PaymentType';
-declare const useFormattedAmountDue: () => string | undefined;
-declare const usePaymentType: () => PaymentType | undefined;
-declare const useIsPaying: () => boolean | undefined;
-declare const useHandlePaymentFormSubmit: () => (demoPayCardDetails?: {
-    number: string;
-    expiry: string;
-    cvc: string;
-}) => Promise<void>;
-declare const useIsSaving: () => boolean | undefined;
-declare const useIsPaid: () => boolean | undefined;
-declare const useAccountId: () => string | undefined;
-declare const IsPayButtonDisabledProvider: ({ value, children }: {
-    value: boolean | undefined;
-    children?: ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useIsPayButtonDisabled: () => boolean | undefined;
-export { useAccountId, useFormattedAmountDue, useHandlePaymentFormSubmit, useIsPaid, useIsPaying, useIsSaving, usePaymentType, useIsPayButtonDisabled, };
-export { IsPayButtonDisabledProvider };
+declare const PayableProvider: ({ value, children }: {
+    value: {
+        quoteId?: string;
+        invoiceId?: string;
+        paymentHold?: {
+            quoteId: string;
+            amountToHold: number;
+        };
+        paymentType: PaymentType;
+        amountDue: number | undefined;
+        formattedAmountDue: string | undefined;
+        isPaid: boolean;
+        setIsPaid: React.Dispatch<React.SetStateAction<boolean>>;
+        isApproved: boolean;
+        setIsApproved: React.Dispatch<React.SetStateAction<boolean>>;
+        isPaying: boolean;
+        setIsPaying: React.Dispatch<React.SetStateAction<boolean>>;
+        isApprovingHold: boolean;
+        setIsApprovingHold: React.Dispatch<React.SetStateAction<boolean>>;
+        isSaving: boolean;
+        setIsSaving: React.Dispatch<React.SetStateAction<boolean>>;
+    };
+    children?: import("react").ReactNode;
+}) => import("react/jsx-runtime").JSX.Element, usePayable: () => {
+    quoteId?: string;
+    invoiceId?: string;
+    paymentHold?: {
+        quoteId: string;
+        amountToHold: number;
+    };
+    paymentType: PaymentType;
+    amountDue: number | undefined;
+    formattedAmountDue: string | undefined;
+    isPaid: boolean;
+    setIsPaid: React.Dispatch<React.SetStateAction<boolean>>;
+    isApproved: boolean;
+    setIsApproved: React.Dispatch<React.SetStateAction<boolean>>;
+    isPaying: boolean;
+    setIsPaying: React.Dispatch<React.SetStateAction<boolean>>;
+    isApprovingHold: boolean;
+    setIsApprovingHold: React.Dispatch<React.SetStateAction<boolean>>;
+    isSaving: boolean;
+    setIsSaving: React.Dispatch<React.SetStateAction<boolean>>;
+};
+export { PayableProvider, usePayable, };
 export declare const PaymentProvider_QuoteFragment: import("gql.tada").TadaDocumentNode<{
     id: string | null;
+    currencyId: string;
     [$tada.fragmentRefs]: {
-        useHandlePayment_QuoteFragment: "Quote";
+        getQuoteAmountDue_QuoteFragment: "Quote";
     };
 }, {}, {
     fragment: "PaymentProvider_QuoteFragment";
     on: "Quote";
     masked: true;
 }>;
-export declare function PaymentProvider({ children, accountId, quote: maskedQuote, invoice, onPaymentSuccess, onPaymentHoldSuccess, paymentHoldPrecondition, paymentHoldOptions, onSavePaymentMethod, }: {
+export declare const PaymentProvider_InvoiceFragment: import("gql.tada").TadaDocumentNode<{
+    id: string | null;
+    currencyId: string;
+    amountDue: number | null;
+}, {}, {
+    fragment: "PaymentProvider_InvoiceFragment";
+    on: "Invoice";
+    masked: true;
+}>;
+export declare function PaymentProvider({ children, quote: maskedQuote, invoice: maskedInvoice, paymentHold, }: {
     children: React.ReactNode;
-    accountId?: string;
     quote: FragmentOf<typeof PaymentProvider_QuoteFragment> | undefined;
-    invoice: FormattedInvoice | Invoice | undefined;
-    onPaymentSuccess?: (response: any) => void;
-    onPaymentHoldSuccess?: (response: any) => void;
-    paymentHoldPrecondition?: () => boolean | Promise<boolean>;
-    paymentHoldOptions: {
-        payToAccept?: boolean;
-        amountToHold?: number;
-    };
-    onSavePaymentMethod?: (response: any) => void;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function StripeWrapper({ children, currencyId, accountId, }: {
-    children: React.ReactNode;
-    currencyId: string;
-    accountId?: string;
+    invoice: FragmentOf<typeof PaymentProvider_InvoiceFragment> | undefined;
+    paymentHold: {
+        quoteId: string;
+        amountToHold: number;
+    } | undefined;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/src/components/PaymentForm/fragments/PaymentForm_QuoteFragment.d.ts

@@ -0,0 +1,11 @@
+export declare const PaymentForm_QuoteFragment: import("gql.tada").TadaDocumentNode<{
+    id: string | null;
+    currencyId: string;
+    [$tada.fragmentRefs]: {
+        PaymentProvider_QuoteFragment: "Quote";
+    };
+}, {}, {
+    fragment: "PaymentForm_QuoteFragment";
+    on: "Quote";
+    masked: true;
+}>;

package/dist/cjs/types/src/components/PaymentForm/fragments/StoredPaymentMethods_PaymentMethodsFragment.d.ts

@@ -0,0 +1,13 @@
+export declare const StoredPaymentMethods_PaymentMethodsFragment: import("gql.tada").TadaDocumentNode<{
+    [$tada.fragmentRefs]: {
+        MiniCreditCard_PaymentMethodFragment: "PaymentMethod";
+    };
+    id: string;
+    plugin: {
+        id: string;
+    } | null;
+}, {}, {
+    fragment: "StoredPaymentMethods_PaymentMethodsFragment";
+    on: "PaymentMethod";
+    masked: true;
+}>;

package/dist/cjs/types/src/components/PaymentForm/hooks/usePay.d.ts

@@ -0,0 +1,14 @@
+import { PluginData } from '@/types/frontendTypes';
+type UsePayArgs = {
+    plugin: PluginData | undefined;
+    quoteId?: string | null;
+    invoiceId?: string | null;
+    onPaymentSuccess?: (response: any) => void;
+    onPaymentError?: (error: any) => void;
+};
+type UsePayResult = {
+    pay: (paymentMethodId: string) => Promise<void>;
+    isPaying: boolean;
+};
+export declare function usePay({ plugin, quoteId, invoiceId, onPaymentSuccess, onPaymentError, }: UsePayArgs): UsePayResult;
+export default usePay;

package/dist/cjs/types/src/components/PaymentForm/hooks/usePayableCurrency.d.ts

@@ -1,4 +1,4 @@
-export declare function usePayableCurrency({ payableCurrencyId, accountCurrencyId }: {
+export declare function usePayableCurrency({ payableCurrencyId, accountCurrencyId, }: {
     payableCurrencyId?: string;
     accountCurrencyId?: string;
 }): {

package/dist/cjs/types/src/components/PaymentForm/hooks/usePaymentButtonText.d.ts

@@ -1 +1,7 @@
-export declare function usePaymentButtonText(): string;
+type usePaymentButtonTextProps = {
+    isSaving?: boolean;
+    isPaying?: boolean;
+    isApprovingHold?: boolean;
+};
+export declare function usePaymentButtonText(props?: usePaymentButtonTextProps): string;
+export {};

package/dist/cjs/types/src/components/PaymentForm/hooks/usePaymentHold.d.ts

@@ -0,0 +1,18 @@
+import { PluginData } from '@/types/frontendTypes';
+type UsePaymentHoldArgs = {
+    plugin: PluginData | undefined;
+    onPaymentHoldSuccess?: (response: any) => void;
+    onPaymentHoldError?: (error: any) => void;
+};
+type UsePaymentHoldResult = {
+    approveHold: (args: {
+        quote: {
+            id: string;
+            amount: number;
+        };
+        paymentMethodId: string;
+    }) => Promise<void>;
+    isApprovingHold: boolean;
+};
+export declare function usePaymentHold({ plugin, onPaymentHoldSuccess, onPaymentHoldError, }: UsePaymentHoldArgs): UsePaymentHoldResult;
+export default usePaymentHold;

package/dist/cjs/types/src/components/PaymentForm/hooks/useSave.d.ts

@@ -0,0 +1,16 @@
+type SaveHookArgs = {
+    accountId: string | undefined;
+    onSaveSuccess?: (response: any) => void;
+    onSaveError?: (error: any) => void;
+    /**
+     * When true, invalidates the account payment methods query after a successful save.
+     * Defaults to true.
+     */
+    invalidatePaymentMethodsQuery?: boolean;
+};
+type SaveHookResult = {
+    save: () => Promise<string | undefined>;
+    isSaving: boolean;
+};
+export declare function useSave({ accountId, onSaveSuccess, onSaveError, invalidatePaymentMethodsQuery, }: SaveHookArgs): SaveHookResult;
+export default useSave;

package/dist/cjs/types/src/components/PaymentForm/types/PaymentType.d.ts

@@ -1,5 +1,6 @@
 export declare enum PaymentType {
     PAY = "PAY",
     APPROVE_HOLD = "APPROVE_HOLD",
-    CHECKOUT_NO_PAYMENT = "CHECKOUT_NO_PAYMENT"
+    CHECKOUT_NO_PAYMENT = "CHECKOUT_NO_PAYMENT",
+    SAVE = "SAVE"
 }

package/dist/cjs/types/src/components/Quote/Quote.d.ts

@@ -1,9 +1,36 @@
+import { ResultOf } from 'gql.tada';
 import { InvoiceQuoteContextProps } from '../../contexts/InvoiceQuoteContext';
-export declare const MarkupContainer: any;
+export declare const Quote_PaymentHoldFragment: import("gql.tada").TadaDocumentNode<{
+    quote: {
+        currentPaymentHold: {
+            [$tada.fragmentRefs]: {
+                PaymentHoldDisplay_QuoteButtonsFragment: "PaymentHold";
+            };
+        } | null;
+        firstInvoice: {
+            id: string | null;
+        } | null;
+    };
+}, {}, {
+    fragment: "Quote_PaymentHoldFragment";
+    on: "FormattedQuote";
+    masked: true;
+}>;
+declare const OnQuoteLoadedFragment: import("gql.tada").TadaDocumentNode<{
+    vendorName: string | null;
+    quote: {
+        id: string | null;
+    };
+}, {}, {
+    fragment: "OnQuoteLoadedFragment";
+    on: "FormattedQuote";
+    masked: true;
+}>;
 type QuoteProps = InvoiceQuoteContextProps & {
     onQuoteAccepted?: () => void;
     onQuoteUnavailableError?: () => void;
     suppressQuoteUnavailableErrorNotification?: boolean;
+    onQuoteLoaded?: (formattedQuote: ResultOf<typeof OnQuoteLoadedFragment>) => void;
 };
 export default function Quote({ id, invoiceQuoteViewComponent, onInvoiceDownloadError, onPaymentSuccess, shadow, className, hideDownloadButton, onQuoteLoaded, onQuoteAccepted, onQuoteUnavailableError, suppressQuoteUnavailableErrorNotification, }: QuoteProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/cjs/types/src/components/Quote/components/PaymentHoldDisplay.d.ts

@@ -0,0 +1,18 @@
+import { FragmentOf } from 'gql.tada';
+export declare const PaymentHoldDisplay_PaymentHoldFragment: import("gql.tada").TadaDocumentNode<{
+    expiresAt: unknown;
+    paymentMethod: {
+        metadata: {
+            identifier: string | null;
+        } | null;
+    } | null;
+}, {}, {
+    fragment: "PaymentHoldDisplay_PaymentHoldFragment";
+    on: "PaymentHold";
+    masked: true;
+}>;
+export declare function PaymentHoldDisplay({ paymentHold: maskedPaymentHold, currency, amount, }: {
+    paymentHold: FragmentOf<typeof PaymentHoldDisplay_PaymentHoldFragment>;
+    currency: string | null;
+    amount: number;
+}): import("react/jsx-runtime").JSX.Element;