kupos-ui-components-lib 9.6.3 → 9.6.4

package/dist/components/ServiceItem/ServiceItemMobile.js

@@ -18,7 +18,7 @@ const exceptions = [
     "asiento_mascota",
 ];
 function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, }) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g;
     const isItemExpanded = serviceItem.id === isExpanded;
     const isPetSeat = (Object.keys(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.pet_seat_info) || []).length > 0;
     let isSoldOut = serviceItem.available_seats <= 0;
@@ -110,7 +110,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
                                     React.createElement("span", { style: { lineHeight: "normal" } }, getServiceStars(serviceItem))),
                                 React.createElement("div", { className: "flex items-center cursor-pointer ", style: { color: isSoldOut ? "#bbb" : "text-[#464647]" } },
                                     React.createElement("span", { className: "ml-[3px]  min-[420]:text-[13px] text-[12px] text-ellipsis overflow-hidden whitespace-nowrap max-w-[120px]" }, serviceItem.operator_details[2]))))) : null)),
-                React.createElement(DateTimeSectionMobile, { onBookButtonPress: onBookButtonPress, isCiva: isCiva, isSoldOut: isSoldOut, isLinatal: isLinatal, isPeru: isPeru, orignLabel: orignLabel, destinationLabel: destinationLabel, originIcon: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.origin, destinationIcon: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.destination, travelDate: serviceItem.travel_date, arrivalDate: serviceItem.arrival_date, depTime: serviceItem.dep_time, arrTime: serviceItem.arr_time, seatTypes: serviceItem.seat_types, seatPriceColor: colors.seatPriceColor, tooltipBgColor: colors.tooltipBgColor, currencySign: currencySign, availableSeats: serviceItem.available_seats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, showLastSeats: showLastSeats }),
+                React.createElement(DateTimeSectionMobile, { onBookButtonPress: onBookButtonPress, isCiva: isCiva, isSoldOut: isSoldOut, isLinatal: isLinatal, isPeru: isPeru, orignLabel: orignLabel, destinationLabel: destinationLabel, originIcon: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.origin, destinationIcon: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.destination, travelDate: serviceItem.travel_date, arrivalDate: serviceItem.arrival_date, depTime: serviceItem.dep_time, arrTime: serviceItem.arr_time, seatTypes: serviceItem.seat_types, seatPriceColor: colors.seatPriceColor, tooltipBgColor: colors.tooltipBgColor, currencySign: currencySign, availableSeats: serviceItem.available_seats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, showLastSeats: showLastSeats, discountSeatPriceColor: colors.discountSeatPriceColor }),
                 hasDiscount && (React.createElement("div", { className: "flex justify-end" }, isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)),
                 showLastSeats ? (React.createElement("div", { className: "flex justify-end  " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
                     (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[10px] text-center", style: {
@@ -119,7 +119,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
                 React.createElement("div", { className: "bg-[#E6E6E6]  mt-[10px] mb-[8px] h-[1px]" }),
                 React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (_e = serviceItem.duration) === null || _e === void 0 ? void 0 : _e.toString(), isDirectTrip: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip, directoColor: colors.directoColor, directoAnim: serviceItem.icons.directoAnim, isChangeTicket: serviceItem.is_change_ticket, isPetSeat: isPetSeat, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, flexibleAnim: serviceItem.icons.flexibleAnim, isTrackingEnabled: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled, locationAnim: serviceItem.icons.locationAnim, downArrowIcon: serviceItem.icons.downArrow, showDropdown: isItemExpanded, setShowDropdown: () => setIsExpanded(isItemExpanded ? null : serviceItem.id), onDropdownToggle: () => {
                         setIsExpanded(isItemExpanded ? null : serviceItem.id);
-                    }, isPeru: isPeru })),
+                    }, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })),
             React.createElement(ServiceBadgesMobile, { showTopLabel: showTopLabel, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, serviceItem: serviceItem, isConexion: isConexion })),
         ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) &&
             !isSoldOut && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
@@ -130,7 +130,10 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
             } },
             React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
                 React.createElement("div", { className: "flex justify-between items-center" },
-                    (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
+                    (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
+                        Object.keys((_f = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _f !== void 0 ? _f : {}).length ===
+                            0 &&
+                        ((_g = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _g !== void 0 ? _g : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
                         React.createElement(LottiePlayer, { animationData: serviceItem.icons.starAnimation, width: "14px", height: "14px" }),
                         React.createElement("span", { className: "text-[#fff]" }, "M\u00E1s elegido"))) : (React.createElement("div", { className: `flex ${((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 10 ? "items-start" : "items-center"}` },
                         React.createElement("div", { className: isLongOfferText ? "mt-[2px]" : "" },
@@ -177,6 +180,6 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
                     zIndex: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? -3 : undefined,
                     marginTop: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "-15px" : "-10px",
                 } },
-                React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true })))));
+                React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })))));
 }
 export default ServiceItemMobile;

package/dist/components/ServiceItem/mobileTypes.d.ts

@@ -34,11 +34,14 @@ export interface MobileServiceItemProps {
         change_ticket_hours?: number;
         duration?: number;
         train_type_label?: string;
+        ladies_booked_seats?: string;
         is_dp_enabled?: boolean;
         offer_text?: string;
         is_direct_trip?: boolean;
         is_train_type?: boolean;
         operator_service_name?: string;
+        dp_discount_percents?: Record<string, number>;
+        dp_discounted_seats?: string[];
         dep_validation_text?: string;
         metaData?: {};
         is_tracking_enabled?: boolean;
@@ -120,6 +123,7 @@ export interface MobileServiceItemProps {
             fireIcon?: string;
             directoIcon?: string;
             whiteFireIcon?: string;
+            femaleAnim?: string;
             [key: string]: string | Record<string, string | undefined> | undefined;
         };
         useLottieFor?: string[];
@@ -160,6 +164,7 @@ export interface MobileServiceItemProps {
         seatPriceColor?: string;
         rightGradiantColor?: string;
         leftGradiantColor?: string;
+        discountSeatPriceColor?: string;
     };
     isCiva?: boolean;
     currencySign?: string;

package/dist/components/ServiceItem/types.d.ts

@@ -39,15 +39,16 @@ export interface ServiceItemProps {
         offer_text?: string;
         is_direct_trip?: boolean;
         is_dp_enabled?: boolean;
-        dp_discount_percents?: Record<string, number | string> | Array<number | string>;
-        dp_discounted_seats?: Array<string | number>;
-        original_dp_price?: Record<string, number | string> | Array<number | string>;
+        dp_discount_percents?: any;
+        dp_discounted_seats?: any;
+        original_dp_price?: any;
         discount_type?: string;
         discount_value?: number;
         max_discount?: number;
         is_transpordo?: boolean;
         is_train_type?: boolean;
         operator_service_name?: string;
+        ladies_booked_seats?: string;
         dep_validation_text?: string;
         metaData?: {};
         is_tracking_enabled?: boolean;
@@ -222,4 +223,5 @@ export interface ServiceItemProps {
     };
     showLoginModal?: any;
     isLoggedIn?: any;
+    showLoginOption?: boolean;
 }

package/dist/styles.css

@@ -36,8 +36,8 @@
 .-top-\[18px\] {
   top: calc(18px * -1);
 }
-.top-1\/2 {
-  top: calc(1/2 * 100%);
+.top-1\/3 {
+  top: calc(1/3 * 100%);
 }
 .top-\[2px\] {
   top: 2px;
@@ -279,6 +279,9 @@
 .ml-\[10px\] {
   margin-left: 10px;
 }
+.ml-\[12px\] {
+  margin-left: 12px;
+}
 .ml-\[50px\] {
   margin-left: 50px;
 }
@@ -396,6 +399,12 @@
 .w-\[115px\] {
   width: 115px;
 }
+.w-\[120px\] {
+  width: 120px;
+}
+.w-\[130px\] {
+  width: 130px;
+}
 .w-\[150px\] {
   width: 150px;
 }
@@ -785,6 +794,9 @@
 .pt-\[6px\] {
   padding-top: 6px;
 }
+.pt-\[10px\] {
+  padding-top: 10px;
+}
 .pt-\[20px\] {
   padding-top: 20px;
 }
@@ -944,6 +956,9 @@
 .text-\[\#fff\] {
   color: #fff;
 }
+.text-\[red\] {
+  color: red;
+}
 .capitalize {
   text-transform: capitalize;
 }

package/dist/types.d.ts

@@ -50,6 +50,7 @@ export interface ServiceItemProps {
         is_direct_trip?: boolean;
         is_transpordo?: boolean;
         is_train_type?: boolean;
+        ladies_booked_seats?: any;
         operator_service_name?: string;
         dep_validation_text?: string;
         metaData?: {};

package/dist/ui/BottomAmenities/BottomAmenities.d.ts

@@ -10,6 +10,8 @@ interface BottomAmenitiesProps {
         is_tracking_enabled?: boolean;
         is_change_ticket?: boolean;
         pet_seat_info?: Record<string, any>;
+        ladies_booked_seats?: any;
+        is_dp_enabled?: boolean;
     };
     grayscaleClass: string;
     isSoldOut: boolean;

package/dist/ui/BottomAmenities/BottomAmenities.js

@@ -2,6 +2,7 @@ import React from "react";
 import LottiePlayer from "../../assets/LottiePlayer";
 import FlexibleBlock from "../FlexibleBlock";
 import PetBlock from "../PetBlock";
+import FemaleBlock from "../FemaleBlock";
 function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, }) {
     const hasPetInfo = serviceItem.pet_seat_info &&
         Object.keys(serviceItem.pet_seat_info).length > 0;
@@ -17,6 +18,9 @@ function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, i
             (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled) && (React.createElement("div", { className: grayscaleClass + " mr-[10px]" },
                 React.createElement(LottiePlayer, { animationData: getAnimationIcon("locationAnim"), width: "20px", height: "20px" }))),
             serviceItem.is_change_ticket && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
+            serviceItem.ladies_booked_seats &&
+                String(serviceItem.ladies_booked_seats).trim() !== "" &&
+                (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true && (React.createElement(FemaleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
             hasPetInfo && (React.createElement(PetBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, isSoldOut: isSoldOut })),
             isPeru ? null : (React.createElement("div", { className: `flex items-center cursor-pointer ml-[4px] transition-transform duration-300 w-[14px] h-[14px] ${isItemExpanded ? "rotate-180" : ""}`, onClick: onToggleExpand }, downArrowIcon)))));
 }

package/dist/ui/FemaleBlock.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+declare const FemaleBlock: ({ translation, getAnimationIcon, colors, serviceItem, isSoldOut, }: {
+    translation: any;
+    getAnimationIcon: any;
+    colors: any;
+    serviceItem: any;
+    isSoldOut: any;
+}) => React.JSX.Element;
+export default FemaleBlock;

package/dist/ui/FemaleBlock.js

@@ -0,0 +1,19 @@
+import React from "react";
+import LottiePlayer from "../assets/LottiePlayer";
+const FemaleBlock = ({ translation, getAnimationIcon, colors, serviceItem, isSoldOut, }) => (React.createElement("div", { className: "flex items-center" },
+    React.createElement("div", { className: "relative group cursor-pointer" },
+        React.createElement("div", { className: "flex items-center" },
+            React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
+                React.createElement(LottiePlayer
+                // animationData={serviceItem.icons.flexibleAnim}
+                , { 
+                    // animationData={serviceItem.icons.flexibleAnim}
+                    animationData: getAnimationIcon("femaaleAnimation"), width: "20px", height: "20px" }))),
+        React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[230px] text-center break-normal shadow-service text-[12px]", style: {
+                backgroundColor: colors.bottomStripColor,
+                lineHeight: "1.5",
+                zIndex: "1000",
+            } },
+            React.createElement("div", { className: "tooltip-arrow absolute -top-[7px] left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-l-transparent border-r-transparent ", style: { borderBottomColor: colors.bottomStripColor } }),
+            "Esta empresa cuenta con asientos recomendados para mujeres."))));
+export default FemaleBlock;

package/dist/ui/OfferBanner.d.ts

@@ -3,12 +3,13 @@ import { ServiceItemProps } from "../components/ServiceItem/types";
 interface OfferBannerProps {
     offerGradient: string;
     isSoldOut: boolean;
-    serviceItem: Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text">;
+    serviceItem: Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats">;
     renderIcon: (name: string, size: string) => React.ReactNode;
     isLoggedIn: any;
     showLoginModal: any;
     viewersConfig: ServiceItemProps["viewersConfig"];
     getAnimationIcon: (name: string) => any;
+    showLoginOption?: boolean;
 }
 declare const OfferBanner: React.FC<OfferBannerProps>;
 export default OfferBanner;

package/dist/ui/OfferBanner.js

@@ -1,28 +1,34 @@
 import React from "react";
 import LottiePlayer from "../assets/LottiePlayer";
 import CommonService from "../utils/CommonService";
-const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, }) => {
+const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, showLoginOption }) => {
+    var _a, _b, _c, _d;
     return (React.createElement("div", { className: "text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[36px] pt-[50px]  rounded-b-[14px] text-[14px]", style: {
             background: offerGradient,
             opacity: isSoldOut ? 0.5 : 1,
             // zIndex: 0,
         } },
         React.createElement("div", { className: "flex  justify-between items-center w-full" },
-            React.createElement("div", { className: "flex items-center " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? (React.createElement("div", { className: "flex items-center gap-[5px]" },
+            React.createElement("div", { className: "flex items-center " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
+                Object.keys((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _a !== void 0 ? _a : {}).length === 0 &&
+                ((_b = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _b !== void 0 ? _b : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[5px]" },
                 React.createElement(LottiePlayer, { animationData: getAnimationIcon("starAnimation"), width: "18px", height: "18px" }),
                 React.createElement("span", null, "Servicio popular entre los usuarios"))) : (React.createElement("div", { className: "flex items-center" },
                 React.createElement(LottiePlayer, { animationData: getAnimationIcon("bombAnimation"), width: "18px", height: "18px" }),
                 React.createElement("div", { className: "flex items-center mt-[2px]" },
-                    React.createElement("span", { className: "bold-text ml-[6px]" },
+                    React.createElement("span", { className: "bold-text", style: {
+                            marginLeft: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "6px" : "3px",
+                        } },
                         ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 30
                             ? ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").slice(0, 30) + "..."
                             : (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "",
                         " ",
-                        isLoggedIn ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
+                        isLoggedIn && showLoginOption ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
                         " ",
                         "\u00A0"),
                     " ",
-                    "| Termina en\u00A0",
+                    (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "|" : "",
+                    "Termina en\u00A0",
                     React.createElement("span", { className: "bold-text text-end", ref: (node) => CommonService.startCountdown(node, 599), style: {
                             fontVariantNumeric: "tabular-nums",
                             display: "inline-block",
@@ -38,7 +44,12 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLogg
                         " |",
                         " ",
                         React.createElement("span", { className: "" },
-                            (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? null : "Quedan pocos • ",
+                            (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
+                                Object.keys((_c = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _c !== void 0 ? _c : {}).length ===
+                                    0 &&
+                                ((_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _d !== void 0 ? _d : []).length === 0
+                                ? null
+                                : "Quedan pocos • ",
                             React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
                             " ",
                             "comprando")))))));

package/dist/ui/SeatSection/SeatSection.js

@@ -55,7 +55,7 @@ function getNumberOfSeats(seatTypes) {
     return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
 }
 function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, }) {
-    var _a, _b, _c;
+    var _a;
     const uniqueSeats = getUniqueSeats(seatTypes);
     const sortedSeatTypes = getSortedSeatTypes(seatTypes);
     const numberOfSeats = getNumberOfSeats(seatTypes);
@@ -129,12 +129,16 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
     // const dpDiscountEntry = Object.entries(
     //   serviceItem?.dp_discount_percents || {},
     // ).find(([, percent]) => Number(percent));
-    const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {})[0];
+    const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {}).sort(([, a], [, b]) => Number(a) - Number(b))[0];
     const dpDiscountPercent = dpDiscountEntry === null || dpDiscountEntry === void 0 ? void 0 : dpDiscountEntry[1];
-    const getFirstDpValue = (source) => {
+    const getLowestDpValue = (source) => {
         if (!source)
             return undefined;
-        return Array.isArray(source) ? source[0] : Object.values(source)[0];
+        const values = Array.isArray(source)
+            ? source
+            : Object.values(source);
+        const nums = values.map(Number).filter((n) => !isNaN(n) && n > 0);
+        return nums.length > 0 ? Math.min(...nums) : undefined;
     };
     const renderDpDiscountUi = (originalDpPrice, seatTypeFare) => {
         return (React.createElement("div", { className: "grid grid-cols-2 items-center text-[13.33px] relative" },
@@ -164,7 +168,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
                         } }))),
             React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
                 React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : "#ff5964" } },
-                    React.createElement("div", { className: "absolute", style: { left: isPeru ? "-1px" : "-8px" } }, renderIcon("fireIcon", "16px")),
+                    React.createElement("div", { className: "absolute", style: { left: isPeru ? "-1px" : "-19px", bottom: "1px" } }, renderIcon("fireIcon", "16px")),
                     availableSeats <= 0
                         ? CommonService.currency(0, currencySign)
                         : CommonService.discountedCurrency(Number(seatTypeFare), currencySign)))));
@@ -180,7 +184,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
                 React.createElement("span", { className: "text-[13.33px] font-normal leading-[24px] text-[#464647]" }, "Desde")),
             React.createElement("div", null,
                 React.createElement("div", { className: "relative" },
-                    React.createElement("div", { className: "absolute -left-[20px] top-1/2 transform -translate-y-1/2" }, renderIcon("fireIcon", "16px")),
+                    React.createElement("div", { className: "absolute -left-[20px] top-1/3 transform -translate-y-1/2" }, renderIcon("fireIcon", "16px")),
                     React.createElement("div", { className: "absolute bottom-[35px] left-1/2 -translate-x-1/2 ", style: {
                             animation: "pulse-zoom 2s ease-in-out infinite",
                             whiteSpace: "nowrap",
@@ -195,8 +199,11 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
                         : CommonService.discountedCurrency(lowestFare, currencySign))))));
     }
     if (dpDiscountEntry) {
-        const originalDpPrice = getFirstDpValue(serviceItem.original_dp_price);
-        const seatTypeFare = (_c = (_b = (_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.fare) !== null && _c !== void 0 ? _c : originalDpPrice;
+        const originalDpPrice = getLowestDpValue(serviceItem.original_dp_price);
+        const allFares = ((_a = serviceItem.seat_types) !== null && _a !== void 0 ? _a : [])
+            .map((st) => st.fare)
+            .filter((f) => f != null && !isNaN(Number(f)));
+        const seatTypeFare = allFares.length > 0 ? Math.min(...allFares) : originalDpPrice;
         if (originalDpPrice && seatTypeFare) {
             return renderDpDiscountUi(originalDpPrice, seatTypeFare);
         }
@@ -232,7 +239,8 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
             React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
                 React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : discountSeatPriceColor } },
                     React.createElement("div", { className: "absolute", style: {
-                            left: isPeru ? "-1px" : "-8px",
+                            left: isPeru ? "-1px" : "-18px",
+                            bottom: "1px"
                         } }, renderIcon("fireIcon", "16px")),
                     availableSeats <= 0
                         ? CommonService.currency(0, currencySign)

package/dist/ui/mobileweb/BottomAmenitiesMobile.d.ts

@@ -20,6 +20,9 @@ interface BottomAmenitiesMobileProps {
     onDropdownToggle: () => void;
     isItemExpanded?: boolean;
     isPeru?: boolean;
+    femaleAnim?: any;
+    ladiesBookedSeats?: string;
+    isDpEnabled?: boolean;
 }
-declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, }: BottomAmenitiesMobileProps): React.ReactElement;
+declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, }: BottomAmenitiesMobileProps): React.ReactElement;
 export default BottomAmenitiesMobile;

package/dist/ui/mobileweb/BottomAmenitiesMobile.js

@@ -1,6 +1,6 @@
 import React from "react";
 import LottiePlayer from "../../assets/LottiePlayer";
-function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, }) {
+function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, }) {
     return (React.createElement("div", { className: `${"flex justify-between items-center items-center "}` },
         React.createElement("div", { className: "w-[55%] flex justify-between items-center" },
             React.createElement("div", { style: { opacity: isSoldOut ? 0.5 : 1 } }, amenitiesNodes),
@@ -22,6 +22,13 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
                         React.createElement("div", { className: "flex items-center" },
                             React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
                                 React.createElement(LottiePlayer, { animationData: flexibleAnim, width: "16px", height: "16px" })))))),
+                ladiesBookedSeats &&
+                    String(ladiesBookedSeats).trim() !== "" &&
+                    isDpEnabled === true && (React.createElement("div", { className: "flex items-center" },
+                    React.createElement("div", { className: "relative group cursor-default" },
+                        React.createElement("div", { className: "flex items-center" },
+                            React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
+                                React.createElement(LottiePlayer, { animationData: femaleAnim, width: "16px", height: "16px" })))))),
                 isTrackingEnabled && (React.createElement("div", { className: "flex items-center mr-[10px]" },
                     React.createElement("div", { className: `h-auto mr-[4px] min-[420]:text-[13px] text-[11px] text-[#464647] ${isSoldOut ? "grayscale" : ""}` },
                         React.createElement(LottiePlayer, { animationData: locationAnim, width: "16px", height: "16px" }))))))),

package/dist/ui/mobileweb/DateTimeSectionMobile.d.ts

@@ -21,6 +21,7 @@ interface DateTimeSectionMobileProps {
     serviceItem?: any;
     tooltipBgColor?: string;
     showLastSeats?: boolean;
+    discountSeatPriceColor?: string;
 }
-declare function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }: DateTimeSectionMobileProps): React.ReactElement;
+declare function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }: DateTimeSectionMobileProps): React.ReactElement;
 export default DateTimeSectionMobile;

package/dist/ui/mobileweb/DateTimeSectionMobile.js

@@ -31,7 +31,7 @@ const TimeRow = ({ label, icon, alt, date, timeContent, isSoldOut, }) => (React.
             React.createElement("span", { className: "cursor-pointer black-text" }, DateService.getServiceItemDate(date)),
             React.createElement("div", { className: "absolute left-[50%]" }, "\u2022"),
             React.createElement("div", { className: "font-[900] relative black-text" }, timeContent)))));
-function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }) {
+function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }) {
     const { cleaned: cleanedDepTime, hasAM, hasPM } = getCleanedDepTime(depTime);
     const depTimeContent = isLinatal ? (React.createElement("div", null,
         React.createElement("span", null,
@@ -52,6 +52,6 @@ function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal
                 backgroundColor: "#ccc",
                 margin: "auto",
             } }),
-        React.createElement(SeatSectionMobile, { seatTypes: seatTypes, isSoldOut: isSoldOut, isPeru: isPeru, seatPriceColor: seatPriceColor, currencySign: currencySign, availableSeats: availableSeats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, tooltipBgColor: tooltipBgColor, showLastSeats: showLastSeats })));
+        React.createElement(SeatSectionMobile, { seatTypes: seatTypes, isSoldOut: isSoldOut, isPeru: isPeru, seatPriceColor: seatPriceColor, currencySign: currencySign, availableSeats: availableSeats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, tooltipBgColor: tooltipBgColor, showLastSeats: showLastSeats, discountSeatPriceColor: discountSeatPriceColor })));
 }
 export default DateTimeSectionMobile;

package/dist/ui/mobileweb/ExpandedDropdownMobile.d.ts

@@ -11,6 +11,8 @@ interface ExpandedDropdownMobileProps {
     petFriendlyAnim?: any;
     isSoldOut?: boolean;
     isChangeTicket?: boolean;
+    ladiesBookedSeats?: string;
+    isDpEnabled?: boolean;
 }
-declare function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyAnim, isSoldOut, isChangeTicket, }: ExpandedDropdownMobileProps): React.ReactElement;
+declare function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyAnim, isSoldOut, isChangeTicket, ladiesBookedSeats, isDpEnabled, }: ExpandedDropdownMobileProps): React.ReactElement;
 export default ExpandedDropdownMobile;

package/dist/ui/mobileweb/ExpandedDropdownMobile.js

@@ -1,6 +1,6 @@
 import React from "react";
 import LottiePlayer from "../../assets/LottiePlayer";
-function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyAnim, isSoldOut, isChangeTicket = false, }) {
+function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyAnim, isSoldOut, isChangeTicket = false, ladiesBookedSeats, isDpEnabled, }) {
     return (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[12px] relative -z-9", style: {
             backgroundColor: "#ffefef",
             borderRadius: "0 0 14px 14px",
@@ -24,6 +24,13 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
                     React.createElement("span", null,
                         React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
                         " Esta empresa no permite cambios de pasajes")))),
+            ladiesBookedSeats &&
+                String(ladiesBookedSeats).trim() !== "" &&
+                isDpEnabled === true && (React.createElement("div", { className: "flex gap-[6px]" },
+                React.createElement("span", { style: { marginTop: "2px" } }, "\u2022"),
+                React.createElement("span", null,
+                    React.createElement("span", { className: "bold-text" }, "Asientos para damas:"),
+                    " Esta empresa cuenta con asientos recomendados para mujeres."))),
             petSeatInfo && Object.keys(petSeatInfo).length > 0 ? (React.createElement("div", { className: "flex items-center" },
                 React.createElement("div", { className: `relative group cursor-default ` },
                     React.createElement("div", { className: "flex items-center" },

package/dist/ui/mobileweb/SeatSectionMobile.d.ts

@@ -15,6 +15,7 @@ interface SeatSectionMobileProps {
     serviceItem?: any;
     tooltipBgColor?: string;
     showLastSeats?: boolean;
+    discountSeatPriceColor?: string;
 }
-declare function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }: SeatSectionMobileProps): React.ReactElement;
+declare function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }: SeatSectionMobileProps): React.ReactElement;
 export default SeatSectionMobile;

package/dist/ui/mobileweb/SeatSectionMobile.js

@@ -42,9 +42,8 @@ const getUniqueSeats = (data, limit) => {
         .sort((a, b) => a.fare - b.fare)
         .slice(0, limit);
 };
-function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }) {
+function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-    console.log("🚀 ~ SeatSectionMobile ~ serviceItem:", serviceItem);
     const hasMultipleTypes = ((_a = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.length) !== null && _a !== void 0 ? _a : 0) > 2;
     const getFare = (fare) => {
         if (removeDuplicateSeats && availableSeats <= 0 && !isPeru) {
@@ -126,17 +125,29 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
         : discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.some((s) => s.originalPrice !== s.discountedPrice);
     const discountSeat = isPeru && peruDiscountCalc
         ? Object.assign({ label: "", fare: peruLowestFare }, peruDiscountCalc) : (_d = discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.filter((seat) => !EXCEPTIONS.includes(seat.label))) === null || _d === void 0 ? void 0 : _d.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
-    const discountValue = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "percentage" &&
-        typeof (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) === "number"
-        ? Math.round(serviceItem.discount_value)
-        : null;
-    const originalDpPrice = Array.isArray(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.original_dp_price)
-        ? serviceItem.original_dp_price[0]
-        : Object.values((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.original_dp_price) || {})[0];
-    const dpDiscountPercent = Array.isArray(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents)
-        ? serviceItem.dp_discount_percents[0]
-        : Object.values((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {})[0];
-    const firstSeatFare = (_f = (_e = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label) && !EXCEPTIONS.includes(item.label))) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.fare;
+    const discountValue = (() => {
+        if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "percentage" &&
+            typeof (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) === "number") {
+            return Math.round(serviceItem.discount_value);
+        }
+        if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "fixed" && discountSeat) {
+            const { originalPrice, discountedPrice } = discountSeat;
+            if (originalPrice > 0 && originalPrice !== discountedPrice) {
+                return Math.round(((originalPrice - discountedPrice) / originalPrice) * 100);
+            }
+        }
+        return null;
+    })();
+    const getMinValue = (data) => {
+        const vals = (Array.isArray(data) ? data : Object.values(data || {})).map(Number);
+        if (!vals.length)
+            return undefined;
+        const min = Math.min(...vals);
+        return isFinite(min) ? min : undefined;
+    };
+    const originalDpPrice = getMinValue(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.original_dp_price);
+    const dpDiscountPercent = getMinValue(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents);
+    const firstSeatFare = (_f = (_e = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label) && !EXCEPTIONS.includes(item.label))) === null || _e === void 0 ? void 0 : _e.sort((a, b) => a.fare - b.fare)[0]) === null || _f === void 0 ? void 0 : _f.fare;
     const hasDpDiscount = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) &&
         (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) &&
         originalDpPrice != null &&
@@ -172,7 +183,9 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
                     transformOrigin: "center",
                 } })),
         React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, "Desde"),
-        React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#ff5964" } },
+        React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
+                color: isSoldOut ? "#bbb" : discountSeatPriceColor || "#ff5964",
+            } },
             ((_h = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _h === void 0 ? void 0 : _h.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { filter: isSoldOut ? "grayscale" : "" } })) : null,
             commonService.discountedCurrency(Number(firstSeatFare), currencySign)),
         isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)) : hasDiscount && discountSeat ? (React.createElement("div", null,
@@ -204,7 +217,9 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
                         transformOrigin: "center",
                     } })),
             React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, "Desde"),
-            React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#ff5964" } },
+            React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
+                    color: isSoldOut ? "#bbb" : discountSeatPriceColor || "#ff5964",
+                } },
                 ((_j = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _j === void 0 ? void 0 : _j.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { opacity: isSoldOut ? 0.5 : 1 } })) : null,
                 commonService.discountedCurrency(discountSeat.discountedPrice, currencySign))))) : (React.createElement("div", { className: "flex flex-col justify-between h-[2.5rem] ", style: {
             gap: isSoldOut ? "0px" : "5px",

package/package.json

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