@bunnyapp/components 1.7.0-beta.33 → 1.7.0-beta.34

package/dist/cjs/index.js

@@ -1283,7 +1283,7 @@ const DEFAULT_CONFIG = {
 };
 
 // This will be replaced at build time by rollup-plugin-replace
-const PACKAGE_VERSION = '1.7.0-beta.32';
+const PACKAGE_VERSION = '1.7.0-beta.33';
 const createRequestHeaders = (token) => {
     const headers = createClientDevHeaders({ token });
     // Add the components version header
@@ -2264,7 +2264,11 @@ const getBranding = async ({ token, apiHost }) => {
 const BunnyContext = react.createContext({});
 // Every component shares similar props and functionality, which this wrapper handles.
 function BunnyProvider({ children, darkMode = false, queryClient, apiHost, token, onTokenExpired, onUserUnavailable, onInvalidOrMissingAuthorization, suppressUserUnavailableErrorNotification = false, configProviderProps, }) {
-    return (jsxRuntime.jsx(BunnyProviderCallbacksProvider, { value: { onUserUnavailable, onInvalidOrMissingAuthorization, suppressUserUnavailableErrorNotification }, children: jsxRuntime.jsx(BunnyProviderContent, { darkMode: darkMode, queryClient: queryClient, apiHost: apiHost, token: token, onTokenExpired: onTokenExpired, configProviderProps: configProviderProps, children: children }) }));
+    return (jsxRuntime.jsx(BunnyProviderCallbacksProvider, { value: {
+            onUserUnavailable,
+            onInvalidOrMissingAuthorization,
+            suppressUserUnavailableErrorNotification,
+        }, children: jsxRuntime.jsx(BunnyProviderContent, { darkMode: darkMode, queryClient: queryClient, apiHost: apiHost, token: token, onTokenExpired: onTokenExpired, configProviderProps: configProviderProps, children: children }) }));
 }
 function BunnyProviderContent({ children, darkMode = false, queryClient, apiHost, token, onTokenExpired, configProviderProps, }) {
     const createQueryClient = useCreateQueryClient();
@@ -25375,13 +25379,18 @@ const QuoteContext = react.createContext({});
 const BillingPeriodSelector = ({ availableBillingPeriods, onChangeBillingPeriod, products, selectedBillingPeriod, selectedProduct, onChangeProduct, }) => {
     const { secondaryColor, brandColor } = useBrand();
     const isMobile = useIsMobile();
+    const { isInPreviewMode } = useSubscriptionProps();
     if (!availableBillingPeriods || (availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.length) < 2)
         return null;
     return (jsxRuntime.jsxs("div", { className: "bunny-flex bunny-items-center bunny-gap-8", children: [(products === null || products === void 0 ? void 0 : products.length) && products.length > 1 && (jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-2", children: [jsxRuntime.jsx("div", { className: "bunny-font-medium bunny-text-xs", style: {
                             color: secondaryColor,
                         }, children: "Select product" }), jsxRuntime.jsx(ProductRadioStyled, { brandColor: brandColor, children: jsxRuntime.jsx(antd.Radio.Group, { onChange: e => {
+                                if (isInPreviewMode)
+                                    return;
                                 onChangeProduct(products === null || products === void 0 ? void 0 : products.find(product => product.id === e.target.value));
                             }, value: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id, buttonStyle: "solid", children: jsxRuntime.jsx(antd.Space, { className: "bunny-gap-2", children: products === null || products === void 0 ? void 0 : products.map(product => (jsxRuntime.jsx(antd.Radio.Button, { value: product.id, children: product.name }, product.id))) }) }) })] })), jsxRuntime.jsx("div", { className: "bunny-flex bunny-flex-col bunny-w-full bunny-gap-2", children: jsxRuntime.jsx(StyledRadioGroup, { className: "bunny-w-full", "$isMobile": isMobile, children: jsxRuntime.jsx(antd.Radio.Group, { onChange: e => {
+                            if (isInPreviewMode)
+                                return;
                             onChangeBillingPeriod(e.target.value);
                         }, value: selectedBillingPeriod, size: "small", buttonStyle: "solid", children: availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.map((periodMonth, index) => {
                             return (jsxRuntime.jsx(antd.Radio.Button, { value: periodMonthsConverter(periodMonth), children: periodMonthsConverter(periodMonth) }, index));
@@ -25970,10 +25979,14 @@ const PriceListCardDesktop_PriceListFragment = t(`
 ]);
 const PriceListCardDesktop = ({ hideButton, description, disableSelectCurrentPlan, feature, isPriceListCurrentSubscription, isSelected, priceList: maskedPriceList, subscriptionPlan, trialRemainingDays, noBorder, onClickPriceListCard, }) => {
     var _a, _b, _c, _d;
+    // Context
+    const { isInPreviewMode } = useSubscriptionProps();
     // Read fragments
     const priceList = readFragment(PriceListCardDesktop_PriceListFragment, maskedPriceList);
     return (jsxRuntime.jsx(PlanPickerGridCell, { noBorder: noBorder, children: jsxRuntime.jsxs("div", { className: `bunny-flex bunny-flex-col bunny-items-start bunny-justify-between bunny-w-full bunny-rounded-md bunny-gap-4 bunny-pt-4 bunny-px-4 ${disableSelectCurrentPlan ? '' : 'cursor-pointer'} bunny-box-border`, onClick: () => {
                 var _a, _b, _c;
+                if (isInPreviewMode)
+                    return;
                 if (!disableSelectCurrentPlan) {
                     if (((_a = priceList.plan) === null || _a === void 0 ? void 0 : _a.pricingStyle) === t.scalar('PlanPricingStyles', 'CONTACT_US')) {
                         window.open((_c = (_b = priceList.plan) === null || _b === void 0 ? void 0 : _b.contactUsUrl) !== null && _c !== void 0 ? _c : undefined, '_blank');
@@ -26015,9 +26028,12 @@ const PriceListCardMobile = ({ description, feature, isPriceListCurrentSubscript
     var _a, _b;
     // Context
     const { brandColor } = useBrand();
+    const { isInPreviewMode } = useSubscriptionProps();
     // Read fragments
     const priceList = readFragment(PriceListCardMobile_PriceListFragment, maskedPriceList);
     return (jsxRuntime.jsxs("div", { className: `bunny-relative bunny-flex bunny-flex-col bunny-border-2 bunny-border-solid bunny-rounded-lg bunny-p-4`, onClick: () => {
+            if (isInPreviewMode)
+                return;
             if (!disableOnClickPriceListCard)
                 onClickPriceListCard === null || onClickPriceListCard === void 0 ? void 0 : onClickPriceListCard(priceList);
         }, style: {
@@ -26320,7 +26336,7 @@ const PlanPickerCheckoutBar_QuoteFragment = t(`
   `, [Checkout_QuoteFragment]);
 const PlanPickerCheckoutBar = ({ selectedPriceList, handlePortalErrors, onCheckoutSuccess, }) => {
     // Context
-    const { shadow } = useSubscriptionProps();
+    const { shadow, isInPreviewMode } = useSubscriptionProps();
     const { quote: maskedQuote, onChangeQuantity, getFeatureQuantity, onRecalculateTaxes, isFeatureAddonsLoading, isUpdatingQuote, } = react.useContext(QuoteContext);
     // Read fragments
     const quote = readFragment(PlanPickerCheckoutBar_QuoteFragment, maskedQuote);
@@ -26377,6 +26393,8 @@ const PlanPickerCheckoutBar = ({ selectedPriceList, handlePortalErrors, onChecko
                     }
                     const isDisabled = !quote || maybeIsChargeLoading || !selectedPriceList || !charge.selfServiceQuantity;
                     return (jsxRuntime.jsx(CheckoutBarInput, { disabled: isDisabled, priceListCharge: charge, quantity: quantity, onQuantityChanged: quantity => {
+                            if (isInPreviewMode)
+                                return;
                             onChangeQuantity(charge.id, quantity);
                         } }, index));
                 }) }), jsxRuntime.jsx(CheckoutBarSummarySection, { onClickCheckout: () => setPayModalVisible(true), selectedPriceList: selectedPriceList }), jsxRuntime.jsx(Checkout, { onCancel: () => setPayModalVisible(false), onFail: error => handlePortalErrors === null || handlePortalErrors === void 0 ? void 0 : handlePortalErrors(error), onSuccess: handleCheckoutSuccess, onRecalculateTaxes: onRecalculateTaxes, open: payModalVisible, quote: quote, token: token, isUpdatingQuote: isUpdatingQuote })] }));
@@ -27062,7 +27080,11 @@ function AddonPlanRow({ addonPriceList: maskedAddonPriceList, selectedPriceList,
     // Derived state
     const switchDisabled = isInPreviewMode || isPurchased;
     const hasCustomPrice = ((_b = addonPriceList.plan) === null || _b === void 0 ? void 0 : _b.pricingDescription) != null;
-    return (jsxRuntime.jsxs("div", { className: `bunny-flex bunny-flex-row bunny-gap-2 bunny-justify-between bunny-items-center bunny-p-4 bunny-rounded-md bunny-bg-white ${shadow ? `shadow-${shadow}` : ''} bunny-mb-2`, children: [jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center", children: [jsxRuntime.jsx("div", { className: `bunny-font-medium bunny-text-center bunny-text-orange-600`, children: (_c = addonPriceList.plan) === null || _c === void 0 ? void 0 : _c.name }), jsxRuntime.jsx(PriceListCardDescription, { description: (_e = (_d = addonPriceList.plan) === null || _d === void 0 ? void 0 : _d.description) !== null && _e !== void 0 ? _e : '' }), !hasCustomPrice && (jsxRuntime.jsx(PriceListCardPrice, { priceList: addonPriceList, className: "bunny-text-sm bunny-font-medium bunny-text-gray-900" })), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.feature, priceList: addonPriceList }), jsxRuntime.jsx(antd.Button, { type: "link", onClick: onClickSelect, children: jsxRuntime.jsx(icons.InfoCircleOutlined, {}) })] }), jsxRuntime.jsx(antd.Switch, { id: addonPlanSwitchTestId((_g = (_f = addonPriceList.plan) === null || _f === void 0 ? void 0 : _f.name) !== null && _g !== void 0 ? _g : ''), loading: isPending && !switchDisabled, checked: addedQuoteChange || isPurchased, onChange: (checked) => {
+    return (jsxRuntime.jsxs("div", { className: `bunny-flex bunny-flex-row bunny-gap-2 bunny-justify-between bunny-items-center bunny-p-4 bunny-rounded-md bunny-bg-white ${shadow ? `shadow-${shadow}` : ''} bunny-mb-2`, children: [jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center", children: [jsxRuntime.jsx("div", { className: `bunny-font-medium bunny-text-center bunny-text-orange-600`, children: (_c = addonPriceList.plan) === null || _c === void 0 ? void 0 : _c.name }), jsxRuntime.jsx(PriceListCardDescription, { description: (_e = (_d = addonPriceList.plan) === null || _d === void 0 ? void 0 : _d.description) !== null && _e !== void 0 ? _e : '' }), !hasCustomPrice && (jsxRuntime.jsx(PriceListCardPrice, { priceList: addonPriceList, className: "bunny-text-sm bunny-font-medium bunny-text-gray-900" })), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.feature, priceList: addonPriceList }), jsxRuntime.jsx(antd.Button, { type: "link", onClick: () => {
+                            if (isInPreviewMode)
+                                return;
+                            onClickSelect();
+                        }, children: jsxRuntime.jsx(icons.InfoCircleOutlined, {}) })] }), jsxRuntime.jsx(antd.Switch, { id: addonPlanSwitchTestId((_g = (_f = addonPriceList.plan) === null || _f === void 0 ? void 0 : _f.name) !== null && _g !== void 0 ? _g : ''), loading: isPending && !switchDisabled, checked: addedQuoteChange || isPurchased, onChange: (checked) => {
                     if (checked) {
                         addAddonQuoteChange();
                     }
@@ -29209,7 +29231,8 @@ const UpgradeWrapper = ({ onChangePlanCancel, handlePortalErrors, upgradingSubsc
             pluralType: 'upgradeSubscriptions',
             token,
         }),
-        queryFn: () => getSubscriptions({ isInPreviewMode, token, apiHost }),
+        queryFn: () => getSubscriptions({ token, apiHost, isInPreviewMode }),
+        enabled: !isInPreviewMode, // Don't query subscriptions in preview mode
     });
     // find upgrading subscription based on upgradingSubscriptionId
     const upgradingSubscription = (_b = (_a = subscriptionsData === null || subscriptionsData === void 0 ? void 0 : subscriptionsData.subscriptions) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.find(subscription => (subscription === null || subscription === void 0 ? void 0 : subscription.id) === upgradingSubscriptionId);
@@ -29272,7 +29295,8 @@ const SubscriptionsWrapper = ({ handlePortalErrors, companyName, isInPreviewMode
             pluralType: 'subscriptions',
             token,
         }),
-        queryFn: () => getSubscriptions$1({ token, apiHost }),
+        queryFn: () => getSubscriptions$1({ token, apiHost, isInPreviewMode }),
+        enabled: !isInPreviewMode, // Don't query subscriptions in preview mode
     });
     const subscriptions = (_b = (_a = subscriptionsData === null || subscriptionsData === void 0 ? void 0 : subscriptionsData.subscriptions) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.filter(subscription => subscription !== null);
     const defaultStyles = {

package/dist/esm/index.js

@@ -1281,7 +1281,7 @@ const DEFAULT_CONFIG = {
 };
 
 // This will be replaced at build time by rollup-plugin-replace
-const PACKAGE_VERSION = '1.7.0-beta.32';
+const PACKAGE_VERSION = '1.7.0-beta.33';
 const createRequestHeaders = (token) => {
     const headers = createClientDevHeaders({ token });
     // Add the components version header
@@ -2262,7 +2262,11 @@ const getBranding = async ({ token, apiHost }) => {
 const BunnyContext = createContext({});
 // Every component shares similar props and functionality, which this wrapper handles.
 function BunnyProvider({ children, darkMode = false, queryClient, apiHost, token, onTokenExpired, onUserUnavailable, onInvalidOrMissingAuthorization, suppressUserUnavailableErrorNotification = false, configProviderProps, }) {
-    return (jsx(BunnyProviderCallbacksProvider, { value: { onUserUnavailable, onInvalidOrMissingAuthorization, suppressUserUnavailableErrorNotification }, children: jsx(BunnyProviderContent, { darkMode: darkMode, queryClient: queryClient, apiHost: apiHost, token: token, onTokenExpired: onTokenExpired, configProviderProps: configProviderProps, children: children }) }));
+    return (jsx(BunnyProviderCallbacksProvider, { value: {
+            onUserUnavailable,
+            onInvalidOrMissingAuthorization,
+            suppressUserUnavailableErrorNotification,
+        }, children: jsx(BunnyProviderContent, { darkMode: darkMode, queryClient: queryClient, apiHost: apiHost, token: token, onTokenExpired: onTokenExpired, configProviderProps: configProviderProps, children: children }) }));
 }
 function BunnyProviderContent({ children, darkMode = false, queryClient, apiHost, token, onTokenExpired, configProviderProps, }) {
     const createQueryClient = useCreateQueryClient();
@@ -25373,13 +25377,18 @@ const QuoteContext = createContext({});
 const BillingPeriodSelector = ({ availableBillingPeriods, onChangeBillingPeriod, products, selectedBillingPeriod, selectedProduct, onChangeProduct, }) => {
     const { secondaryColor, brandColor } = useBrand();
     const isMobile = useIsMobile();
+    const { isInPreviewMode } = useSubscriptionProps();
     if (!availableBillingPeriods || (availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.length) < 2)
         return null;
     return (jsxs("div", { className: "bunny-flex bunny-items-center bunny-gap-8", children: [(products === null || products === void 0 ? void 0 : products.length) && products.length > 1 && (jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-2", children: [jsx("div", { className: "bunny-font-medium bunny-text-xs", style: {
                             color: secondaryColor,
                         }, children: "Select product" }), jsx(ProductRadioStyled, { brandColor: brandColor, children: jsx(Radio.Group, { onChange: e => {
+                                if (isInPreviewMode)
+                                    return;
                                 onChangeProduct(products === null || products === void 0 ? void 0 : products.find(product => product.id === e.target.value));
                             }, value: selectedProduct === null || selectedProduct === void 0 ? void 0 : selectedProduct.id, buttonStyle: "solid", children: jsx(Space, { className: "bunny-gap-2", children: products === null || products === void 0 ? void 0 : products.map(product => (jsx(Radio.Button, { value: product.id, children: product.name }, product.id))) }) }) })] })), jsx("div", { className: "bunny-flex bunny-flex-col bunny-w-full bunny-gap-2", children: jsx(StyledRadioGroup, { className: "bunny-w-full", "$isMobile": isMobile, children: jsx(Radio.Group, { onChange: e => {
+                            if (isInPreviewMode)
+                                return;
                             onChangeBillingPeriod(e.target.value);
                         }, value: selectedBillingPeriod, size: "small", buttonStyle: "solid", children: availableBillingPeriods === null || availableBillingPeriods === void 0 ? void 0 : availableBillingPeriods.map((periodMonth, index) => {
                             return (jsx(Radio.Button, { value: periodMonthsConverter(periodMonth), children: periodMonthsConverter(periodMonth) }, index));
@@ -25968,10 +25977,14 @@ const PriceListCardDesktop_PriceListFragment = t(`
 ]);
 const PriceListCardDesktop = ({ hideButton, description, disableSelectCurrentPlan, feature, isPriceListCurrentSubscription, isSelected, priceList: maskedPriceList, subscriptionPlan, trialRemainingDays, noBorder, onClickPriceListCard, }) => {
     var _a, _b, _c, _d;
+    // Context
+    const { isInPreviewMode } = useSubscriptionProps();
     // Read fragments
     const priceList = readFragment(PriceListCardDesktop_PriceListFragment, maskedPriceList);
     return (jsx(PlanPickerGridCell, { noBorder: noBorder, children: jsxs("div", { className: `bunny-flex bunny-flex-col bunny-items-start bunny-justify-between bunny-w-full bunny-rounded-md bunny-gap-4 bunny-pt-4 bunny-px-4 ${disableSelectCurrentPlan ? '' : 'cursor-pointer'} bunny-box-border`, onClick: () => {
                 var _a, _b, _c;
+                if (isInPreviewMode)
+                    return;
                 if (!disableSelectCurrentPlan) {
                     if (((_a = priceList.plan) === null || _a === void 0 ? void 0 : _a.pricingStyle) === t.scalar('PlanPricingStyles', 'CONTACT_US')) {
                         window.open((_c = (_b = priceList.plan) === null || _b === void 0 ? void 0 : _b.contactUsUrl) !== null && _c !== void 0 ? _c : undefined, '_blank');
@@ -26013,9 +26026,12 @@ const PriceListCardMobile = ({ description, feature, isPriceListCurrentSubscript
     var _a, _b;
     // Context
     const { brandColor } = useBrand();
+    const { isInPreviewMode } = useSubscriptionProps();
     // Read fragments
     const priceList = readFragment(PriceListCardMobile_PriceListFragment, maskedPriceList);
     return (jsxs("div", { className: `bunny-relative bunny-flex bunny-flex-col bunny-border-2 bunny-border-solid bunny-rounded-lg bunny-p-4`, onClick: () => {
+            if (isInPreviewMode)
+                return;
             if (!disableOnClickPriceListCard)
                 onClickPriceListCard === null || onClickPriceListCard === void 0 ? void 0 : onClickPriceListCard(priceList);
         }, style: {
@@ -26318,7 +26334,7 @@ const PlanPickerCheckoutBar_QuoteFragment = t(`
   `, [Checkout_QuoteFragment]);
 const PlanPickerCheckoutBar = ({ selectedPriceList, handlePortalErrors, onCheckoutSuccess, }) => {
     // Context
-    const { shadow } = useSubscriptionProps();
+    const { shadow, isInPreviewMode } = useSubscriptionProps();
     const { quote: maskedQuote, onChangeQuantity, getFeatureQuantity, onRecalculateTaxes, isFeatureAddonsLoading, isUpdatingQuote, } = useContext(QuoteContext);
     // Read fragments
     const quote = readFragment(PlanPickerCheckoutBar_QuoteFragment, maskedQuote);
@@ -26375,6 +26391,8 @@ const PlanPickerCheckoutBar = ({ selectedPriceList, handlePortalErrors, onChecko
                     }
                     const isDisabled = !quote || maybeIsChargeLoading || !selectedPriceList || !charge.selfServiceQuantity;
                     return (jsx(CheckoutBarInput, { disabled: isDisabled, priceListCharge: charge, quantity: quantity, onQuantityChanged: quantity => {
+                            if (isInPreviewMode)
+                                return;
                             onChangeQuantity(charge.id, quantity);
                         } }, index));
                 }) }), jsx(CheckoutBarSummarySection, { onClickCheckout: () => setPayModalVisible(true), selectedPriceList: selectedPriceList }), jsx(Checkout, { onCancel: () => setPayModalVisible(false), onFail: error => handlePortalErrors === null || handlePortalErrors === void 0 ? void 0 : handlePortalErrors(error), onSuccess: handleCheckoutSuccess, onRecalculateTaxes: onRecalculateTaxes, open: payModalVisible, quote: quote, token: token, isUpdatingQuote: isUpdatingQuote })] }));
@@ -27060,7 +27078,11 @@ function AddonPlanRow({ addonPriceList: maskedAddonPriceList, selectedPriceList,
     // Derived state
     const switchDisabled = isInPreviewMode || isPurchased;
     const hasCustomPrice = ((_b = addonPriceList.plan) === null || _b === void 0 ? void 0 : _b.pricingDescription) != null;
-    return (jsxs("div", { className: `bunny-flex bunny-flex-row bunny-gap-2 bunny-justify-between bunny-items-center bunny-p-4 bunny-rounded-md bunny-bg-white ${shadow ? `shadow-${shadow}` : ''} bunny-mb-2`, children: [jsxs("div", { className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center", children: [jsx("div", { className: `bunny-font-medium bunny-text-center bunny-text-orange-600`, children: (_c = addonPriceList.plan) === null || _c === void 0 ? void 0 : _c.name }), jsx(PriceListCardDescription, { description: (_e = (_d = addonPriceList.plan) === null || _d === void 0 ? void 0 : _d.description) !== null && _e !== void 0 ? _e : '' }), !hasCustomPrice && (jsx(PriceListCardPrice, { priceList: addonPriceList, className: "bunny-text-sm bunny-font-medium bunny-text-gray-900" })), jsx(PriceListCardPriceDescription, { feature: activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.feature, priceList: addonPriceList }), jsx(Button, { type: "link", onClick: onClickSelect, children: jsx(InfoCircleOutlined, {}) })] }), jsx(Switch, { id: addonPlanSwitchTestId((_g = (_f = addonPriceList.plan) === null || _f === void 0 ? void 0 : _f.name) !== null && _g !== void 0 ? _g : ''), loading: isPending && !switchDisabled, checked: addedQuoteChange || isPurchased, onChange: (checked) => {
+    return (jsxs("div", { className: `bunny-flex bunny-flex-row bunny-gap-2 bunny-justify-between bunny-items-center bunny-p-4 bunny-rounded-md bunny-bg-white ${shadow ? `shadow-${shadow}` : ''} bunny-mb-2`, children: [jsxs("div", { className: "bunny-flex bunny-flex-row bunny-gap-2 bunny-items-center", children: [jsx("div", { className: `bunny-font-medium bunny-text-center bunny-text-orange-600`, children: (_c = addonPriceList.plan) === null || _c === void 0 ? void 0 : _c.name }), jsx(PriceListCardDescription, { description: (_e = (_d = addonPriceList.plan) === null || _d === void 0 ? void 0 : _d.description) !== null && _e !== void 0 ? _e : '' }), !hasCustomPrice && (jsx(PriceListCardPrice, { priceList: addonPriceList, className: "bunny-text-sm bunny-font-medium bunny-text-gray-900" })), jsx(PriceListCardPriceDescription, { feature: activeCharge === null || activeCharge === void 0 ? void 0 : activeCharge.feature, priceList: addonPriceList }), jsx(Button, { type: "link", onClick: () => {
+                            if (isInPreviewMode)
+                                return;
+                            onClickSelect();
+                        }, children: jsx(InfoCircleOutlined, {}) })] }), jsx(Switch, { id: addonPlanSwitchTestId((_g = (_f = addonPriceList.plan) === null || _f === void 0 ? void 0 : _f.name) !== null && _g !== void 0 ? _g : ''), loading: isPending && !switchDisabled, checked: addedQuoteChange || isPurchased, onChange: (checked) => {
                     if (checked) {
                         addAddonQuoteChange();
                     }
@@ -29207,7 +29229,8 @@ const UpgradeWrapper = ({ onChangePlanCancel, handlePortalErrors, upgradingSubsc
             pluralType: 'upgradeSubscriptions',
             token,
         }),
-        queryFn: () => getSubscriptions({ isInPreviewMode, token, apiHost }),
+        queryFn: () => getSubscriptions({ token, apiHost, isInPreviewMode }),
+        enabled: !isInPreviewMode, // Don't query subscriptions in preview mode
     });
     // find upgrading subscription based on upgradingSubscriptionId
     const upgradingSubscription = (_b = (_a = subscriptionsData === null || subscriptionsData === void 0 ? void 0 : subscriptionsData.subscriptions) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.find(subscription => (subscription === null || subscription === void 0 ? void 0 : subscription.id) === upgradingSubscriptionId);
@@ -29270,7 +29293,8 @@ const SubscriptionsWrapper = ({ handlePortalErrors, companyName, isInPreviewMode
             pluralType: 'subscriptions',
             token,
         }),
-        queryFn: () => getSubscriptions$1({ token, apiHost }),
+        queryFn: () => getSubscriptions$1({ token, apiHost, isInPreviewMode }),
+        enabled: !isInPreviewMode, // Don't query subscriptions in preview mode
     });
     const subscriptions = (_b = (_a = subscriptionsData === null || subscriptionsData === void 0 ? void 0 : subscriptionsData.subscriptions) === null || _a === void 0 ? void 0 : _a.nodes) === null || _b === void 0 ? void 0 : _b.filter(subscription => subscription !== null);
     const defaultStyles = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bunnyapp/components",
-  "version": "1.7.0-beta.33",
+  "version": "1.7.0-beta.34",
   "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -80,7 +80,7 @@
     "@pdf-viewer/react": "^1.8.0",
     "@stripe/react-stripe-js": "^3.8.1",
     "@stripe/stripe-js": "^7.7.0",
-    "@tanstack/react-query": "^5.83.0",
+    "@tanstack/react-query": "^5.59.0",
     "antd": "^5.28.0",
     "graphql": "^16.11.0",
     "graphql-request": "^6.1.0",