@bunnyapp/components 1.8.5 → 2.0.0-beta.1

package/dist/esm/types/src/components/PaymentMethods/hooks/useNewPaymentMethod.d.ts

@@ -0,0 +1,16 @@
+import { PaymentPlugin } from '../utils/paymentPlugins';
+import { Payer } from './useStripePaymentMethodId';
+/** A payment method entered in the form, ready for the plugin to store: a Stripe payment method token or DemoPay's card metadata. */
+export type NewPaymentMethod = {
+    plugin: PaymentPlugin;
+    token?: string;
+    metadata?: Record<string, string>;
+};
+/**
+ * Turns what was entered in the selected plugin's payment form into something the API can store.
+ * `payer` is what the form collected itself (see `PayerFields`).
+ */
+export declare function useNewPaymentMethod(): ({ payer, accountId, }?: {
+    payer?: Payer;
+    accountId?: string;
+}) => Promise<NewPaymentMethod>;

package/dist/esm/types/src/components/PaymentMethods/hooks/useStripePaymentMethodId.d.ts

@@ -0,0 +1,27 @@
+/**
+ * The payer fields a form collects itself instead of the Payment Element: always the name and email,
+ * and the country and postal code when `address`.
+ */
+export type PayerFields = {
+    address: boolean;
+};
+/** What the form collected for `PayerFields`, passed to Stripe on confirm. */
+export type Payer = {
+    name?: string;
+    email?: string;
+    /** Only when the form has the address fields. */
+    address?: {
+        country?: string;
+        postalCode?: string;
+    };
+};
+/**
+ * Sets the payment method in the Payment Element up in the browser (SetupIntent + confirmSetup,
+ * which runs any 3DS challenge) and returns the Stripe payment method id. Without an account,
+ * Stripe's customer is provisioned from the payer's email. Every field the element was told not to
+ * collect (`payerFields`) has to come in `payer`.
+ */
+export declare function useStripePaymentMethodId(): ({ payer, accountId, }: {
+    payer?: Payer;
+    accountId?: string;
+}) => Promise<string>;

package/dist/esm/types/src/components/PaymentMethods/utils/demoPayCard.d.ts

@@ -0,0 +1,12 @@
+export declare const isDigit: (char: string) => boolean;
+export declare const isValidKey: (code: number) => boolean;
+export declare const formatCardExpiry: (cardExpiry: string) => string;
+/** A complete expiry (`MMYY`) that can't be used, so the field shows it before the card is submitted. */
+export declare const isExpiryInvalid: (expiry: string) => boolean;
+/** Removes the spaces from a card number. */
+export declare const unformatCardNumber: (cardNumber: string) => string;
+/** Throws when the DemoPay card can't be submitted. */
+export declare function validateDemoPayCard(card: {
+    expiry: string;
+    cvc: string;
+}): void;

package/dist/esm/types/src/components/PaymentMethods/utils/paymentPlugins.d.ts

@@ -0,0 +1,9 @@
+import usePaymentPlugins from '@/hooks/usePaymentPlugins';
+import { PluginData } from '@/types/frontendTypes';
+export type PaymentPlugin = ReturnType<typeof usePaymentPlugins>['paymentPlugins'][number];
+export declare const STRIPE_FRONTEND = "StripePayment";
+export declare const DEMO_PAY_FRONTEND = "DemoPayPayment";
+/** The `paymentPlugins` GraphQL row doesn't share a type with the legacy `PluginData` the plugin helpers expect. */
+export declare const asPluginData: (plugin: PaymentPlugin) => PluginData;
+export declare const pluginFrontendName: (plugin: PaymentPlugin | undefined) => string | undefined;
+export declare const isSupportedPlugin: (plugin: PaymentPlugin) => boolean;

package/dist/esm/types/src/components/PaymentMethods/utils/storeNewPaymentMethod.d.ts

@@ -0,0 +1,14 @@
+import type { NewPaymentMethod } from '../hooks/useNewPaymentMethod';
+/**
+ * Stores a payment method entered in the form on the account through its plugin. Returns the stored
+ * payment method's id and the token the plugin answers with.
+ */
+export declare function storeNewPaymentMethod({ paymentMethod, accountId, token, apiHost, }: {
+    paymentMethod: NewPaymentMethod;
+    accountId: string | undefined;
+    token?: string;
+    apiHost: string;
+}): Promise<{
+    id: string;
+    token: string | undefined;
+}>;

package/dist/esm/types/src/components/PaymentMethods/utils/stripeAppearance.d.ts

@@ -0,0 +1,12 @@
+import type { Appearance as StripeAppearance, StripeElementsOptions } from '@stripe/stripe-js';
+import type { ResolvedAppearance } from '@/ui/appearance/resolveAppearance';
+/**
+ * The resolved appearance in Stripe's terms, so the Payment Element is drawn like the form's own fields.
+ * `pageFontFamily` is the font our text inherits from the page, for when the customer set none.
+ */
+export declare function toStripeAppearance({ variables, customerVariables, rules, sharedSelectors }: ResolvedAppearance, pageFontFamily?: string): StripeAppearance;
+/** `appearance` and `fonts` for Stripe's `<Elements>`. `fonts` can't change once the group is created. */
+export declare function useStripeAppearance(): {
+    appearance: StripeAppearance;
+    fonts: NonNullable<StripeElementsOptions['fonts']>;
+};

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

@@ -1,5 +1,7 @@
 import { ResultOf } from 'gql.tada';
+import { type CSSProperties } from 'react';
 import { InvoiceQuoteContextProps } from '../../contexts/InvoiceQuoteContext';
+import { type Appearance } from '../../ui/appearance';
 export declare const Quote_PaymentHoldFragment: import("gql.tada").TadaDocumentNode<{
     quote: {
         currentPaymentHold: {
@@ -31,6 +33,10 @@ type QuoteProps = InvoiceQuoteContextProps & {
     onQuoteUnavailableError?: () => void;
     suppressQuoteUnavailableErrorNotification?: boolean;
     onQuoteLoaded?: (formattedQuote: ResultOf<typeof OnQuoteLoadedFragment>) => void;
+    /** A custom style to apply to the component */
+    style?: CSSProperties;
+    /** Restyles this component on top of `BunnyProvider`'s `appearance`. See "Styling components" in the package README. */
+    appearance?: Appearance;
 };
-export default function Quote({ id, invoiceQuoteViewComponent, onInvoiceDownloadError, onPaymentSuccess, shadow, className, hideDownloadButton, onQuoteLoaded, onQuoteAccepted, onQuoteUnavailableError, suppressQuoteUnavailableErrorNotification, }: QuoteProps): import("react/jsx-runtime").JSX.Element;
+export default function Quote({ id, invoiceQuoteViewComponent, onInvoiceDownloadError, onPaymentSuccess, className, hideDownloadButton, onQuoteLoaded, onQuoteAccepted, onQuoteUnavailableError, suppressQuoteUnavailableErrorNotification, style, appearance, }: QuoteProps): import("react").JSX.Element;
 export {};

package/dist/esm/types/src/components/Quote/Quote.rules.d.ts

@@ -0,0 +1,54 @@
+import type { ResolvedVariables } from '../../ui/appearance/variables';
+export declare function quoteRules(v: ResolvedVariables): {
+    internal: {
+        '.Quote .ButtonSecondary--compact': {
+            padding: string;
+        };
+        '.Quote .Button--compact': {
+            padding: string;
+        };
+        '.QuoteModal': {
+            borderRadius: string;
+            padding: string;
+            overflow: string;
+        };
+        '.QuoteModal.PaymentHoldModal': {
+            borderRadius: string;
+        };
+        '.QuoteModal .Field': {
+            marginBottom: string;
+        };
+        '.QuoteModal .Label': {
+            fontWeight: string;
+            paddingTop: string;
+            paddingLeft: string;
+            marginBottom: string;
+        };
+        '.QuoteModal .Input': {
+            borderWidth: string;
+        };
+        '.QuoteModal .Input--compact': {
+            padding: string;
+        };
+        '.QuoteModal .ButtonSecondary': {
+            borderWidth: string;
+        };
+        '.QuoteModal .ButtonSecondary--compact': {
+            padding: string;
+        };
+        '.QuoteModal .Button--compact': {
+            padding: string;
+        };
+    };
+    public: {
+        '.Quote .ButtonSecondary': {
+            borderWidth: string;
+            borderColor: string;
+            color: string;
+        };
+        '.Quote': {
+            color: string;
+            fontFamily: string;
+        };
+    };
+};

package/dist/esm/types/src/components/Quote/Quote.stories.d.ts

@@ -4,10 +4,8 @@ declare const meta: Meta<typeof Quote>;
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
-export declare const NoShadow: Story;
 export declare const Mobile: Story;
-export declare const CustomClassName: Story;
 export declare const HideDownloadButton: Story;
 export declare const AcceptedQuote: Story;
-export declare const AcceptedQuoteDarkMode: Story;
-export declare const DarkMode: Story;
+export declare const Ledger: Story;
+export declare const Midnight: Story;

package/dist/esm/types/src/components/Quote/components/AcceptQuoteModal.d.ts

@@ -15,5 +15,5 @@ declare const AcceptQuoteModal: ({ acceptBoxVisible, formattedQuote: maskedForma
     setAcceptBoxVisible: (visible: boolean) => void;
     setIsAccepting: (accepting: boolean) => void;
     isSendAcceptPending: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default AcceptQuoteModal;

package/dist/esm/types/src/components/Quote/components/NoSigningPluginsForm.d.ts

@@ -13,5 +13,5 @@ declare function NoSigningPluginsForm({ isVisible, formattedQuote: maskedFormatt
     isVisible: boolean;
     formattedQuote: FragmentOf<typeof NoSigningPluginsForm_FormattedQuoteFragment>;
     form: FormInstance;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export default NoSigningPluginsForm;

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

@@ -15,4 +15,4 @@ export declare function PaymentHoldDisplay({ paymentHold: maskedPaymentHold, cur
     paymentHold: FragmentOf<typeof PaymentHoldDisplay_PaymentHoldFragment>;
     currency: string | null;
     amount: number;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/esm/types/src/components/Quote/components/PaymentHoldModal.d.ts

@@ -21,5 +21,5 @@ declare const PaymentHoldModal: ({ visible, setVisible, formattedQuote: maskedFo
     setVisible: (visible: boolean) => void;
     formattedQuote: FragmentOf<typeof PaymentHoldModal_FormattedQuoteFragment>;
     sendAccept: (changedFields: any) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PaymentHoldModal;

package/dist/esm/types/src/components/Quote/components/QuoteButtons.d.ts

@@ -38,4 +38,4 @@ export declare function QuoteButtons({ isAccepted, formattedQuote: maskedFormatt
     paymentHoldCompleted: boolean;
     paymentHold: FragmentOf<typeof PaymentHoldDisplay_QuoteButtonsFragment> | undefined | null;
     isSendAcceptPending: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/esm/types/src/components/Quote/components/QuoteIsAcceptedLabel.d.ts

@@ -2,5 +2,5 @@ type QuoteIsAcceptedLabelProps = {
     acceptedByName?: string | null;
     acceptedAt: string;
 };
-declare const QuoteIsAcceptedLabel: ({ acceptedByName, acceptedAt }: QuoteIsAcceptedLabelProps) => import("react/jsx-runtime").JSX.Element;
+declare const QuoteIsAcceptedLabel: ({ acceptedByName, acceptedAt }: QuoteIsAcceptedLabelProps) => import("react").JSX.Element;
 export default QuoteIsAcceptedLabel;

package/dist/esm/types/src/components/Quote/queries/getFormattedQuote.d.ts

@@ -14,7 +14,7 @@ declare const getFormattedQuote: ({ token, apiHost, id, }: {
         }[] | null;
         firstInvoice: {
             id: string | null;
-            state: "READY" | "NOT_DUE" | "DUE" | "UNPAID" | "DRAFT" | "PREPARING" | "PAID" | "VOIDED" | "FAILED" | "PROCESSING_PAYMENT" | "MERGED" | "QUEUED" | "CONSOLIDATED";
+            state: "READY" | "NOT_DUE" | "DUE" | "UNPAID" | "DRAFT" | "PREPARING" | "PAID" | "VOIDED" | "FAILED" | "CONSOLIDATED" | "MERGED" | "PROCESSING_PAYMENT" | "QUEUED";
         } | null;
         payableId: string | null;
         id: string | null;
@@ -32,7 +32,7 @@ declare const getFormattedQuote: ({ token, apiHost, id, }: {
                 id: string;
                 isDefault: boolean | null;
                 lastSuccess: unknown;
-                paymentType: "ach" | "card" | "other" | "wire" | null;
+                paymentType: "card" | "other" | "ach" | "wire" | null;
                 pluginId: string | null;
                 state: "FAILED" | "UNKNOWN" | "SUCCESS" | null;
                 updatedAt: unknown;

package/dist/esm/types/src/components/QuoteProvider/QuoteProvider.d.ts

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

package/dist/esm/types/src/components/QuoteProvider/context/quantityEditableChargesContext.d.ts

@@ -12,7 +12,7 @@ export declare const QuantityEditableChargesProvider: ({ value, children }: {
         };
     }[];
     children?: import("react").ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useQuantityEditableChargesContext: () => {
+}) => import("react").JSX.Element, useQuantityEditableChargesContext: () => {
     deprecated: boolean | null;
     id: string;
     featureAddon: boolean | null;

package/dist/esm/types/src/components/QuoteProvider/fragments/quoteFieldsFragment.d.ts

@@ -2,7 +2,7 @@ export declare const QuoteFields_QuoteFragment: import("gql.tada").TadaDocumentN
     accountId: string;
     amount: number;
     amountDue: number | null;
-    smallUnitAmountDue: number | null;
+    smallUnitAmountDue: unknown;
     currencyId: string;
     id: string | null;
     payableId: string | null;
@@ -17,11 +17,11 @@ export declare const QuoteFields_QuoteFragment: import("gql.tada").TadaDocumentN
         amount: number | null;
         startDate: unknown;
     }[];
-    kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+    kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE";
     quoteChanges: {
         currencyId: string;
         id: string | null;
-        kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+        kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE";
         charges: {
             subtotal: number | null;
             amountsByPeriod: {
@@ -46,7 +46,7 @@ export declare const QuoteFields_QuoteFragment: import("gql.tada").TadaDocumentN
                 couponCode: string;
             } | null;
             quantity: number | null;
-            kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE" | null;
+            kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE" | null;
         }[];
         priceList: {
             id: string;

package/dist/esm/types/src/components/QuoteProvider/fragments/quoteFragment.d.ts

@@ -17,7 +17,7 @@ export declare const QuoteContext_QuoteFragment: import("gql.tada").TadaDocument
     startDate: unknown;
     quoteChanges: {
         id: string | null;
-        kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+        kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE";
         priceList: {
             id: string;
         } | null;
@@ -50,6 +50,8 @@ export declare const QuoteContext_QuoteFragment: import("gql.tada").TadaDocument
         useQuantityEditableCharges_QuoteFragment: "Quote";
     } & {
         useChargeCRUD_QuoteFragment: "Quote";
+    } & {
+        UpgradeContent_QuoteFragment: "Quote";
     };
 }, {}, {
     fragment: "QuoteContext_QuoteFragment";

package/dist/esm/types/src/components/QuoteProvider/fragments/useQuantityEditableCharges_QuoteFragment.d.ts

@@ -1,6 +1,6 @@
 export declare const useQuantityEditableCharges_QuoteFragment: import("gql.tada").TadaDocumentNode<{
     quoteChanges: {
-        kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+        kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE";
         charges: {
             priceListCharge: {
                 deprecated: boolean | null;

package/dist/esm/types/src/components/QuoteProvider/hooks/useQuoteCreate.d.ts

@@ -5,7 +5,7 @@ export declare const useQuoteCreate_SubscriptionFragment: import("gql.tada").Tad
     priceList: {
         id: string;
     } | null;
-    state: "ACTIVE" | "TRIAL" | "CANCELED" | "EXPIRED" | "TRIAL_EXPIRED" | "PENDING";
+    state: "PENDING" | "ACTIVE" | "TRIAL" | "EXPIRED" | "CANCELED" | "TRIAL_EXPIRED";
 }, {}, {
     fragment: "useQuoteCreate_SubscriptionFragment";
     on: "Subscription";
@@ -16,7 +16,7 @@ export declare const useQuoteCreate: ({ maskedUpgradingSubscription, selectedPri
     selectedPriceList?: PriceList;
     token?: string;
 }) => {
-    quote: {
+    quote: NoInfer<{
         [$tada.fragmentRefs]: {
             QuoteContext_QuoteFragment: "Quote";
         };
@@ -26,6 +26,6 @@ export declare const useQuoteCreate: ({ maskedUpgradingSubscription, selectedPri
         } & {
             FormattedQuoteFields_QuoteFragment: "Quote";
         };
-    } | null | undefined;
+    } | null> | undefined;
     isQuotePending: boolean;
 };

package/dist/esm/types/src/components/QuoteProvider/hooks/useSelectedPriceListQuoteChange.d.ts

@@ -13,7 +13,7 @@ export declare const useSelectedPriceListQuoteChange_QuoteChangeFragment: import
     priceList: {
         id: string;
     } | null;
-    kind: "SUBSCRIBE" | "UPDATE" | "RENEW" | "REINSTATE" | "UNSUBSCRIBE" | "ADJUSTMENT" | "COUPON" | "DISCOUNT" | "PERCENTAGE_DISCOUNT" | "CREDIT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "FREE_PERIOD_DISCOUNT" | "ACTIVATE";
+    kind: "ACTIVATE" | "ADJUSTMENT" | "COUPON" | "CREDIT" | "DISCOUNT" | "FREE_PERIOD_DISCOUNT" | "PERCENTAGE_DISCOUNT" | "PRICE_UPDATE" | "QUANTITY_UPDATE" | "REINSTATE" | "RENEW" | "SUBSCRIBE" | "UNSUBSCRIBE" | "UPDATE";
 }, {}, {
     fragment: "useSelectedPriceListQuoteChange_QuoteChangeFragment";
     on: "QuoteChange";

package/dist/esm/types/src/components/Signup/Signup.d.ts

@@ -1,29 +1,4 @@
-import type { FormInstance } from "antd/es/form";
-import { type DefaultSignupValues, InitialSignupFormData, type RequiredBillingDetailsFlags } from "./components/InitialSignupFormFields";
-export type SignupProps = {
-    priceListCode: string;
-    /** If trial is allowed on priceList, enableTrial will enable the trial for the signup */
-    enableTrial?: boolean;
-    /** A custom style to apply to the component */
-    style?: React.CSSProperties;
-    /** The default form values to use for the signup */
-    defaultFormValues?: DefaultSignupValues;
-    /** Whether to require quote acceptance before checking out */
-    paymentRequiredToAcceptQuote?: boolean;
-    /** The document template ID to apply to the quote for the signup */
-    documentTemplateId?: string;
-    /** Which account billing fields to show and require */
-    requiredBillingDetails?: RequiredBillingDetailsFlags;
-    /** A default coupon code to pre-apply to the checkout */
-    defaultCouponCode?: string;
-};
-declare const useSignupPortalSessionToken: () => [string | undefined, import("react").Dispatch<import("react").SetStateAction<string | undefined>>];
-declare const useSignupAccountId: () => [string | undefined, import("react").Dispatch<import("react").SetStateAction<string | undefined>>];
-declare const useSignupPurchaseSucceeded: () => [boolean, import("react").Dispatch<import("react").SetStateAction<boolean>>];
-declare const useSignupForm: () => FormInstance<InitialSignupFormData>;
-declare const useSignupOptions: () => {
-    enableTrial: boolean;
-    paymentRequiredToAcceptQuote?: boolean;
-};
-export default function Signup({ priceListCode, enableTrial, style, defaultFormValues, paymentRequiredToAcceptQuote, documentTemplateId, requiredBillingDetails, defaultCouponCode, }: SignupProps): import("react/jsx-runtime").JSX.Element;
-export { useSignupAccountId, useSignupForm, useSignupOptions, useSignupPortalSessionToken, useSignupPurchaseSucceeded };
+import { CheckoutFlowProps } from '../CheckoutShared/components/CheckoutRoot';
+export type SignupProps = CheckoutFlowProps;
+/** Self-service signup: creates the account and its first subscription in one click. Needs an API client token with the signup scopes. */
+export default function Signup({ style, ...props }: SignupProps): import("react").JSX.Element;

package/dist/esm/types/src/components/Signup/Signup.stories.d.ts

@@ -4,5 +4,7 @@ declare const meta: Meta<typeof Signup>;
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
+export declare const DisabledFields: Story;
 export declare const Mobile: Story;
-export declare const DarkMode: Story;
+export declare const Ledger: Story;
+export declare const Midnight: Story;

package/dist/esm/types/src/components/Signup/SignupContent.d.ts

@@ -1,2 +1,7 @@
-import type { SignupProps } from './Signup';
-export declare function SignupContent({ priceListCode, defaultFormValues, documentTemplateId, requiredBillingDetails, style, defaultCouponCode, }: SignupProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * What makes the screen a signup: there is no account or quote yet, so the coupon is held locally
+ * until the signup sends it along with everything else.
+ */
+export declare function SignupContent({ style }: {
+    style?: React.CSSProperties;
+}): import("react").JSX.Element;

package/dist/esm/types/src/components/Signup/components/SignupCheckoutForm.d.ts

@@ -0,0 +1,2 @@
+/** The checkout form wired to the signup: one click creates the account and checks out. */
+export default function SignupCheckoutForm(): import("react").JSX.Element;

package/dist/esm/types/src/components/Signup/graphql/mutations/quoteAccountSignup.d.ts

@@ -0,0 +1,76 @@
+import { VariablesOf } from 'gql.tada';
+declare const mutation: import("gql.tada").TadaDocumentNode<{
+    quoteAccountSignup: {
+        account: {
+            id: string;
+        } | null;
+        quote: {
+            [$tada.fragmentRefs]: {
+                CheckoutResult_QuoteFragment: "Quote";
+            };
+        } | null;
+        portalSessionToken: string | null;
+        errors: string[] | null;
+    } | null;
+}, {
+    paymentMethod?: {
+        token?: string | null | undefined;
+        pluginGuid: string;
+        metadata?: unknown;
+    } | null | undefined;
+    trial?: boolean | null | undefined;
+    couponCode?: string | null | undefined;
+    billingDetails?: {
+        taxNumber?: string | null | undefined;
+        billingZip?: string | null | undefined;
+        billingStreet?: string | null | undefined;
+        billingState?: string | null | undefined;
+        billingCountry?: string | null | undefined;
+        billingContactEmail?: string | null | undefined;
+        billingCity?: string | null | undefined;
+    } | null | undefined;
+    billingContact?: {
+        title?: string | null | undefined;
+        salutation?: string | null | undefined;
+        portalAccess?: boolean | null | undefined;
+        phone?: string | null | undefined;
+        mobile?: string | null | undefined;
+        mailingZip?: string | null | undefined;
+        mailingStreet?: string | null | undefined;
+        mailingState?: string | null | undefined;
+        mailingCountry?: string | null | undefined;
+        mailingCity?: string | null | undefined;
+        linkedinUrl?: string | null | undefined;
+        lastName?: string | null | undefined;
+        firstName?: string | null | undefined;
+        email?: string | null | undefined;
+        description?: string | null | undefined;
+        code?: string | null | undefined;
+        campaignCode?: string | null | undefined;
+        accountId?: string | null | undefined;
+        accountCode?: string | null | undefined;
+    } | null | undefined;
+    accountName?: string | null | undefined;
+    priceListCode: string;
+}, void>;
+export type QuoteAccountSignupVariables = VariablesOf<typeof mutation>;
+/**
+ * Creates the account, quote and payment method, charges it and checks the quote out in one
+ * transaction. Nothing is created when it fails.
+ */
+declare const quoteAccountSignup: ({ token, apiHost, ...variables }: QuoteAccountSignupVariables & {
+    token?: string;
+    apiHost: string;
+}) => Promise<{
+    account: {
+        id: string;
+    } | null;
+    quote: {
+        [$tada.fragmentRefs]: {
+            CheckoutResult_QuoteFragment: "Quote";
+        };
+    } | null;
+    portalSessionToken: string | null;
+    errors: string[] | null;
+} | null>;
+export default quoteAccountSignup;

package/dist/esm/types/src/components/Signup/hooks/useSignupCheckout.d.ts

@@ -0,0 +1,11 @@
+/**
+ * One-click signup. The server creates the account, quote and payment method, charges and checks
+ * out in a single transaction, so a failed attempt leaves nothing behind and can simply be retried.
+ *
+ * Stripe cards are set up in the browser first (against a customer provisioned from the email),
+ * then the payment method id is sent along.
+ */
+export declare function useSignupCheckout(): {
+    submit: (values: import("../../CheckoutShared/contexts/CheckoutConfigContext").CheckoutFormValues) => void;
+    isProcessing: boolean;
+};

package/dist/esm/types/src/components/Signup/index.d.ts

@@ -1 +1,2 @@
-export { default as Signup } from "./Signup";
+export { default as Signup } from './Signup';
+export type { SignupProps } from './Signup';

package/dist/esm/types/src/components/StateTag.d.ts

@@ -1,4 +1,4 @@
 declare const StateTag: ({ state }: {
     state: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default StateTag;

package/dist/esm/types/src/components/Subscriptions/AddonSubscriptionCards.d.ts

@@ -1,7 +1,7 @@
 import { FragmentOf } from 'gql.tada';
 export declare const AddonSubscriptionsCards_SubscriptionFragment: import("gql.tada").TadaDocumentNode<{
     id: string;
-    state: "ACTIVE" | "TRIAL" | "CANCELED" | "EXPIRED" | "TRIAL_EXPIRED" | "PENDING";
+    state: "PENDING" | "ACTIVE" | "TRIAL" | "EXPIRED" | "CANCELED" | "TRIAL_EXPIRED";
     [$tada.fragmentRefs]: {
         SubscriptionCardDesktop_SubscriptionFragment: "Subscription";
     } & {
@@ -16,4 +16,4 @@ export declare function AddonSubscriptionsCards({ subscriptions: maskedSubscript
     subscriptions: FragmentOf<typeof AddonSubscriptionsCards_SubscriptionFragment>[];
     subscription: FragmentOf<typeof AddonSubscriptionsCards_SubscriptionFragment>;
     showInactive: boolean;
-}): import("react/jsx-runtime").JSX.Element | null;
+}): import("react").JSX.Element | null;

package/dist/esm/types/src/components/Subscriptions/CheckIcon.d.ts

@@ -1,5 +1,5 @@
-declare const CheckIcon: ({ backgroundColor, size, }: {
-    backgroundColor: string;
+/** A round tick in the primary color (`.CheckIcon`). */
+declare const CheckIcon: ({ size }: {
     size: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default CheckIcon;

package/dist/esm/types/src/components/Subscriptions/Subscriptions.d.ts

@@ -1,19 +1,19 @@
-declare const SubscriptionsWrapper: ({ handlePortalErrors, companyName, isInPreviewMode, productId, className, styles: userStyles, noSubscriptionsComponent, showInactiveSubscriptions, showInactiveSubscriptionsToggle, onPaymentMethodSaved, onPaymentMethodRemoved, onSubscriptionUpgradeClick, }: {
+import { type Appearance } from '../../ui/appearance';
+declare const SubscriptionsWrapper: ({ handlePortalErrors, companyName, isInPreviewMode, productId, className, style, appearance, noSubscriptionsComponent, showInactiveSubscriptions, showInactiveSubscriptionsToggle, onPaymentMethodSaved, onPaymentMethodRemoved, onSubscriptionUpgradeClick, }: {
     handlePortalErrors?: (errors: any) => void;
     companyName: string;
     isInPreviewMode?: boolean;
     productId?: string;
     className?: string;
-    styles?: {
-        gap?: number;
-        shadow?: "none" | "sm" | "md" | "lg";
-        subscriptionProductNameStyle?: React.CSSProperties;
-    };
+    /** A custom style to apply to the component */
+    style?: React.CSSProperties;
+    /** Restyles this component on top of `BunnyProvider`'s `appearance`. See "Styling components" in the package README. */
+    appearance?: Appearance;
     noSubscriptionsComponent?: React.ReactNode;
     showInactiveSubscriptions?: boolean;
     showInactiveSubscriptionsToggle?: boolean;
     onPaymentMethodSaved?: (paymentMethodId: string) => void;
     onPaymentMethodRemoved?: (paymentMethodId: string) => void;
     onSubscriptionUpgradeClick?: (subscriptionId: string) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default SubscriptionsWrapper;