kupos-ui-components-lib 10.2.0 → 10.2.2

package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js

@@ -179,6 +179,7 @@ const renderSummaryDetailsCard = ({ serviceName, date, source, dest, boardingSta
 };
 const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData, currencySign, dateOnward, dateReturn, sourceOnward, sourceReturn, destinationOnward, destinationReturn, boardingStageOnward, boardingStageReturn, droppingStageOnward, droppingStageReturn, boardingTimeOnward, boardingTimeReturn, droppingTimeOnward, droppingTimeReturn, durationOnward, durationReturn, selectSeatOnward, selectSeatReturn, journeyTypeActive, setJourneyTypeActive, translation, trainTypeOnward, trainTypeReturn, colors, trainType, icons, selectedOnward, selectedReturn, conexionChecked, conexionPassengers, returnConexionFare, conexionFare, loginData, checkWhatsappEligibility, removeDiscountAtomValue, netFare, promoCode, onPromoRemove, isAgency, agencyFee, walletMoney, virtualMoney, virtualLimit, showUsd, netFareInUsd, renderDiscount, discountAmount, walletLabel, creditosLabel, currency, customSideBarwidth, isLinatal, insuranceData, isPeru, serviceFeeDataStateValue, isOpsite, }) => {
     var _a, _b, _c, _d, _e;
+    console.log("🚀 ~ PaymentSideBarDesktop ~ walletMoney:", walletMoney);
     // REMOVED AM/PM DUPLICATION AND ADDED 24 HOUR TIME FORMAT IN BOARDING STAGE
     const depTime = droppingTimeOnward || "";
     const returnTime = droppingTimeReturn || "";
@@ -456,7 +457,9 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
                             React.createElement("div", { className: "duration-mouseover font9", style: { lineHeight: "1.3" } },
                                 React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.serviceFeeHoverLabel)))), amount: CommonService.currency(serviceFeeDataStateValue === null || serviceFeeDataStateValue === void 0 ? void 0 : serviceFeeDataStateValue.total_convenience_fee_amount, currencySign), className: "font10", currency: currency, customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.serviceFeePriceColor } })),
                 isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), currency: "", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.agencyFeePriceColor }, isBoldText: true })),
-                walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: CommonService.currency(walletMoney, currencySign), currency: "", isBoldText: true })) : null,
+                walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: isPeru
+                        ? CommonService.currencyFixed(walletMoney, currencySign)
+                        : CommonService.currency(walletMoney, currencySign), currency: "", isBoldText: true })) : null,
                 virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text " }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(virtualMoney, currencySign), customStyle: { color: "var(--secondary-color)" }, currency: "", isBoldText: true })) : null,
                 showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), className: "text-[13.33px]", amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--secondary-color)" }, isBoldText: true })) : null),
             React.createElement("div", { className: `  text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[35px] pt-[50px] -z-10 rounded-b-[14px] text-[14px]`, style: { backgroundColor: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor } },

package/dist/components/PaymentSideBar/PaymentSideBarMobile.js

@@ -243,7 +243,9 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
                             : conexionFare, currencySign), className: "subtotal-row text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.seatPriceColor }, isBoldText: true })) : null,
                     removeDiscountAtomValue && (React.createElement(PaymentItem, { label: "Cup\u00F3n", amount: CommonService.currency(netFare, currencySign), isNegative: true, customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]", isBoldText: true })),
                     isAgency && (React.createElement(PaymentItem, { label: translation === null || translation === void 0 ? void 0 : translation.agencyFee, amount: CommonService.currency(agencyFee ? agencyFee : 0, currencySign), className: "text-[14px", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.agencyFeePriceColor }, isBoldText: true })),
-                    walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: CommonService.currency(walletMoney, currencySign), className: "text-[14px]", customStyle: { color: "var(--secondary-color)" }, currency: "", isBoldText: true })) : null,
+                    walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: isPeru
+                            ? CommonService.currencyFixed(walletMoney, currencySign)
+                            : CommonService.currency(walletMoney, currencySign), className: "text-[14px]", customStyle: { color: "var(--secondary-color)" }, currency: "", isBoldText: true })) : null,
                     virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text", style: { color: "var(--secondary-color)" } }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(virtualMoney, currencySign), customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]", currency: "", isBoldText: true })) : null,
                     showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "primary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--primary-color)" }, className: "text-[14px]", isBoldText: true })) : null)),
             React.createElement("div", { className: `  text-[#fff] p-[10px_15px] text-left w-full flex items-center absolute -bottom-[35px] pt-[50px] rounded-b-[14px] text-[14px]`, style: { backgroundColor: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor } },

package/dist/components/ServiceItem/ServiceItemMobile.js

@@ -126,7 +126,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
                     React.createElement("div", { className: "flex items-center justify-center gap-x-4", style: {
                             marginBottom: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDiscount ? "10px" : "",
                         } },
-                        React.createElement("div", { className: `w-[auto]  ${isFlores ? "" : "overflow-y-hidden"} h-[30px]` },
+                        React.createElement("div", { className: `w-[115px]  ${isFlores ? "" : "overflow-y-hidden"} h-[30px]` },
                             React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `w-[100px] h-auto object-contain  ${isSoldOut ? "grayscale" : ""}` })),
                         isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[12px] text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[12px] h-[22px] items-center" },
                             React.createElement("div", { className: "flex items-center" },

package/dist/styles.css

@@ -474,6 +474,9 @@
 .w-\[100px\] {
   width: 100px;
 }
+.w-\[115px\] {
+  width: 115px;
+}
 .w-\[150px\] {
   width: 150px;
 }

package/dist/ui/AmenitiesBlock.js

@@ -71,7 +71,6 @@ const AmenitiesBlock = ({ serviceItem, metaData, isSoldOut, colors, isPeru, getA
         amenities,
         priorityIds,
     });
-    console.log("🚀 ~ AmenitiesBlock ~ visibleAmenities:", visibleAmenities, amenities);
     const shouldShowPlus = plusAmenities.length > 0;
     const grayscaleClass = isSoldOut ? "grayscale" : "";
     return (React.createElement("div", { className: "relative flex items-center gap-[6px]" },

package/dist/utils/CommonService.d.ts

@@ -1,5 +1,6 @@
 declare const commonService: {
     currency(amount: number, currencySign?: string): string;
+    currencyFixed(amount: number, currencySign?: string, decimals?: number): string;
     currencyRounded(amount: number, currencySign?: string): string;
     discountedCurrency(amount: number, currencySign?: string): string;
     copyObject: (ob: any) => any;

package/dist/utils/CommonService.js

@@ -1,3 +1,10 @@
+/**
+ * Fixes floating-point precision artifacts (e.g. 3546.1500000000005 → 3546.15)
+ * by rounding to the given number of decimal places.
+ */
+const fixFloatPrecision = (amount, decimals = 2) => {
+    return parseFloat(amount.toFixed(decimals));
+};
 const commonService = {
     currency(amount, currencySign) {
         const formattedAmount = amount
@@ -6,6 +13,13 @@ const commonService = {
         const sign = currencySign || "$";
         return sign + formattedAmount;
     },
+    currencyFixed(amount, currencySign, decimals = 2) {
+        const formattedAmount = fixFloatPrecision(amount, decimals)
+            .toString()
+            .replace(/\B(?=(\d{3})+(?!\d))/g, ".");
+        const sign = currencySign || "$";
+        return sign + formattedAmount;
+    },
     currencyRounded(amount, currencySign) {
         const formattedAmount = Math.round(amount)
             .toString()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kupos-ui-components-lib",
-  "version": "10.2.0",
+  "version": "10.2.2",
   "description": "A reusable UI components package",
   "publishConfig": {
     "access": "public"

package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx

@@ -339,6 +339,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
   serviceFeeDataStateValue,
   isOpsite,
 }) => {
+  console.log("🚀 ~ PaymentSideBarDesktop ~ walletMoney:", walletMoney);
   // REMOVED AM/PM DUPLICATION AND ADDED 24 HOUR TIME FORMAT IN BOARDING STAGE
   const depTime = droppingTimeOnward || "";
   const returnTime = droppingTimeReturn || "";
@@ -860,7 +861,11 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
           {walletMoney ? (
             <PaymentItem
               label={walletLabel}
-              amount={CommonService.currency(walletMoney, currencySign)}
+              amount={
+                isPeru
+                  ? CommonService.currencyFixed(walletMoney, currencySign)
+                  : CommonService.currency(walletMoney, currencySign)
+              }
               currency=""
               isBoldText={true}
             />

package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx

@@ -666,7 +666,11 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
             {walletMoney ? (
               <PaymentItem
                 label={walletLabel}
-                amount={CommonService.currency(walletMoney, currencySign)}
+                amount={
+                  isPeru
+                    ? CommonService.currencyFixed(walletMoney, currencySign)
+                    : CommonService.currency(walletMoney, currencySign)
+                }
                 className="text-[14px]"
                 customStyle={{ color: "var(--secondary-color)" }}
                 currency=""

package/src/components/ServiceItem/ServiceItemMobile.tsx

@@ -266,7 +266,7 @@ function ServiceItemMobile({
                   }}
                 >
                   <div
-                    className={`w-[auto]  ${isFlores ? "" : "overflow-y-hidden"} h-[30px]`}
+                    className={`w-[115px]  ${isFlores ? "" : "overflow-y-hidden"} h-[30px]`}
                   >
                     <img
                       src={serviceItem.operator_details[0]}

package/src/ui/AmenitiesBlock.tsx

@@ -108,11 +108,6 @@ const AmenitiesBlock = ({
     amenities,
     priorityIds,
   });
-  console.log(
-    "🚀 ~ AmenitiesBlock ~ visibleAmenities:",
-    visibleAmenities,
-    amenities,
-  );
 
   const shouldShowPlus = plusAmenities.length > 0;
   const grayscaleClass = isSoldOut ? "grayscale" : "";

package/src/utils/CommonService.ts

@@ -1,3 +1,11 @@
+/**
+ * Fixes floating-point precision artifacts (e.g. 3546.1500000000005 → 3546.15)
+ * by rounding to the given number of decimal places.
+ */
+const fixFloatPrecision = (amount: number, decimals: number = 2): number => {
+  return parseFloat(amount.toFixed(decimals));
+};
+
 const commonService = {
   currency(amount: number, currencySign?: string) {
     const formattedAmount = amount
@@ -8,6 +16,15 @@ const commonService = {
     return sign + formattedAmount;
   },
 
+  currencyFixed(amount: number, currencySign?: string, decimals: number = 2) {
+    const formattedAmount = fixFloatPrecision(amount, decimals)
+      .toString()
+      .replace(/\B(?=(\d{3})+(?!\d))/g, ".");
+
+    const sign = currencySign || "$";
+    return sign + formattedAmount;
+  },
+
   currencyRounded(amount: number, currencySign?: string) {
     const formattedAmount = Math.round(amount)
       .toString()