@bunnyapp/components 1.0.68-beta.6 → 1.0.68-beta.7

package/dist/cjs/index.js

@@ -156,7 +156,7 @@ var BrandContext = react.createContext({
 });
 
 // This will be replaced at build time by rollup-plugin-replace
-var PACKAGE_VERSION = '1.0.68-beta.6';
+var PACKAGE_VERSION = '1.0.68-beta.7';
 var createRequestHeaders = function (token) {
     var headers = common.createClientDevHeaders(token);
     // Add the components version header
@@ -21263,7 +21263,7 @@ var PlanPickerCheckoutBar = function (_a) {
 };
 
 // WARNING: There is a preview button on APP that will need to be changed if this query is changed
-var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n  query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n    priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n      products {\n        everythingInPlus\n        id\n        name\n        plansToDisplay\n        features(sort: \"position asc\") {\n          description\n          id\n          isVisible\n          kind\n          name\n          position\n        }\n      }\n      priceLists {\n        basePrice\n        currencyId\n        id\n        monthlyBasePrice\n        periodMonths\n        plan {\n          code\n          contactUsLabel\n          contactUsUrl\n          description\n          id\n          name\n          position\n          pricingDescription\n          pricingStyle\n          planFeatures {\n            featureId\n            value\n            feature {\n              name\n            }\n          }\n        }\n        product {\n          id\n        }\n        charges {\n          basePrice\n          billingPeriod\n          chargeType\n          id\n          name\n          priceDecimals\n          pricingModel\n          quantityMax\n          quantityMin\n          selfServiceQuantity\n          feature {\n            name\n            unitName\n          }\n        }\n      }\n    }\n  }";
+var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n  query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n    priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n      products {\n        everythingInPlus\n        id\n        name\n        plansToDisplay\n        features(sort: \"position asc\") {\n          description\n          id\n          isVisible\n          kind\n          name\n          position\n        }\n      }\n      priceLists {\n        showPriceAsMonthly\n        basePrice\n        currencyId\n        id\n        monthlyBasePrice\n        periodMonths\n        plan {\n          code\n          contactUsLabel\n          contactUsUrl\n          description\n          id\n          name\n          position\n          pricingDescription\n          pricingStyle\n          planFeatures {\n            featureId\n            value\n            feature {\n              name\n            }\n          }\n        }\n        product {\n          id\n        }\n        charges {\n          basePrice\n          billingPeriod\n          chargeType\n          id\n          name\n          priceDecimals\n          pricingModel\n          quantityMax\n          quantityMin\n          selfServiceQuantity\n          feature {\n            name\n            unitName\n          }\n        }\n      }\n    }\n  }";
 var getPriceListChangeOptions = function (_a) {
     var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, token = _a.token, upgradingSubscription = _a.upgradingSubscription;
     return __awaiter(void 0, void 0, void 0, function () {
@@ -21367,10 +21367,30 @@ var PriceListCardTitle = function (_a) {
                     : " " }))), jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center ".concat(isMobile ? "bunny-text-slate-500" : "bunny-text-orange-600"), style: { fontSize: "20px" } }, { children: priceList.plan.name }))] })));
 };
 
+var getPrice = function (priceList) {
+    if (priceList.showPriceAsMonthly) {
+        return priceList.monthlyBasePrice;
+    }
+    return priceList.basePrice;
+};
+var calculatePriceDecimals = function (priceList) {
+    if (priceList.plan.pricingStyle === common.PricingStyle.PRICED) {
+        var decimalPart = getPrice(priceList).toString().split('.')[1];
+        if (!decimalPart)
+            return 0;
+        // If decimal part consists only of zeros, return 0
+        if (parseInt(decimalPart) === 0) {
+            return 0;
+        }
+        return undefined;
+    }
+    return 0;
+};
 var PriceListCardPrice = function (_a) {
     var priceList = _a.priceList;
+    var priceDecimals = calculatePriceDecimals(priceList);
     return (jsxRuntime.jsx("div", __assign({ className: "bunny-font-medium bunny-text-center bunny-text-gray-900", style: { fontSize: '32px' } }, { children: !priceList.plan.pricingStyle || priceList.plan.pricingStyle === common.PricingStyle.PRICED
-            ? common.formatCurrency(priceList.monthlyBasePrice, priceList.currencyId, 0)
+            ? common.formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
             : priceList.plan.pricingStyle === common.PricingStyle.CONTACT_US
                 ? ''
                 : 'Free' })));
@@ -21409,7 +21429,9 @@ var PriceListCardPriceDescription = function (_a) {
                     fontSize: isMobile ? '13px' : '12px',
                 } }, { children: priceList.plan.pricingDescription && !isEmptyHtml(priceList.plan.pricingDescription) ? (jsxRuntime.jsx(interweave.Markup, { content: priceList.plan.pricingDescription })) : ("per ".concat((feature === null || feature === void 0 ? void 0 : feature.unitName) && !doesPlanHaveFlatFeeCharges
                     ? "".concat(feature.unitName.toLowerCase(), " / ")
-                    : '', "month")) })), priceList.periodMonths > 1 && (jsxRuntime.jsxs(Text$b, __assign({ className: "bunny-text-center bunny-text-gray-900", style: { fontSize: isMobile ? '12px' : '11px' } }, { children: ["billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] })))] }));
+                    : '').concat(priceList.showPriceAsMonthly
+                    ? 'month'
+                    : common.PERIOD_LABELS[periodMonthsConverter(priceList.periodMonths)])) })), priceList.periodMonths > 1 && (jsxRuntime.jsxs(Text$b, __assign({ className: "bunny-text-center bunny-text-gray-900", style: { fontSize: isMobile ? '12px' : '11px' } }, { children: ["billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] })))] }));
 };
 
 var CheckIcon = function (_a) {
@@ -21447,11 +21469,11 @@ var PriceListCardMobile = function (_a) {
             if (!disableOnClick)
                 onClick(priceList);
         }, style: {
-            minWidth: "220px",
+            minWidth: '220px',
             borderColor: isSelected ? brandColor : common.SLATE_200,
         } }, { children: [isSelected && (jsxRuntime.jsx("div", __assign({ className: "bunny-absolute", style: {
-                    top: "10px",
-                    right: "10px",
+                    top: '10px',
+                    right: '10px',
                 } }, { children: jsxRuntime.jsx(CheckIcon, { backgroundColor: brandColor, size: "20px" }) }))), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-grow bunny-gap-2" }, { children: [jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsxRuntime.jsx(PriceListCardDescription, { description: description })] })), jsxRuntime.jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsxRuntime.jsx(PriceListCardPrice, { priceList: priceList }), jsxRuntime.jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] })), jsxRuntime.jsx(PriceListCardButton, { disableOnClick: disableOnClick, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, subscriptionPlan: subscriptionPlan })] }))] })));
 };
 

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

@@ -1,4 +1,4 @@
-import { Feature, PriceList, Subscription } from "@bunnyapp/common";
+import { Feature, PriceList, Subscription } from '@bunnyapp/common';
 declare const PriceListCardMobile: ({ description, disableOnClick, feature, isPriceListCurrentSubscription, isSelected, onClick, priceList, subscriptionPlan, trialRemainingDays, }: {
     description: string;
     disableOnClick: boolean;

package/dist/esm/index.js

@@ -144,7 +144,7 @@ var BrandContext = createContext({
 });
 
 // This will be replaced at build time by rollup-plugin-replace
-var PACKAGE_VERSION = '1.0.68-beta.6';
+var PACKAGE_VERSION = '1.0.68-beta.7';
 var createRequestHeaders = function (token) {
     var headers = createClientDevHeaders(token);
     // Add the components version header
@@ -21251,7 +21251,7 @@ var PlanPickerCheckoutBar = function (_a) {
 };
 
 // WARNING: There is a preview button on APP that will need to be changed if this query is changed
-var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n  query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n    priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n      products {\n        everythingInPlus\n        id\n        name\n        plansToDisplay\n        features(sort: \"position asc\") {\n          description\n          id\n          isVisible\n          kind\n          name\n          position\n        }\n      }\n      priceLists {\n        basePrice\n        currencyId\n        id\n        monthlyBasePrice\n        periodMonths\n        plan {\n          code\n          contactUsLabel\n          contactUsUrl\n          description\n          id\n          name\n          position\n          pricingDescription\n          pricingStyle\n          planFeatures {\n            featureId\n            value\n            feature {\n              name\n            }\n          }\n        }\n        product {\n          id\n        }\n        charges {\n          basePrice\n          billingPeriod\n          chargeType\n          id\n          name\n          priceDecimals\n          pricingModel\n          quantityMax\n          quantityMin\n          selfServiceQuantity\n          feature {\n            name\n            unitName\n          }\n        }\n      }\n    }\n  }";
+var PRICE_LIST_CHANGE_OPTIONS_QUERY = "\n  query priceListChangeOptions($subscriptionId: ID, $productId: ID) {\n    priceListChangeOptions(subscriptionId: $subscriptionId, productId: $productId) {\n      products {\n        everythingInPlus\n        id\n        name\n        plansToDisplay\n        features(sort: \"position asc\") {\n          description\n          id\n          isVisible\n          kind\n          name\n          position\n        }\n      }\n      priceLists {\n        showPriceAsMonthly\n        basePrice\n        currencyId\n        id\n        monthlyBasePrice\n        periodMonths\n        plan {\n          code\n          contactUsLabel\n          contactUsUrl\n          description\n          id\n          name\n          position\n          pricingDescription\n          pricingStyle\n          planFeatures {\n            featureId\n            value\n            feature {\n              name\n            }\n          }\n        }\n        product {\n          id\n        }\n        charges {\n          basePrice\n          billingPeriod\n          chargeType\n          id\n          name\n          priceDecimals\n          pricingModel\n          quantityMax\n          quantityMin\n          selfServiceQuantity\n          feature {\n            name\n            unitName\n          }\n        }\n      }\n    }\n  }";
 var getPriceListChangeOptions = function (_a) {
     var apiHost = _a.apiHost, isInPreviewMode = _a.isInPreviewMode, productId = _a.productId, token = _a.token, upgradingSubscription = _a.upgradingSubscription;
     return __awaiter(void 0, void 0, void 0, function () {
@@ -21355,10 +21355,30 @@ var PriceListCardTitle = function (_a) {
                     : " " }))), jsx("div", __assign({ className: "bunny-font-medium bunny-text-center ".concat(isMobile ? "bunny-text-slate-500" : "bunny-text-orange-600"), style: { fontSize: "20px" } }, { children: priceList.plan.name }))] })));
 };
 
+var getPrice = function (priceList) {
+    if (priceList.showPriceAsMonthly) {
+        return priceList.monthlyBasePrice;
+    }
+    return priceList.basePrice;
+};
+var calculatePriceDecimals = function (priceList) {
+    if (priceList.plan.pricingStyle === PricingStyle.PRICED) {
+        var decimalPart = getPrice(priceList).toString().split('.')[1];
+        if (!decimalPart)
+            return 0;
+        // If decimal part consists only of zeros, return 0
+        if (parseInt(decimalPart) === 0) {
+            return 0;
+        }
+        return undefined;
+    }
+    return 0;
+};
 var PriceListCardPrice = function (_a) {
     var priceList = _a.priceList;
+    var priceDecimals = calculatePriceDecimals(priceList);
     return (jsx("div", __assign({ className: "bunny-font-medium bunny-text-center bunny-text-gray-900", style: { fontSize: '32px' } }, { children: !priceList.plan.pricingStyle || priceList.plan.pricingStyle === PricingStyle.PRICED
-            ? formatCurrency(priceList.monthlyBasePrice, priceList.currencyId, 0)
+            ? formatCurrency(getPrice(priceList), priceList.currencyId, priceDecimals)
             : priceList.plan.pricingStyle === PricingStyle.CONTACT_US
                 ? ''
                 : 'Free' })));
@@ -21397,7 +21417,9 @@ var PriceListCardPriceDescription = function (_a) {
                     fontSize: isMobile ? '13px' : '12px',
                 } }, { children: priceList.plan.pricingDescription && !isEmptyHtml(priceList.plan.pricingDescription) ? (jsx(Markup, { content: priceList.plan.pricingDescription })) : ("per ".concat((feature === null || feature === void 0 ? void 0 : feature.unitName) && !doesPlanHaveFlatFeeCharges
                     ? "".concat(feature.unitName.toLowerCase(), " / ")
-                    : '', "month")) })), priceList.periodMonths > 1 && (jsxs(Text$b, __assign({ className: "bunny-text-center bunny-text-gray-900", style: { fontSize: isMobile ? '12px' : '11px' } }, { children: ["billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] })))] }));
+                    : '').concat(priceList.showPriceAsMonthly
+                    ? 'month'
+                    : PERIOD_LABELS[periodMonthsConverter(priceList.periodMonths)])) })), priceList.periodMonths > 1 && (jsxs(Text$b, __assign({ className: "bunny-text-center bunny-text-gray-900", style: { fontSize: isMobile ? '12px' : '11px' } }, { children: ["billed ", BillingPeriodConverter$1[periodMonthsConverter(priceList.periodMonths)]] })))] }));
 };
 
 var CheckIcon = function (_a) {
@@ -21435,11 +21457,11 @@ var PriceListCardMobile = function (_a) {
             if (!disableOnClick)
                 onClick(priceList);
         }, style: {
-            minWidth: "220px",
+            minWidth: '220px',
             borderColor: isSelected ? brandColor : SLATE_200,
         } }, { children: [isSelected && (jsx("div", __assign({ className: "bunny-absolute", style: {
-                    top: "10px",
-                    right: "10px",
+                    top: '10px',
+                    right: '10px',
                 } }, { children: jsx(CheckIcon, { backgroundColor: brandColor, size: "20px" }) }))), jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-grow bunny-gap-2" }, { children: [jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsx(PriceListCardTitle, { isPriceListCurrentSubscription: isPriceListCurrentSubscription, priceList: priceList, trialRemainingDays: trialRemainingDays }), jsx(PriceListCardDescription, { description: description })] })), jsxs("div", __assign({ className: "bunny-flex bunny-flex-col bunny-items-center bunny-gap-2" }, { children: [jsx(PriceListCardPrice, { priceList: priceList }), jsx(PriceListCardPriceDescription, { feature: feature, priceList: priceList })] })), jsx(PriceListCardButton, { disableOnClick: disableOnClick, isPriceListCurrentSubscription: isPriceListCurrentSubscription, isSelected: isSelected, priceList: priceList, subscriptionPlan: subscriptionPlan })] }))] })));
 };
 

package/dist/esm/src/components/Subscriptions/PlanManager/PlanPicker/planPickerMobile/PriceListCardMobile.d.ts

@@ -1,4 +1,4 @@
-import { Feature, PriceList, Subscription } from "@bunnyapp/common";
+import { Feature, PriceList, Subscription } from '@bunnyapp/common';
 declare const PriceListCardMobile: ({ description, disableOnClick, feature, isPriceListCurrentSubscription, isSelected, onClick, priceList, subscriptionPlan, trialRemainingDays, }: {
     description: string;
     disableOnClick: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bunnyapp/components",
-  "version": "1.0.68-beta.6",
+  "version": "1.0.68-beta.7",
   "description": "Components from the Bunny portal to embed Bunny UI functionality into your application.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -64,7 +64,7 @@
   },
   "peerDependencies": {
     "@ant-design/icons": "^5.6.1",
-    "@bunnyapp/common": "^1.0.66-beta.5",
+    "@bunnyapp/common": "^1.0.66-beta.6",
     "@fortawesome/fontawesome-svg-core": "^6.7.2",
     "@fortawesome/free-brands-svg-icons": "^6.7.2",
     "@fortawesome/free-regular-svg-icons": "^6.7.2",