@bunnyapp/components 1.7.0-beta.42 → 1.7.0-beta.44

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.41';
+const PACKAGE_VERSION = '1.7.0-beta.43';
 const createRequestHeaders = (token) => {
     const headers = createClientDevHeaders({ token });
     // Add the components version header
@@ -23314,6 +23314,35 @@ const TAG_COLORS = {
     PENDING: 'yellow',
 };
 
+const graphql = initGraphQLTada();
+
+const periodMonthsConverter = (period) => {
+    if (period === 0)
+        return graphql.scalar('BillingPeriod', 'ONCE');
+    else if (period === 1)
+        return graphql.scalar('BillingPeriod', 'MONTHLY');
+    else if (period === 3)
+        return graphql.scalar('BillingPeriod', 'QUARTERLY');
+    else if (period === 6)
+        return graphql.scalar('BillingPeriod', 'SEMI_ANNUAL');
+    else if (period === 12)
+        return graphql.scalar('BillingPeriod', 'ANNUAL');
+    else
+        return null;
+};
+const billingPeriodConverter = (period) => {
+    if (period === graphql.scalar('BillingPeriod', 'ONCE'))
+        return 0;
+    else if (period === graphql.scalar('BillingPeriod', 'MONTHLY'))
+        return 1;
+    else if (period === graphql.scalar('BillingPeriod', 'QUARTERLY'))
+        return 3;
+    else if (period === graphql.scalar('BillingPeriod', 'SEMI_ANNUAL'))
+        return 6;
+    else
+        return 12;
+};
+
 const { Text: Text$p } = antd.Typography;
 const PriceListDisplay_PriceListFragment = t(`
     fragment PriceListDisplay_PriceListFragment on PriceList {
@@ -23325,14 +23354,17 @@ const PriceListDisplay_PriceListFragment = t(`
       currencyId
       trialAllowed
       trialLengthDays
+      periodMonths
     }
   `);
 function PriceListDisplay({ priceList: maskedPriceList }) {
     var _a, _b;
     const priceList = readFragment(PriceListDisplay_PriceListFragment, maskedPriceList);
+    const convertedPeriodMonths = periodMonthsConverter(priceList === null || priceList === void 0 ? void 0 : priceList.periodMonths);
+    const periodLabel = convertedPeriodMonths ? PERIOD_LABELS[convertedPeriodMonths] : 'undefined';
     if (!priceList)
         return null;
-    return (jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-4", children: [jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-0", children: [jsxRuntime.jsxs(Text$p, { className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg", children: [(_a = priceList.product) === null || _a === void 0 ? void 0 : _a.name, " ", priceList.name] }), jsxRuntime.jsxs(Text$p, { className: "bunny-font-bold bunny-text-xl", children: [formatCurrency(priceList.basePrice, priceList.currencyId), " / month"] })] }), priceList.trialAllowed ? (jsxRuntime.jsx("div", { className: "bunny-flex", children: jsxRuntime.jsx(CustomizedTag, { color: TAG_COLORS["TRIAL"], children: `${(_b = priceList.trialLengthDays) !== null && _b !== void 0 ? _b : 'N/A'} day trial` }) })) : null] }));
+    return (jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-4", children: [jsxRuntime.jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-0", children: [jsxRuntime.jsxs(Text$p, { className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg", children: [(_a = priceList.product) === null || _a === void 0 ? void 0 : _a.name, " ", priceList.name] }), jsxRuntime.jsxs(Text$p, { className: "bunny-font-bold bunny-text-xl", children: [formatCurrency(priceList.basePrice, priceList.currencyId), " / ", periodLabel] })] }), priceList.trialAllowed ? (jsxRuntime.jsx("div", { className: "bunny-flex", children: jsxRuntime.jsx(CustomizedTag, { color: TAG_COLORS["TRIAL"], children: `${(_b = priceList.trialLengthDays) !== null && _b !== void 0 ? _b : 'N/A'} day trial` }) })) : null] }));
 }
 
 const Signup_PriceListFragment = t(`
@@ -23351,8 +23383,6 @@ const Signup_PriceListFragment = t(`
     SelfServiceBuyWarning_PriceListFragment,
 ]);
 
-const graphql = initGraphQLTada();
-
 const mutation$g = graphql(`
   mutation AccountSignup (
     $pluginId: String!,
@@ -24168,33 +24198,6 @@ const CheckoutButton = ({ disabled, onClickCheckout, loading, tooltipText, }) =>
     return (jsxRuntime.jsx(TooltipWrapper, { children: jsxRuntime.jsx(antd.Button, { className: isMobile ? 'w-full' : '', disabled: disabled, onClick: onClickCheckout, size: isMobile ? 'large' : 'middle', type: "primary", loading: loading, children: "Proceed to checkout" }) }));
 };
 
-const periodMonthsConverter = (period) => {
-    if (period === 0)
-        return graphql.scalar('BillingPeriod', 'ONCE');
-    else if (period === 1)
-        return graphql.scalar('BillingPeriod', 'MONTHLY');
-    else if (period === 3)
-        return graphql.scalar('BillingPeriod', 'QUARTERLY');
-    else if (period === 6)
-        return graphql.scalar('BillingPeriod', 'SEMI_ANNUAL');
-    else if (period === 12)
-        return graphql.scalar('BillingPeriod', 'ANNUAL');
-    else
-        return null;
-};
-const billingPeriodConverter = (period) => {
-    if (period === graphql.scalar('BillingPeriod', 'ONCE'))
-        return 0;
-    else if (period === graphql.scalar('BillingPeriod', 'MONTHLY'))
-        return 1;
-    else if (period === graphql.scalar('BillingPeriod', 'QUARTERLY'))
-        return 3;
-    else if (period === graphql.scalar('BillingPeriod', 'SEMI_ANNUAL'))
-        return 6;
-    else
-        return 12;
-};
-
 const CheckoutPrice_QuoteFragment = t(`
     fragment CheckoutPrice_QuoteFragment on Quote {
       periodAmount
@@ -26807,11 +26810,41 @@ const GetPrice_PriceListFragment = t(`
       showPriceAsMonthly
       monthlyBasePrice
       basePrice
+      charges {
+        basePrice
+        chargeType
+        featureAddon
+        deprecated
+        ...filterDeprecatedCharges_PriceListChargeFragment
+      }
     }
-  `);
+  `, [filterDeprecatedCharges_PriceListChargeFragment]);
 function getPrice(maskedPriceList) {
+    var _a, _b;
     // Read fragments
     const priceList = readFragment(GetPrice_PriceListFragment, maskedPriceList);
+    // ============= HACK FOR THOMAS' CUSTOMER MEETING =============
+    // note: delete shortly after and implement a better pricing solution
+    // to take other charges into account.
+    // Filter charges: exclude deprecated and featureAddon charges, keep only USAGE charges
+    const usageCharges = (_b = (_a = priceList.charges) === null || _a === void 0 ? void 0 : _a.filter(charge => {
+        // Exclude deprecated charges
+        if (!filterDeprecatedCharges(undefined, charge)) {
+            return false;
+        }
+        // Exclude featureAddon charges
+        if (charge.featureAddon === true) {
+            return false;
+        }
+        // Keep only USAGE charges
+        return charge.chargeType === t.scalar('ChargeType', 'USAGE');
+    })) !== null && _b !== void 0 ? _b : [];
+    // If there are any usage charges, sum their basePrice
+    if (usageCharges.length > 0) {
+        return usageCharges.reduce((sum, charge) => sum + charge.basePrice, 0);
+    }
+    // =================================================================
+    // Otherwise, return the priceList basePrice or monthlyBasePrice
     if (priceList.showPriceAsMonthly) {
         return priceList.monthlyBasePrice;
     }
@@ -26847,10 +26880,11 @@ function priceListPriceText({ priceList: maskedPriceList, }) {
         }
         return 0;
     };
+    const basePrice = getPrice(priceList);
     const priceDecimals = calculatePriceDecimals();
     const price = !((_a = priceList.plan) === null || _a === void 0 ? void 0 : _a.pricingStyle) ||
         ((_b = priceList.plan) === null || _b === void 0 ? void 0 : _b.pricingStyle) === t.scalar('PlanPricingStyles', 'PRICED')
-        ? formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
+        ? formatCurrency(basePrice, priceList.currencyId, priceDecimals)
         : ((_c = priceList.plan) === null || _c === void 0 ? void 0 : _c.pricingStyle) === t.scalar('PlanPricingStyles', 'CONTACT_US')
             ? 'Custom'
             : 'Free';

package/dist/cjs/types/src/components/Signup/PriceListDisplay.d.ts

@@ -8,6 +8,7 @@ export declare const PriceListDisplay_PriceListFragment: import("gql.tada").Tada
     currencyId: string;
     trialAllowed: boolean;
     trialLengthDays: number | null;
+    periodMonths: number | null;
 }, {}, {
     fragment: "PriceListDisplay_PriceListFragment";
     on: "PriceList";

package/dist/cjs/types/src/utils/priceListUtils/getPrice.d.ts

@@ -3,6 +3,15 @@ export declare const GetPrice_PriceListFragment: import("gql.tada").TadaDocument
     showPriceAsMonthly: boolean | null;
     monthlyBasePrice: number | null;
     basePrice: number | null;
+    charges: {
+        basePrice: number;
+        chargeType: "ONE_TIME" | "RECURRING" | "USAGE" | null;
+        featureAddon: boolean | null;
+        deprecated: boolean | null;
+        [$tada.fragmentRefs]: {
+            filterDeprecatedCharges_PriceListChargeFragment: "PriceListCharge";
+        };
+    }[] | null;
 }, {}, {
     fragment: "GetPrice_PriceListFragment";
     on: "PriceList";

package/dist/cjs/types/src/utils/pricePickerUtils.d.ts

@@ -1,6 +1,6 @@
 import { BillingPeriod } from '@/graphql-codegen/exportedScalarTypes';
 import { Plan } from '@/types/Plan';
 import Product from '@/types/Product';
-export declare const periodMonthsConverter: (period: number | null) => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | null;
+export declare const periodMonthsConverter: (period: number | undefined | null) => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | null;
 export declare const billingPeriodConverter: (period?: BillingPeriod) => 3 | 0 | 1 | 6 | 12;
 export declare const createAvailableBillingPeriods: (plans?: Plan[], selectedProduct?: Product) => (0 | 1 | 3 | 6 | 12)[] | undefined;

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.41';
+const PACKAGE_VERSION = '1.7.0-beta.43';
 const createRequestHeaders = (token) => {
     const headers = createClientDevHeaders({ token });
     // Add the components version header
@@ -23312,6 +23312,35 @@ const TAG_COLORS = {
     PENDING: 'yellow',
 };
 
+const graphql = initGraphQLTada();
+
+const periodMonthsConverter = (period) => {
+    if (period === 0)
+        return graphql.scalar('BillingPeriod', 'ONCE');
+    else if (period === 1)
+        return graphql.scalar('BillingPeriod', 'MONTHLY');
+    else if (period === 3)
+        return graphql.scalar('BillingPeriod', 'QUARTERLY');
+    else if (period === 6)
+        return graphql.scalar('BillingPeriod', 'SEMI_ANNUAL');
+    else if (period === 12)
+        return graphql.scalar('BillingPeriod', 'ANNUAL');
+    else
+        return null;
+};
+const billingPeriodConverter = (period) => {
+    if (period === graphql.scalar('BillingPeriod', 'ONCE'))
+        return 0;
+    else if (period === graphql.scalar('BillingPeriod', 'MONTHLY'))
+        return 1;
+    else if (period === graphql.scalar('BillingPeriod', 'QUARTERLY'))
+        return 3;
+    else if (period === graphql.scalar('BillingPeriod', 'SEMI_ANNUAL'))
+        return 6;
+    else
+        return 12;
+};
+
 const { Text: Text$p } = Typography;
 const PriceListDisplay_PriceListFragment = t(`
     fragment PriceListDisplay_PriceListFragment on PriceList {
@@ -23323,14 +23352,17 @@ const PriceListDisplay_PriceListFragment = t(`
       currencyId
       trialAllowed
       trialLengthDays
+      periodMonths
     }
   `);
 function PriceListDisplay({ priceList: maskedPriceList }) {
     var _a, _b;
     const priceList = readFragment(PriceListDisplay_PriceListFragment, maskedPriceList);
+    const convertedPeriodMonths = periodMonthsConverter(priceList === null || priceList === void 0 ? void 0 : priceList.periodMonths);
+    const periodLabel = convertedPeriodMonths ? PERIOD_LABELS[convertedPeriodMonths] : 'undefined';
     if (!priceList)
         return null;
-    return (jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-4", children: [jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-0", children: [jsxs(Text$p, { className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg", children: [(_a = priceList.product) === null || _a === void 0 ? void 0 : _a.name, " ", priceList.name] }), jsxs(Text$p, { className: "bunny-font-bold bunny-text-xl", children: [formatCurrency(priceList.basePrice, priceList.currencyId), " / month"] })] }), priceList.trialAllowed ? (jsx("div", { className: "bunny-flex", children: jsx(CustomizedTag, { color: TAG_COLORS["TRIAL"], children: `${(_b = priceList.trialLengthDays) !== null && _b !== void 0 ? _b : 'N/A'} day trial` }) })) : null] }));
+    return (jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-4", children: [jsxs("div", { className: "bunny-flex bunny-flex-col bunny-gap-0", children: [jsxs(Text$p, { className: "bunny-text-slate-500 bunny-font-bold bunny-text-lg", children: [(_a = priceList.product) === null || _a === void 0 ? void 0 : _a.name, " ", priceList.name] }), jsxs(Text$p, { className: "bunny-font-bold bunny-text-xl", children: [formatCurrency(priceList.basePrice, priceList.currencyId), " / ", periodLabel] })] }), priceList.trialAllowed ? (jsx("div", { className: "bunny-flex", children: jsx(CustomizedTag, { color: TAG_COLORS["TRIAL"], children: `${(_b = priceList.trialLengthDays) !== null && _b !== void 0 ? _b : 'N/A'} day trial` }) })) : null] }));
 }
 
 const Signup_PriceListFragment = t(`
@@ -23349,8 +23381,6 @@ const Signup_PriceListFragment = t(`
     SelfServiceBuyWarning_PriceListFragment,
 ]);
 
-const graphql = initGraphQLTada();
-
 const mutation$g = graphql(`
   mutation AccountSignup (
     $pluginId: String!,
@@ -24166,33 +24196,6 @@ const CheckoutButton = ({ disabled, onClickCheckout, loading, tooltipText, }) =>
     return (jsx(TooltipWrapper, { children: jsx(Button, { className: isMobile ? 'w-full' : '', disabled: disabled, onClick: onClickCheckout, size: isMobile ? 'large' : 'middle', type: "primary", loading: loading, children: "Proceed to checkout" }) }));
 };
 
-const periodMonthsConverter = (period) => {
-    if (period === 0)
-        return graphql.scalar('BillingPeriod', 'ONCE');
-    else if (period === 1)
-        return graphql.scalar('BillingPeriod', 'MONTHLY');
-    else if (period === 3)
-        return graphql.scalar('BillingPeriod', 'QUARTERLY');
-    else if (period === 6)
-        return graphql.scalar('BillingPeriod', 'SEMI_ANNUAL');
-    else if (period === 12)
-        return graphql.scalar('BillingPeriod', 'ANNUAL');
-    else
-        return null;
-};
-const billingPeriodConverter = (period) => {
-    if (period === graphql.scalar('BillingPeriod', 'ONCE'))
-        return 0;
-    else if (period === graphql.scalar('BillingPeriod', 'MONTHLY'))
-        return 1;
-    else if (period === graphql.scalar('BillingPeriod', 'QUARTERLY'))
-        return 3;
-    else if (period === graphql.scalar('BillingPeriod', 'SEMI_ANNUAL'))
-        return 6;
-    else
-        return 12;
-};
-
 const CheckoutPrice_QuoteFragment = t(`
     fragment CheckoutPrice_QuoteFragment on Quote {
       periodAmount
@@ -26805,11 +26808,41 @@ const GetPrice_PriceListFragment = t(`
       showPriceAsMonthly
       monthlyBasePrice
       basePrice
+      charges {
+        basePrice
+        chargeType
+        featureAddon
+        deprecated
+        ...filterDeprecatedCharges_PriceListChargeFragment
+      }
     }
-  `);
+  `, [filterDeprecatedCharges_PriceListChargeFragment]);
 function getPrice(maskedPriceList) {
+    var _a, _b;
     // Read fragments
     const priceList = readFragment(GetPrice_PriceListFragment, maskedPriceList);
+    // ============= HACK FOR THOMAS' CUSTOMER MEETING =============
+    // note: delete shortly after and implement a better pricing solution
+    // to take other charges into account.
+    // Filter charges: exclude deprecated and featureAddon charges, keep only USAGE charges
+    const usageCharges = (_b = (_a = priceList.charges) === null || _a === void 0 ? void 0 : _a.filter(charge => {
+        // Exclude deprecated charges
+        if (!filterDeprecatedCharges(undefined, charge)) {
+            return false;
+        }
+        // Exclude featureAddon charges
+        if (charge.featureAddon === true) {
+            return false;
+        }
+        // Keep only USAGE charges
+        return charge.chargeType === t.scalar('ChargeType', 'USAGE');
+    })) !== null && _b !== void 0 ? _b : [];
+    // If there are any usage charges, sum their basePrice
+    if (usageCharges.length > 0) {
+        return usageCharges.reduce((sum, charge) => sum + charge.basePrice, 0);
+    }
+    // =================================================================
+    // Otherwise, return the priceList basePrice or monthlyBasePrice
     if (priceList.showPriceAsMonthly) {
         return priceList.monthlyBasePrice;
     }
@@ -26845,10 +26878,11 @@ function priceListPriceText({ priceList: maskedPriceList, }) {
         }
         return 0;
     };
+    const basePrice = getPrice(priceList);
     const priceDecimals = calculatePriceDecimals();
     const price = !((_a = priceList.plan) === null || _a === void 0 ? void 0 : _a.pricingStyle) ||
         ((_b = priceList.plan) === null || _b === void 0 ? void 0 : _b.pricingStyle) === t.scalar('PlanPricingStyles', 'PRICED')
-        ? formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
+        ? formatCurrency(basePrice, priceList.currencyId, priceDecimals)
         : ((_c = priceList.plan) === null || _c === void 0 ? void 0 : _c.pricingStyle) === t.scalar('PlanPricingStyles', 'CONTACT_US')
             ? 'Custom'
             : 'Free';

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

@@ -8,6 +8,7 @@ export declare const PriceListDisplay_PriceListFragment: import("gql.tada").Tada
     currencyId: string;
     trialAllowed: boolean;
     trialLengthDays: number | null;
+    periodMonths: number | null;
 }, {}, {
     fragment: "PriceListDisplay_PriceListFragment";
     on: "PriceList";

package/dist/esm/types/src/utils/priceListUtils/getPrice.d.ts

@@ -3,6 +3,15 @@ export declare const GetPrice_PriceListFragment: import("gql.tada").TadaDocument
     showPriceAsMonthly: boolean | null;
     monthlyBasePrice: number | null;
     basePrice: number | null;
+    charges: {
+        basePrice: number;
+        chargeType: "ONE_TIME" | "RECURRING" | "USAGE" | null;
+        featureAddon: boolean | null;
+        deprecated: boolean | null;
+        [$tada.fragmentRefs]: {
+            filterDeprecatedCharges_PriceListChargeFragment: "PriceListCharge";
+        };
+    }[] | null;
 }, {}, {
     fragment: "GetPrice_PriceListFragment";
     on: "PriceList";

package/dist/esm/types/src/utils/pricePickerUtils.d.ts

@@ -1,6 +1,6 @@
 import { BillingPeriod } from '@/graphql-codegen/exportedScalarTypes';
 import { Plan } from '@/types/Plan';
 import Product from '@/types/Product';
-export declare const periodMonthsConverter: (period: number | null) => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | null;
+export declare const periodMonthsConverter: (period: number | undefined | null) => "MONTHLY" | "QUARTERLY" | "SEMI_ANNUAL" | "ANNUAL" | "ONCE" | null;
 export declare const billingPeriodConverter: (period?: BillingPeriod) => 3 | 0 | 1 | 6 | 12;
 export declare const createAvailableBillingPeriods: (plans?: Plan[], selectedProduct?: Product) => (0 | 1 | 3 | 6 | 12)[] | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bunnyapp/components",
-  "version": "1.7.0-beta.42",
+  "version": "1.7.0-beta.44",
   "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",