@bunnyapp/components 1.8.6 → 2.0.0-beta.2

package/dist/cjs/types/src/components/Subscriptions/Subscriptions.rules.d.ts

@@ -0,0 +1,67 @@
+import type { ResolvedVariables } from '../../ui/appearance/variables';
+export declare function subscriptionsRules(v: ResolvedVariables): {
+    internal: {
+        '.AddonLine': {
+            backgroundColor: string;
+        };
+        '.SubscriptionList .Heading': {
+            fontSize: string;
+        };
+        '.SubscriptionList .Overline': {
+            fontWeight: string;
+        };
+        '.SubscriptionList .Checkbox': {
+            borderWidth: string;
+        };
+        '.QuantityGrid .Divider': {
+            margin: string;
+        };
+        '.QuantityGrid .Heading': {
+            fontSize: string;
+            lineHeight: string;
+        };
+        '.QuantityGrid .Overline': {
+            fontSize: string;
+            lineHeight: string;
+        };
+        '.Text.QuantityChargeName': {
+            textTransform: string;
+        };
+        '.Text.DrawerDescription': {
+            fontWeight: string;
+        };
+        '.Heading.EmptyMessage': {
+            fontSize: string;
+            fontWeight: string;
+        };
+        '.UsageTooltip': {
+            borderRadius: string;
+            backgroundColor: string;
+            boxShadow: string;
+        };
+        '.TierRow': {
+            padding: string;
+            borderTop: string;
+        };
+        '.HeaderModal': {
+            padding: string;
+            overflow: string;
+        };
+        '.HeaderModalBand': {
+            backgroundColor: string;
+        };
+        '.Subscriptions .ButtonSecondary--compact': {
+            padding: string;
+        };
+    };
+    public: {
+        '.Subscriptions .ButtonSecondary': {
+            borderWidth: string;
+        };
+        '.Subscriptions': {
+            color: string;
+            fontFamily: string;
+            fontSize: string;
+        };
+    };
+};

package/dist/cjs/types/src/components/Subscriptions/Subscriptions.stories.d.ts

@@ -5,8 +5,6 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Mobile: Story;
-export declare const NoShadow: Story;
-export declare const CustomClassName: Story;
-export declare const DarkMode: Story;
 export declare const PreviewMode: Story;
-export declare const PreviewModeWithClassName: Story;
+export declare const Ledger: Story;
+export declare const Midnight: Story;

package/dist/cjs/types/src/components/Subscriptions/SubscriptionsListContainer.d.ts

@@ -14,5 +14,5 @@ declare const SubscriptionsListContainer: ({ companyName, showInactive, noSubscr
     noSubscriptionsComponent?: React.ReactNode;
     subscriptions: FragmentOf<typeof SubscriptionsListContainer_SubscriptionFragment>[];
     subscriptionsAreLoading: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default SubscriptionsListContainer;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/NextPriceListButton.d.ts

@@ -5,5 +5,5 @@ declare const NextPriceListButton: ({ availablePriceLists, priceListStart, setPr
     numberOfPlansToDisplay: number;
     priceListStart: number;
     setPriceListStart: Dispatch<SetStateAction<number>>;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default NextPriceListButton;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/PlanPicker.d.ts

@@ -3,5 +3,5 @@ declare const PlanPicker: ({ onGoBack, areSubscriptionsLoading, subscriptions, }
     onGoBack?: () => void;
     areSubscriptionsLoading: boolean;
     subscriptions: Subscription[];
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default PlanPicker;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/PriceListGrid.d.ts

@@ -15,5 +15,5 @@ type PriceListGridProps = {
     selectedBillingPeriod: BillingPeriod | null;
     onClickPriceListCard: (priceList: PriceList) => void;
 };
-declare const PriceListGrid: ({ availablePriceLists, priceListChangeOptions, priceListStart, selectedPriceList, selectedProduct, setPriceListStart, subscriptions, selectedBillingPeriod, onClickPriceListCard, }: PriceListGridProps) => import("react/jsx-runtime").JSX.Element;
+declare const PriceListGrid: ({ availablePriceLists, priceListChangeOptions, priceListStart, selectedPriceList, selectedProduct, setPriceListStart, subscriptions, selectedBillingPeriod, onClickPriceListCard, }: PriceListGridProps) => import("react").JSX.Element;
 export default PriceListGrid;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/CheckoutBarInput/CheckoutBarInput.d.ts

@@ -5,5 +5,5 @@ declare const CheckoutBarInput: ({ disabled, priceListCharge: maskedPriceListCha
     priceListCharge: FragmentOf<typeof CheckoutBarInput_PriceListChargeFragment>;
     quantity: number | undefined;
     onQuantityChanged: (quantity: number) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default CheckoutBarInput;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/CheckoutBarSummarySection.d.ts

@@ -1,5 +1,6 @@
 import PriceList from '@/types/PriceList';
 export declare const CheckoutBarSummarySection_QuoteFragment: import("gql.tada").TadaDocumentNode<{
+    accountId: string;
     quoteChanges: {
         charges: {
             id: string | null;
@@ -16,5 +17,5 @@ export declare const CheckoutBarSummarySection_QuoteFragment: import("gql.tada")
 declare const CheckoutBarSummarySection: ({ selectedPriceList, onClickCheckout, }: {
     selectedPriceList: PriceList;
     onClickCheckout: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default CheckoutBarSummarySection;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/CheckoutButton.d.ts

@@ -3,5 +3,5 @@ declare const CheckoutButton: ({ disabled, onClickCheckout, loading, tooltipText
     onClickCheckout: () => void;
     loading: boolean;
     tooltipText?: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default CheckoutButton;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/CheckoutPrice.d.ts

@@ -2,10 +2,9 @@ import PriceList from '@/types/PriceList';
 import { FragmentOf } from 'gql.tada';
 export declare const CheckoutPrice_QuoteFragment: import("gql.tada").TadaDocumentNode<{
     periodAmount: number | null;
-    amountDue: number | null;
     quoteChanges: {
         charges: {
-            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;
             chargeType: "ONE_TIME" | "RECURRING" | "USAGE" | null;
         }[];
     }[] | null;
@@ -17,5 +16,5 @@ export declare const CheckoutPrice_QuoteFragment: import("gql.tada").TadaDocumen
 declare const CheckoutPrice: ({ quote: maskedQuote, selectedPriceList, }: {
     quote?: FragmentOf<typeof CheckoutPrice_QuoteFragment>;
     selectedPriceList: PriceList;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default CheckoutPrice;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/PlanPickerCheckoutBar.d.ts

@@ -1,7 +1,6 @@
 import PriceList from '@/types/PriceList';
-declare const PlanPickerCheckoutBar: ({ selectedPriceList, handlePortalErrors, onCheckoutSuccess, }: {
+declare const PlanPickerCheckoutBar: ({ selectedPriceList, onClickCheckout, }: {
     selectedPriceList: PriceList;
-    handlePortalErrors?: (errors: any) => void;
-    onCheckoutSuccess: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
+    onClickCheckout: () => void;
+}) => import("react").JSX.Element;
 export default PlanPickerCheckoutBar;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/checkoutBar/fragments/PlanPickerCheckoutBar_QuoteFragment.d.ts

@@ -1,7 +1,5 @@
 export declare const PlanPickerCheckoutBar_QuoteFragment: import("gql.tada").TadaDocumentNode<{
-    [$tada.fragmentRefs]: {
-        Checkout_QuoteFragment: "Quote";
-    };
+    id: string | null;
     quoteChanges: {
         priceList: {
             id: string;
@@ -12,7 +10,6 @@ export declare const PlanPickerCheckoutBar_QuoteFragment: import("gql.tada").Tad
             } | null;
         }[];
     }[] | null;
-    id: string | null;
 }, {}, {
     fragment: "PlanPickerCheckoutBar_QuoteFragment";
     on: "Quote";

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/BillingPeriodSelector.d.ts

@@ -8,5 +8,5 @@ declare const BillingPeriodSelector: ({ availableBillingPeriods, onChangeBilling
     selectedBillingPeriod: BillingPeriod | null;
     selectedProduct?: Product;
     onChangeProduct: (product: Product) => void;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default BillingPeriodSelector;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/EverythingPlanFeatures.d.ts

@@ -6,5 +6,5 @@ declare const EverythingPlanFeatures: ({ displayPriceLists, selectedProduct, pla
     selectedProduct?: Product;
     hideBorder?: boolean;
     className?: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default EverythingPlanFeatures;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/FeatureGridCell.d.ts

@@ -3,5 +3,5 @@ declare const FeatureGridCell: ({ children, isFeatureGroup, noBorder, rowIndex,
     isFeatureGroup?: boolean;
     noBorder?: boolean;
     rowIndex: number;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default FeatureGridCell;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/GridTemplateColumnsWrapper.d.ts

@@ -4,5 +4,5 @@ export declare function GridTemplateColumnsWrapper({ children, className, everyt
     everythingInPlus: boolean;
     plansToDisplay: number;
     style?: React.CSSProperties;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 export default GridTemplateColumnsWrapper;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanFeatures/PlanFeatures.d.ts

@@ -4,5 +4,5 @@ export declare const PlanFeatures: ({ displayPriceLists, features, plansToDispla
     displayPriceLists: PriceList[];
     plansToDisplay: number;
     features?: Feature[];
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PlanFeatures;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanFeatures/components/FeatureGroup.d.ts

@@ -5,5 +5,5 @@ declare const FeatureGroup: ({ features, displayPriceLists, plansToDisplay, grou
     displayPriceLists: PriceList[];
     plansToDisplay: number;
     groupIndex: number;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default FeatureGroup;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanFeatures/components/FeatureTitle.d.ts

@@ -2,5 +2,5 @@ import Feature from '@/types/Feature';
 declare const FeatureTitle: ({ isFeatureGroup, feature, }: {
     isFeatureGroup: boolean;
     feature: Feature;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default FeatureTitle;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PlanPickerGridCell.d.ts

@@ -2,5 +2,5 @@ export declare const PLAN_GRID_PADDING = 4;
 declare const PlanPickerGridCell: ({ children, noBorder, }: {
     children?: React.ReactNode;
     noBorder?: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PlanPickerGridCell;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/PriceListGridDesktop.d.ts

@@ -16,5 +16,5 @@ type PriceListGridDesktopProps = {
     selectedBillingPeriod: BillingPeriod | null;
     onClickPriceListCard: (priceList: PriceList) => void;
 };
-declare const PriceListGridDesktop: ({ availablePriceLists, priceListChangeOptions, priceListStart, selectedPriceList, selectedProduct, setPriceListStart, subscriptions, trialRemainingDays, selectedBillingPeriod, onClickPriceListCard, }: PriceListGridDesktopProps) => import("react/jsx-runtime").JSX.Element;
+declare const PriceListGridDesktop: ({ availablePriceLists, priceListChangeOptions, priceListStart, selectedPriceList, selectedProduct, setPriceListStart, subscriptions, trialRemainingDays, selectedBillingPeriod, onClickPriceListCard, }: PriceListGridDesktopProps) => import("react").JSX.Element;
 export default PriceListGridDesktop;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons/FeatureAddonRow.d.ts

@@ -27,4 +27,4 @@ export declare const FeatureAddonRow_PriceListChargeFragment: import("gql.tada")
 export declare function FeatureAddonRow({ featureAddon: maskedFeatureAddon, priceList: maskedPriceList, }: {
     featureAddon: FragmentOf<typeof FeatureAddonRow_PriceListChargeFragment>;
     priceList: FragmentOf<typeof FeatureAddonRow_PriceListFragment>;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons/FeatureAddons.d.ts

@@ -12,5 +12,5 @@ declare const PlanFeatureAddons: ({ displayPriceLists: maskedDisplayPriceLists,
     displayPriceLists: FragmentOf<typeof PlanFeatureAddons_PriceListFragment>[];
     plansToDisplay: number;
     everythingInPlus: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PlanFeatureAddons;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/featureAddons/FeatureAddonsList.d.ts

@@ -26,4 +26,4 @@ export declare const FeatureAddonsList_PriceListFragment: import("gql.tada").Tad
 }>;
 export declare function FeatureAddonsList({ priceList: maskedPriceList, }: {
     priceList: FragmentOf<typeof FeatureAddonsList_PriceListFragment>;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/priceListCardDesktop/PriceListCardDesktop.d.ts

@@ -6,7 +6,7 @@ export declare const PriceListCardDesktop_PriceListFragment: import("gql.tada").
     deprecated: boolean | null;
     plan: {
         id: string;
-        pricingStyle: "PRICED" | "FREE" | "CONTACT_US";
+        pricingStyle: "FREE" | "PRICED" | "CONTACT_US";
         contactUsUrl: string | null;
         name: string;
     } | null;
@@ -35,5 +35,5 @@ declare const PriceListCardDesktop: ({ hideButton, description, disableSelectCur
     trialRemainingDays?: number;
     noBorder?: boolean;
     onClickPriceListCard?: (priceList: DeprecatedPriceList) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardDesktop;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/priceListCardDesktop/addonPlans/AddonPlans.d.ts

@@ -7,5 +7,5 @@ type PlanAddonsCardProps = {
     selectedBillingPeriod: BillingPeriod;
     className?: string;
 };
-export declare const AddonPlans: ({ selectedPriceList, subscriptions, selectedBillingPeriod, className, }: PlanAddonsCardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AddonPlans: ({ selectedPriceList, subscriptions, selectedBillingPeriod, className, }: PlanAddonsCardProps) => import("react").JSX.Element;
 export {};

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/priceListCardDesktop/addonPlans/components/AddonPlanModal.d.ts

@@ -16,4 +16,4 @@ export declare const AddonPlanModal_PriceListFragment: import("gql.tada").TadaDo
 export declare function AddonPlanModal({ onClose, priceList: maskedPriceList, }: {
     onClose: () => void;
     priceList: FragmentOf<typeof AddonPlanModal_PriceListFragment> | undefined;
-}): import("react/jsx-runtime").JSX.Element | null;
+}): import("react").JSX.Element | null;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerDesktop/priceListCardDesktop/addonPlans/components/AddonPlanRow.d.ts

@@ -22,4 +22,4 @@ export declare function AddonPlanRow({ addonPriceList: maskedAddonPriceList, sel
     selectedPriceList: DeprecatedPriceList;
     onClickSelect: () => void;
     isPurchased: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerMobile/PriceListCardMobile.d.ts

@@ -26,5 +26,5 @@ declare const PriceListCardMobile: ({ description, isPriceListCurrentSubscriptio
     trialRemainingDays?: number;
     disableOnClickPriceListCard: boolean;
     onClickPriceListCard?: (priceList: PriceList) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardMobile;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/planPickerMobile/PriceListGridMobile.d.ts

@@ -10,5 +10,5 @@ declare const PriceListGridMobile: ({ availablePriceLists, priceListChangeOption
     subscriptions?: Subscription[];
     trialRemainingDays?: number;
     onClickPriceListCard: (priceList: PriceList) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListGridMobile;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceDescription/BillingPeriodDescription.d.ts

@@ -9,5 +9,5 @@ export declare const BillingPeriodDescription_PriceListFragment: import("gql.tad
 }>;
 declare const BillingPeriodDescription: ({ priceList: maskedPriceList, }: {
     priceList: FragmentOf<typeof BillingPeriodDescription_PriceListFragment>;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default BillingPeriodDescription;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceDescription/PriceListCardPriceDescription.d.ts

@@ -26,5 +26,5 @@ export declare const PriceListCardPriceDescription_PriceListFragment: import("gq
 }>;
 declare const PriceListCardPriceDescription: ({ priceList: maskedPriceList, }: {
     priceList: FragmentOf<typeof PriceListCardPriceDescription_PriceListFragment>;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default PriceListCardPriceDescription;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCard.d.ts

@@ -26,5 +26,5 @@ declare const PriceListCard: ({ hideButton, isSelected, priceList: maskedPriceLi
     noBorder?: boolean;
     onClickPriceListCard?: (priceList: DeprecatedPriceList) => void;
     disableCurrentPlan?: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCard;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCardButton.d.ts

@@ -4,7 +4,7 @@ export declare const PriceListCardButton_PriceListFragment: import("gql.tada").T
     id: string;
     plan: {
         id: string;
-        pricingStyle: "PRICED" | "FREE" | "CONTACT_US";
+        pricingStyle: "FREE" | "PRICED" | "CONTACT_US";
         contactUsLabel: string | null;
     } | null;
 }, {}, {
@@ -26,11 +26,13 @@ export declare const PriceListCardButtonUpgradingSubscription_SubscriptionFragme
     on: "Subscription";
     masked: true;
 }>;
+/** The plan card's call to action. The card is the control, so this only labels it. */
 declare const PriceListCardButton: ({ disableSelectCurrentPlan, isPriceListCurrentSubscription, isSelected, priceList: maskedPriceList, subscriptionPlan, }: {
+    /** The card cannot be chosen (the current plan): the label looks disabled. */
     disableSelectCurrentPlan: boolean;
     isPriceListCurrentSubscription: boolean;
     isSelected: boolean;
     priceList: FragmentOf<typeof PriceListCardButton_PriceListFragment>;
     subscriptionPlan?: Subscription;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardButton;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCardDescription.d.ts

@@ -1,5 +1,5 @@
 declare const PriceListCardDescription: ({ description, className }: {
     description?: string;
     className?: string;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default PriceListCardDescription;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCardFeature.d.ts

@@ -2,5 +2,5 @@ import { PlanFeature } from '@/types/frontendTypes';
 declare const PriceListCardFeature: ({ index, planFeature, }: {
     index: number;
     planFeature: PlanFeature;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardFeature;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCardPrice.d.ts

@@ -8,8 +8,10 @@ export declare const PriceListCardPrice_PriceListFragment: import("gql.tada").Ta
     on: "PriceList";
     masked: true;
 }>;
-declare const PriceListCardPrice: ({ className, priceList: maskedPriceList, }: {
+declare const PriceListCardPrice: ({ className, display, priceList: maskedPriceList, }: {
     className?: string;
+    /** The plan's price is the large amount of its card; an add-on's is not. */
+    display?: boolean;
     priceList: FragmentOf<typeof PriceListCardPrice_PriceListFragment>;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardPrice;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListCard/PriceListCardTitle.d.ts

@@ -2,5 +2,5 @@ declare const PriceListCardTitle: ({ planName, isPriceListCurrentSubscription, t
     planName: string;
     isPriceListCurrentSubscription: boolean;
     trialRemainingDays?: number;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListCardTitle;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/BackButton.d.ts

@@ -1,4 +1,4 @@
 export default function BackButton({ onClick, title }: {
     onClick?: () => void;
     title?: string;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PlanPicker/priceListSelector/PriceListSelector.d.ts

@@ -23,5 +23,5 @@ declare const PriceListSelector: ({ arePlanChangeOptionsLoading, areSubscription
     priceListChangeOptions: PriceListChangeOptions;
     subscriptions: Subscription[];
     onGoBack?: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 export default PriceListSelector;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/PreviewModeAdvisary.d.ts

@@ -1,4 +1,4 @@
 declare const PreviewModeAdvisary: ({ isInPreviewMode }: {
     isInPreviewMode: boolean;
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default PreviewModeAdvisary;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/Upgrade.d.ts

@@ -1,4 +1,5 @@
-declare const UpgradeWrapper: ({ onChangePlanCancel, handlePortalErrors, onPaymentMethodSaved, onPaymentMethodRemoved, upgradingSubscriptionId, isInPreviewMode, productId, className, shadow, defaultBillingPeriod, }: {
+import { type Appearance } from '../../../ui/appearance';
+declare const UpgradeWrapper: ({ onChangePlanCancel, handlePortalErrors, onPaymentMethodSaved, onPaymentMethodRemoved, upgradingSubscriptionId, isInPreviewMode, productId, className, style, appearance, defaultBillingPeriod, }: {
     onChangePlanCancel?: () => void;
     handlePortalErrors?: (error: any) => void;
     onPaymentMethodSaved?: (paymentMethodId: string) => void;
@@ -7,10 +8,13 @@ declare const UpgradeWrapper: ({ onChangePlanCancel, handlePortalErrors, onPayme
     isInPreviewMode?: boolean;
     productId?: string | undefined;
     className?: string;
-    shadow?: "none" | "sm" | "md" | "lg";
+    /** 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;
     /**
      * If provided and the billing period is available, the billing period selector will default to this value.
      */
     defaultBillingPeriod?: "ONCE" | "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL";
-}) => import("react/jsx-runtime").JSX.Element | null;
+}) => import("react").JSX.Element | null;
 export default UpgradeWrapper;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/Upgrade.rules.d.ts

@@ -0,0 +1,99 @@
+import type { RuleContext } from '../../../ui/appearance/ruleGroups';
+import type { ResolvedVariables } from '../../../ui/appearance/variables';
+export declare function upgradeRules(v: ResolvedVariables, { isMobile }: RuleContext): {
+    internal: {
+        '.FeatureGrid .Overline': {
+            fontSize: string;
+        };
+        '.PlanGrid .Card'?: {
+            border: string;
+            borderRadius: string;
+            boxShadow: string;
+        } | undefined;
+        '.PlanGrid .Card:hover'?: {
+            boxShadow: string;
+        } | undefined;
+        '.PlanGrid .Card--selected'?: {
+            borderColor: string;
+            boxShadow: string;
+        } | undefined;
+        '.ButtonIcon.PlanPager': {
+            width: string;
+            height: string;
+            margin: string;
+            borderRadius: string;
+            backgroundColor: string;
+            boxShadow: string;
+        };
+        '.ButtonIcon.PlanPager:hover': {
+            backgroundColor: string;
+        };
+        '.PlanGrid .ColumnDivider': {
+            borderLeft: string;
+        };
+        '.FeatureGrid .ColumnDivider': {
+            borderLeft: string;
+        };
+        '.FeatureCell[data-alternate="true"]': {
+            backgroundColor: string;
+        };
+        '.AddonPlanRow .Heading': {
+            fontSize: string;
+            fontWeight: string;
+        };
+        '.Overline.AddonPlansTitle': {
+            fontSize: string;
+        };
+        '.AddonPlanModal': {
+            padding: string;
+        };
+        '.PriceDescription p': {
+            margin: string;
+        };
+        '.CheckIcon': {
+            borderRadius: string;
+            backgroundColor: string;
+        };
+        '.CheckIcon path': {
+            stroke: string;
+        };
+        '.PlanGrid .Heading': {
+            fontWeight: string;
+        };
+        '.PlanGrid .Amount--display': {
+            fontWeight: string;
+        };
+        '.PlanGrid .Divider': {
+            margin: string;
+        };
+        '.PlanGrid .ButtonSecondary': {
+            borderWidth: string;
+        };
+        '.PlanGrid .ButtonSecondary--compact': {
+            padding: string;
+        };
+        '.PlanColumn': {
+            height: string;
+        };
+        'button.PlanColumn': {
+            margin: string;
+            border: string;
+            background: string;
+            color: string;
+            font: string;
+            textAlign: string;
+            cursor: string;
+        };
+        'button.PlanColumn:focus-visible': {
+            outline: string;
+            outlineOffset: string;
+        };
+    };
+    public: {
+        '.Upgrade': {
+            color: string;
+            fontFamily: string;
+            fontSize: string;
+        };
+    };
+};

package/dist/cjs/types/src/components/Subscriptions/Upgrade/Upgrade.stories.d.ts

@@ -5,8 +5,7 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Mobile: Story;
-export declare const DarkMode: Story;
-export declare const NoShadow: Story;
-export declare const CustomClassName: Story;
+export declare const ChangePlan: Story;
 export declare const DefaultBillingPeriodAnnual: Story;
-export declare const PrideTheme: Story;
+export declare const Ledger: Story;
+export declare const Midnight: Story;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/contexts/DefaultBillingPeriodContext.d.ts

@@ -1,4 +1,4 @@
 export declare const DefaultBillingPeriodProvider: ({ value, children }: {
     value: "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | undefined;
     children?: import("react").ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useDefaultBillingPeriod: () => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | undefined;
+}) => import("react").JSX.Element, useDefaultBillingPeriod: () => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | undefined;

package/dist/cjs/types/src/components/Subscriptions/Upgrade/fragments/UpgradeContent_QuoteFragment.d.ts

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

package/dist/cjs/types/src/components/Subscriptions/context/changeUpgradingSubscriptionContext.d.ts

@@ -1,5 +1,5 @@
 declare const ChangeUpgradingSubscriptionProvider: ({ value, children }: {
     value: (subscriptionId: string) => void;
     children?: import("react").ReactNode;
-}) => import("react/jsx-runtime").JSX.Element, useChangeUpgradingSubscription: () => (subscriptionId: string) => void;
+}) => import("react").JSX.Element, useChangeUpgradingSubscription: () => (subscriptionId: string) => void;
 export { ChangeUpgradingSubscriptionProvider, useChangeUpgradingSubscription };