kupos-ui-components-lib 9.10.9 → 9.11.0

package/dist/ui/FeatureServiceUI/FeatureServiceUi.js

@@ -1,12 +1,6 @@
 import React from "react";
 import LottiePlayer from "../../assets/LottiePlayer";
 import commonService from "../../utils/CommonService";
-const TIME_SLOTS = [
-    "Entre 07:00 AM y 10:00 AM",
-    "Entre 11:00 AM y 14:00 AM",
-    "Entre 15:00 PM y 18:00 PM",
-    "Entre 19:00 PM y 22:00 PM",
-];
 const HARDCODED_OPERATORS = [
     {
         logo: "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Turbus_logo.svg/320px-Turbus_logo.svg.png",
@@ -28,7 +22,7 @@ const HARDCODED_OPERATORS = [
     },
 ];
 const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIcon, cityOrigin, cityDestination, renderIcon, viewersConfig, isFeatureDropDownExpand, onToggleExpand, ticketQuantity = 1, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onBookButtonPress, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData = undefined, }) => {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f;
     // Use wow_deal services if available, otherwise fall back to serviceItem operators or hardcoded
     const operators = ((_a = wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.services) === null || _a === void 0 ? void 0 : _a.length) > 0
         ? wowDealData.services.slice(0, 3).map((service) => ({
@@ -50,6 +44,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
     const isPostPaymentAssignment = wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.is_post_payment_assignment;
     const dealWindowFrom = (wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.deal_window_from) || "07:00";
     const dealWindowTo = (wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.deal_window_to) || "10:00";
+    const serviceWindowHours = wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.service_window_hours;
     const travelDate = wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.travel_date;
     // Calculate countdown seconds from expires_at ISO timestamp
     const getCountdownSeconds = () => {
@@ -60,24 +55,49 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
         const seconds = Math.max(0, Math.floor((expires - now) / 1000));
         return seconds;
     };
-    // Generate time slot from deal window
-    const dynamicTimeSlot = `Entre ${dealWindowFrom} y ${dealWindowTo}`;
-    const displayTimeSlot = selectedTimeSlot || dynamicTimeSlot;
+    // Generate dynamic time slots from deal window + service window hours
+    const allTimeSlots = serviceWindowHours
+        ? commonService.generateTimeSlots(dealWindowFrom, dealWindowTo, serviceWindowHours)
+        : [];
+    // Filter slots to only those that have at least one service
+    const services = (wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.services) || [];
+    const availableTimeSlots = allTimeSlots.filter((slot) => services.some((s) => {
+        const depMin = commonService.timeToMinutes(s.departure_time);
+        return depMin >= slot.start && depMin < slot.end;
+    }));
+    // Active slot: the one matching selectedTimeSlot label, or the first available
+    const activeSlot = availableTimeSlots.find((s) => s.label === selectedTimeSlot) ||
+        availableTimeSlots[0];
+    // Services that fall within the active slot, sorted by final price ascending
+    const servicesInActiveSlot = activeSlot
+        ? services
+            .filter((s) => {
+            const depMin = commonService.timeToMinutes(s.departure_time);
+            return depMin >= activeSlot.start && depMin < activeSlot.end;
+        })
+            .sort((a, b) => a.final_price - b.final_price)
+        : services;
+    // The selected price (final and original) from the cheapest service in the active slot
+    const selectedSlotService = servicesInActiveSlot === null || servicesInActiveSlot === void 0 ? void 0 : servicesInActiveSlot[0];
+    const displayFinalPrice = selectedSlotService
+        ? selectedSlotService.final_price
+        : finalPrice;
+    const displayOriginalPrice = selectedSlotService
+        ? selectedSlotService.original_price
+        : originalPrice;
+    const displaySavingsPercent = selectedSlotService && selectedSlotService.original_price
+        ? Math.round(((selectedSlotService.original_price -
+            selectedSlotService.final_price) /
+            selectedSlotService.original_price) *
+            100)
+        : savingsPercent;
+    // The label shown on the dropdown button
+    const departureRange = (activeSlot === null || activeSlot === void 0 ? void 0 : activeSlot.label) || `Entre ${dealWindowFrom} y ${dealWindowTo}`;
     const isItemExpanded = serviceItem.id === isFeatureDropDownExpand ||
         isFeatureDropDownExpand === true;
     const isThisTimeDropdownOpen = isTimeDropdownOpen === serviceItem.id;
     const canDecreaseTicketQuantity = ticketQuantity > 1;
     const canIncreaseTicketQuantity = ticketQuantity < maxSeatsPerBooking;
-    const departures = (_d = (_c = wowDealData === null || wowDealData === void 0 ? void 0 : wowDealData.services) === null || _c === void 0 ? void 0 : _c.map((s) => s.departure_time)) === null || _d === void 0 ? void 0 : _d.filter(Boolean);
-    let departureRange = `Entre ${dealWindowFrom} y ${dealWindowTo}`;
-    if (departures === null || departures === void 0 ? void 0 : departures.length) {
-        const sorted = [...departures].sort((a, b) => {
-            const [ah, am] = a.split(":").map(Number);
-            const [bh, bm] = b.split(":").map(Number);
-            return ah * 60 + am - (bh * 60 + bm);
-        });
-        departureRange = `Entre ${sorted[0]} y ${sorted[sorted.length - 1]}`;
-    }
     const HOW_IT_WORKS_STEPS = [
         {
             icon: "flexible",
@@ -143,7 +163,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                         } },
                         React.createElement("span", null,
                             "AHORRAS ",
-                            savingsPercent,
+                            displaySavingsPercent,
                             "%"))),
                 React.createElement("div", { className: "flex items-center" },
                     React.createElement("div", { className: "mb-[2px]" },
@@ -154,7 +174,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                             animationData: getAnimationIcon("flameAnimation"), width: "18px", height: "18px" })),
                     React.createElement("span", { className: "bold-text" }, "Remate"),
                     "\u00A0t\u00E9rmina en \u00A0",
-                    React.createElement("span", { className: "bold-text text-end", ref: (node) => commonService.startCountdown(node, getCountdownSeconds()), style: {
+                    React.createElement("span", { className: "bold-text text-end", ref: (node) => commonService.startDealCountdown(node, getCountdownSeconds()), style: {
                             fontVariantNumeric: "tabular-nums",
                             display: "inline-block",
                             color: "#FF5C60",
@@ -165,10 +185,10 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                     React.createElement("div", { className: "flex flex-col justify-between gap-[20px] mb-[16px] pr-[22px]" },
                         React.createElement("div", { className: "flex flex-col gap-[8px]" },
                             React.createElement("div", { className: "flex items-center gap-[8px]" },
-                                React.createElement("img", { src: (_e = serviceItem.icons) === null || _e === void 0 ? void 0 : _e.whiteOrigin, alt: "origin", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}` }),
+                                React.createElement("img", { src: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.whiteOrigin, alt: "origin", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}` }),
                                 React.createElement("span", { className: "text-[13px] bold-text" }, cityOrigin === null || cityOrigin === void 0 ? void 0 : cityOrigin.label.split(",")[0])),
                             React.createElement("div", { className: "flex items-center gap-[8px]" },
-                                React.createElement("img", { src: (_f = serviceItem.icons) === null || _f === void 0 ? void 0 : _f.whiteDestination, alt: "destination", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
+                                React.createElement("img", { src: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.whiteDestination, alt: "destination", className: `w-[14px] h-[14px] shrink-0 ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
                                 React.createElement("span", { className: "text-[13px] bold-text" }, cityDestination === null || cityDestination === void 0 ? void 0 : cityDestination.label.split(",")[0]))),
                         React.createElement("div", { className: "flex flex-col gap-[10px]" },
                             React.createElement("div", { className: "text-[12px] bold-text" }, travelDate
@@ -178,7 +198,50 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                                     month: "long",
                                 })
                                 : "Viernes 23 de mayo"),
-                            React.createElement("div", { className: "bold-text text-[12px] text-white" }, departureRange)),
+                            React.createElement("div", { className: "kupos-time-dd relative", tabIndex: 0, onBlur: (e) => {
+                                    if (!e.currentTarget.contains(e.relatedTarget)) {
+                                        onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
+                                    }
+                                }, style: { outline: "none" } },
+                                React.createElement("button", { type: "button", onClick: () => onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(isThisTimeDropdownOpen ? null : serviceItem.id), className: "flex whitespace-nowrap cursor-pointer select-none items-center gap-[6px] border-none bg-transparent p-0 bold-text text-[12px] text-[white]" },
+                                    React.createElement("span", null, departureRange),
+                                    React.createElement("img", { src: (_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _e === void 0 ? void 0 : _e.downArrow, alt: "down arrow", className: `kupos-time-chevron transition-transform duration-200 ${isThisTimeDropdownOpen ? "rotate-180" : "rotate-0"}`, style: {
+                                            width: "12px",
+                                            height: "8px",
+                                            filter: "brightness(0) invert(1)",
+                                        } })),
+                                isThisTimeDropdownOpen && (React.createElement(React.Fragment, null,
+                                    React.createElement("div", { className: "absolute left-0 top-[calc(100%+10px)] hover:z-[200]", style: {
+                                            zIndex: 20,
+                                            backgroundColor: "#fff",
+                                            borderRadius: "14px",
+                                            minWidth: "190px",
+                                            boxShadow: "0 8px 32px rgba(0,0,0,0.28)",
+                                            overflow: "hidden",
+                                            padding: "6px 0",
+                                        } }, availableTimeSlots.map((slot) => {
+                                        const isActive = slot.label === selectedTimeSlot ||
+                                            slot === activeSlot;
+                                        // Count services in this slot
+                                        const count = services.filter((s) => {
+                                            const depMin = commonService.timeToMinutes(s.departure_time);
+                                            return depMin >= slot.start && depMin < slot.end;
+                                        }).length;
+                                        return (React.createElement("button", { key: slot.label, type: "button", onClick: () => {
+                                                onTimeSlotChange === null || onTimeSlotChange === void 0 ? void 0 : onTimeSlotChange(slot.label);
+                                                onTimeDropdownToggle === null || onTimeDropdownToggle === void 0 ? void 0 : onTimeDropdownToggle(null);
+                                                const slotServices = services.filter((s) => {
+                                                    const depMin = commonService.timeToMinutes(s.departure_time);
+                                                    return (depMin >= slot.start && depMin < slot.end);
+                                                });
+                                                console.log("Selected slot label:", slot.label);
+                                                console.log("Services in selected slot:", slotServices);
+                                            }, className: `flex w-full cursor-pointer items-center justify-between gap-[10px] border-none px-[12px] py-[9px] text-left text-[13px] ${isActive ? "bg-[#FF5C60] font-bold text-[white]" : "bg-transparent font-normal text-[#1a1a1a]"}` },
+                                            React.createElement("span", null, slot.label),
+                                            count > 0 && (React.createElement("span", { className: `text-[11px] rounded-full px-[6px] py-[2px] font-bold ${isActive
+                                                    ? "bg-white text-[#FF5C60]"
+                                                    : "bg-[#FF5C60] text-white"}` }, count))));
+                                    })))))),
                         React.createElement("div", { className: "flex flex-col items-start gap-[10px] text-[12px] " },
                             React.createElement("div", { className: "flex items-justify gap-[8px]" },
                                 renderIcon("sheildIcon", "16px"),
@@ -193,12 +256,25 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                     React.createElement("div", { className: "min-w-0 px-[22px] flex flex-col items-center justify-between gap-[16px] py-[2px] border-r border-[#363c48] border-l border-[#363c48]" },
                         React.createElement("div", { className: "text-center" },
                             React.createElement("div", { className: "bold-text text-[13px]" },
-                                operatorsCompetingCount,
-                                " operadores compitiendo por tu compra")),
-                        React.createElement("div", { className: "grid w-full grid-cols-3 items-stretch gap-[14px] " }, operators.map((op, idx) => (React.createElement("div", { key: idx, className: "flex min-w-0 flex-col items-center justify-center gap-[8px] rounded-[8px]", style: {
-                                // height: "80px",
+                                servicesInActiveSlot.length > 0
+                                    ? servicesInActiveSlot.length
+                                    : operatorsCompetingCount,
+                                " ",
+                                "operadores compitiendo por tu compra")),
+                        React.createElement("div", { className: "grid w-full items-stretch gap-[14px]", style: {
+                                gridTemplateColumns: `repeat(${Math.min(servicesInActiveSlot.length || operators.length, 3)}, 1fr)`,
+                            } }, (servicesInActiveSlot.length > 0
+                            ? servicesInActiveSlot.slice(0, 3).map((s) => ({
+                                logo: s.operator_logo_url,
+                                name: s.operator_name,
+                                time: s.departure_time,
+                                seatsAvailable: `${s.available_seats} disponibles`,
+                            }))
+                            : operators).map((op, idx) => (React.createElement("div", { key: idx, className: "flex min-w-0 flex-col items-center justify-center gap-[8px] rounded-[8px]", style: {
+                                // border: "1px solid #363c48",
+                                // backgroundColor: "#fff",
                                 border: "1px solid #363c48",
-                                backgroundColor: "#fff",
+                                backgroundColor: "#1a202e",
                                 padding: "14px 10px",
                             } },
                             React.createElement("img", { src: op.logo, alt: op.name, onError: (e) => {
@@ -207,10 +283,10 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                                         ((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details) === null || _a === void 0 ? void 0 : _a[0]) ||
                                             "/images/service-list/bus-icon.svg";
                                 }, className: `h-[24px] max-w-full object-contain ${isSoldOut ? "grayscale" : ""}` }),
-                            React.createElement("span", { className: "text-[11px] truncate max-w-full text-center text-[#464647]" }, op.name),
+                            React.createElement("span", { className: "text-[11px] truncate max-w-full text-center text-[white] whitespace-nowrap " }, op.name),
                             React.createElement("div", { className: "bg-[#FF8F45] text-white text-[12px] font-bold px-[10px] py-[4px] rounded-[4px] bold-text whitespace-nowrap" },
                                 React.createElement("span", null, op === null || op === void 0 ? void 0 : op.time)),
-                            React.createElement("span", { className: "text-[10px] mt-[6px] text-[#464647]" }, op === null || op === void 0 ? void 0 : op.seatsAvailable))))),
+                            React.createElement("span", { className: "text-[10px] mt-[6px] text-[white]" }, op === null || op === void 0 ? void 0 : op.seatsAvailable))))),
                         React.createElement("div", { className: "flex w-full items-center justify-center gap-[6px] text-[12px] rounded-full", style: {
                                 padding: "8px 14px",
                                 marginBottom: "6px",
@@ -244,10 +320,10 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                                     animation: "pulse-zoom 2s ease-in-out infinite",
                                     whiteSpace: "nowrap",
                                 } },
-                                savingsPercent,
+                                displaySavingsPercent,
                                 "% OFF"),
                             React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#9f9f9f] relative", style: { position: "relative" } },
-                                `$${(originalPrice * ticketQuantity).toLocaleString()}`,
+                                `$${(displayOriginalPrice * ticketQuantity).toLocaleString()}`,
                                 React.createElement("span", { style: {
                                         position: "absolute",
                                         left: "-2px",
@@ -258,7 +334,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                                         transform: "rotate(-10deg)",
                                         transformOrigin: "center",
                                     } })),
-                            React.createElement("span", { className: "text-white bold-text text-[28px] leading-none" }, `$${(finalPrice * ticketQuantity).toLocaleString()}`)),
+                            React.createElement("span", { className: "text-white bold-text text-[28px] leading-none" }, `$${(displayFinalPrice * ticketQuantity).toLocaleString()}`)),
                         React.createElement("div", { className: "mt-[4px] flex flex-col items-center gap-[8px]" },
                             React.createElement("span", { className: "text-[12px] text-white" }, "\u00BFCu\u00E1ntos pasajes quieres?"),
                             React.createElement("div", { className: "flex w-full items-center justify-between rounded-[16px] ", style: {
@@ -288,7 +364,7 @@ const FeatureServiceUi = ({ serviceItem, showTopLabel, isSoldOut, getAnimationIc
                                 animationData: getAnimationIcon("thunderAnimation"), width: "16px", height: "16px" }),
                             React.createElement("span", { className: "whitespace-nowrap" }, "\u00A1Lo quiero!"))),
                     React.createElement("div", { className: `absolute bottom-[11px] right-[18px] cursor-pointer transition-transform duration-300 ease-in-out ${isItemExpanded ? "rotate-180" : ""}`, onClick: onToggleExpand },
-                        React.createElement("img", { src: (_g = serviceItem.icons) === null || _g === void 0 ? void 0 : _g.downArrow, alt: "down arrow", style: {
+                        React.createElement("img", { src: (_f = serviceItem.icons) === null || _f === void 0 ? void 0 : _f.downArrow, alt: "down arrow", style: {
                                 width: "14px",
                                 height: "8px",
                                 filter: "brightness(0) invert(1)",

package/dist/ui/SeatSection/SeatSection.d.ts

@@ -3,8 +3,6 @@ interface SeatType {
     label: string;
     fare: number;
     key: any;
-    apiSeatType?: string;
-    api_seat_type?: string;
 }
 interface SeatSectionProps {
     seatTypes: SeatType[];
@@ -18,11 +16,7 @@ interface SeatSectionProps {
     serviceItem?: any;
     renderIcon?: (iconKey: string, size?: string) => React.ReactNode;
     discountSeatPriceColor?: string;
-    isTrain?: boolean;
-    selectedSeatKey?: any;
-    onSeatSelect?: (key: any, price: number, seatKey: string, apiSeatType?: string) => void;
-    topLabelColor?: string;
     tooltipColor?: string;
 }
-declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isTrain, topLabelColor, tooltipColor, }: SeatSectionProps): React.ReactElement;
+declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, tooltipColor, }: SeatSectionProps): React.ReactElement;
 export default SeatSection;

package/dist/ui/SeatSection/SeatSection.js

@@ -8,13 +8,11 @@ function getAllSeatTypes(seatTypes) {
     let seatTypesWithPrices = seatTypes.filter(Boolean).map((val) => ({
         label: val === null || val === void 0 ? void 0 : val.label,
         price: val === null || val === void 0 ? void 0 : val.fare,
-        key: val === null || val === void 0 ? void 0 : val.key,
-        apiSeatType: (val === null || val === void 0 ? void 0 : val.apiSeatType) || (val === null || val === void 0 ? void 0 : val.api_seat_type),
     }));
     seatTypesWithPrices.sort((a, b) => a.price - b.price);
     return seatTypesWithPrices;
 }
-function getSortedSeatTypes(seatTypes, isTrain) {
+function getSortedSeatTypes(seatTypes) {
     if (!(seatTypes === null || seatTypes === void 0 ? void 0 : seatTypes.length)) {
         return [{ label: "Salon cama", price: 0 }];
     }
@@ -23,9 +21,7 @@ function getSortedSeatTypes(seatTypes, isTrain) {
     if (premiumIndex >= 3) {
         seatTypesWithPrices[2] = seatTypesWithPrices[premiumIndex];
     }
-    if (!isTrain) {
-        seatTypesWithPrices = seatTypesWithPrices.slice(0, 2);
-    }
+    seatTypesWithPrices = seatTypesWithPrices.slice(0, 2);
     const seenPrices = new Set();
     seatTypesWithPrices = seatTypesWithPrices.filter((seat) => {
         if (seenPrices.has(seat.price))
@@ -58,10 +54,11 @@ function getUniqueSeats(seatTypes) {
 function getNumberOfSeats(seatTypes) {
     return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
 }
-function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isTrain, topLabelColor, tooltipColor, }) {
+function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, tooltipColor, }) {
     var _a;
     const uniqueSeats = getUniqueSeats(seatTypes);
-    const sortedSeatTypes = getSortedSeatTypes(seatTypes, isTrain);
+    const sortedSeatTypes = getSortedSeatTypes(seatTypes);
+    console.log("🚀 ~ SeatSection ~ sortedSeatTypes:", sortedSeatTypes);
     const numberOfSeats = getNumberOfSeats(seatTypes);
     const isCentered = numberOfSeats < 2 || removeDuplicateSeats;
     const formatPrice = (price) => availableSeats <= 0
@@ -69,36 +66,11 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
         : CommonService.currency(price, currencySign);
     const renderSeatNames = () => {
         const seats = removeDuplicateSeats ? uniqueSeats : sortedSeatTypes;
-        return seats.map((val, key) => {
-            return SEAT_EXCEPTIONS.includes(val.label) ? null : (React.createElement("div", { className: "flex items-center", style: isTrain ? { cursor: "pointer" } : undefined, onClick: isTrain && !isSoldOut
-                    ? () => val.label === selectedSeatKey
-                        ? onSeatSelect === null || onSeatSelect === void 0 ? void 0 : onSeatSelect(null, 0, "", "")
-                        : onSeatSelect === null || onSeatSelect === void 0 ? void 0 : onSeatSelect(val.label, val.price, val.key, val.apiSeatType)
-                    : undefined },
-                isTrain && (React.createElement("div", { style: {
-                        border: `1px solid ${val.label === selectedSeatKey ? topLabelColor : "#ccc"}`,
-                        borderRadius: "50%",
-                        width: "14px",
-                        height: "14px",
-                        minWidth: "14px",
-                        marginRight: "10px",
-                        display: "flex",
-                        alignItems: "center",
-                        justifyContent: "center",
-                    } }, val.label === selectedSeatKey && (React.createElement("div", { style: {
-                        backgroundColor: topLabelColor,
-                        borderRadius: "50%",
-                        width: "7px",
-                        height: "7px",
-                    } })))),
-                React.createElement("span", { key: key, className: `flex items-center justify-between text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` }, typeof val.label === "string" || typeof val.label === "number"
-                    ? removeDuplicateSeats && isPeru
-                        ? CommonService.truncateSeatLabel(val.label)
-                        : isTrain
-                            ? CommonService.truncateSeatLabel(CommonService.capitalize(String(val.label)), 8)
-                            : val.label
-                    : null)));
-        });
+        return seats.map((val, key) => SEAT_EXCEPTIONS.includes(val.label) ? null : (React.createElement("span", { key: key, className: `flex items-center justify-between text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` }, typeof val.label === "string" || typeof val.label === "number"
+            ? removeDuplicateSeats && isPeru
+                ? CommonService.truncateSeatLabel(val.label)
+                : val.label
+            : null)));
     };
     const renderSeatPrices = () => {
         if (isPeru) {
@@ -145,13 +117,20 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
     })();
     const renderLabels = () => {
         if (isPeru) {
+            const seats = removeDuplicateSeats ? uniqueSeats : sortedSeatTypes;
+            const filteredSeats = seats.filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
+            const seatLabel = filteredSeats.length > 0
+                ? removeDuplicateSeats
+                    ? CommonService.truncateSeatLabel(filteredSeats[0].label)
+                    : filteredSeats[0].label
+                : null;
+            const operatorServiceName = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus";
+            const bottomLabel = operatorServiceName || "Desde";
             return (React.createElement(React.Fragment, null,
                 hasDiscount && (React.createElement("span", { className: "text-[13.33px]", style: {
                         color: "#999",
-                        // position: "relative",
-                        // bottom: numberOfSeats ? "10px" : "",
                     } }, "Antes")),
-                React.createElement("span", { className: "text-[13.33px]" }, "Desde")));
+                React.createElement("span", { className: "text-[13.33px] flex flex-col" }, operatorServiceName ? (React.createElement("span", { className: "text-[13.33px]" }, seatLabel)) : (React.createElement("span", { className: "text-[13.33px]" }, "Desde")))));
         }
         return renderSeatNames();
     };

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

@@ -22,7 +22,6 @@ interface DateTimeSectionMobileProps {
     tooltipBgColor?: string;
     showLastSeats?: boolean;
     discountSeatPriceColor?: string;
-    isTrain?: boolean;
 }
-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, isTrain, }: 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

@@ -23,10 +23,8 @@ const getCleanedDepTime = (raw) => {
 };
 const TimeRow = ({ label, icon, alt, date, timeContent, isSoldOut, }) => {
     const formattedDate = DateService.getServiceItemDate(date);
-    const dotPositionClass = formattedDate.includes("dom")
-        ? "max-[399px]:left-[53%]"
-        : "";
-    return (React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[12px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
+    const dotPositionClass = formattedDate.includes("dom") ? "max-[399px]:left-[53%]" : "";
+    return React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[12px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
         React.createElement("div", { className: "flex items-center", style: { flex: 1 } },
             React.createElement("div", null,
                 " ",
@@ -35,9 +33,9 @@ const TimeRow = ({ label, icon, alt, date, timeContent, isSoldOut, }) => {
             React.createElement("div", { className: "flex items-center relative capitalize justify-between", style: { flex: 1 } },
                 React.createElement("span", { className: "cursor-pointer black-text" }, formattedDate),
                 React.createElement("div", { className: `absolute left-[50%] ${dotPositionClass}` }, "\u2022"),
-                React.createElement("div", { className: "font-[900] relative black-text" }, timeContent)))));
+                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, discountSeatPriceColor, isTrain, }) {
+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,
@@ -49,11 +47,7 @@ function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal
             ? null
             : DateService.ampmOnly(depTime)))) : (DateService.formatTime(depTime));
     return (React.createElement("div", { className: "flex justify-between gap-[5px] w-full", onClick: onBookButtonPress },
-        React.createElement("div", { className: `flex flex-col gap-[4px] w-[50%] ${isTrain ? "justify-center" : "justify-between"}`, style: {
-                justifyContent: isCiva && "center",
-                minHeight: isTrain ? undefined : "2.5rem",
-                alignSelf: isTrain ? "stretch" : undefined,
-            } },
+        React.createElement("div", { className: "min-h-[2.5rem] flex flex-col justify-between gap-[4px] w-[50%] ", style: { justifyContent: isCiva && "center" } },
             React.createElement(TimeRow, { label: orignLabel, icon: originIcon, alt: "origin", date: travelDate, timeContent: depTimeContent, isSoldOut: isSoldOut }),
             isCiva ? null : (React.createElement(TimeRow, { label: destinationLabel, icon: destinationIcon, alt: "destination", date: arrivalDate, timeContent: DateService.formatTime(arrTime), isSoldOut: isSoldOut }))),
         React.createElement("div", { style: {
@@ -62,6 +56,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, discountSeatPriceColor: discountSeatPriceColor, isTrain: isTrain })));
+        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/SeatSectionMobile.d.ts

@@ -16,7 +16,6 @@ interface SeatSectionMobileProps {
     tooltipBgColor?: string;
     showLastSeats?: boolean;
     discountSeatPriceColor?: string;
-    isTrain?: boolean;
 }
-declare function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, isTrain, }: 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

@@ -11,7 +11,7 @@ const EXCEPTIONS = [
     "blanco",
     "asiento_mascota",
 ];
-const SeatRow = ({ type, index, displayLabel, fare, isSoldOut, seatPriceColor, hasMultipleTypes, textSize, isTrain, }) => {
+const SeatRow = ({ type, index, displayLabel, fare, isSoldOut, seatPriceColor, hasMultipleTypes, textSize, }) => {
     if (EXCEPTIONS.includes(type.label))
         return null;
     const rowClass = hasMultipleTypes
@@ -20,9 +20,7 @@ const SeatRow = ({ type, index, displayLabel, fare, isSoldOut, seatPriceColor, h
     const labelColor = isSoldOut ? "#bbb" : "#464647";
     const priceColor = isSoldOut ? "#bbb" : seatPriceColor;
     return (React.createElement("div", { className: rowClass, key: index },
-        React.createElement("span", { className: `min-[420]:text-[13px] ${textSize} `, style: { color: labelColor } }, isTrain
-            ? commonService.truncateSeatLabel(commonService.capitalize(displayLabel), 8)
-            : displayLabel),
+        React.createElement("span", { className: `min-[420]:text-[13px] ${textSize} `, style: { color: labelColor } }, displayLabel),
         React.createElement("span", { className: `min-[420]:text-[13px] ${textSize}  bold-text`, style: { color: priceColor } }, fare)));
 };
 const getFilteredSeats = (item) => {
@@ -44,8 +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, discountSeatPriceColor, isTrain, }) {
-    var _a, _b, _c, _d, _e, _f, _g;
+function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     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) {
@@ -67,12 +65,20 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
             return null;
         const priceColor = isSoldOut ? "#bbb" : seatPriceColor;
         const { originalPrice, discountedPrice } = commonService.calculateDiscountedPrice(lowestFare, serviceItem);
+        const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus";
+        const uniqueSeats = getUniqueSeats(seatTypesData !== null && seatTypesData !== void 0 ? seatTypesData : [], 1);
+        const seatLabel = uniqueSeats.length > 0
+            ? commonService.truncateSeatLabel(uniqueSeats[0].label)
+            : null;
+        const bottomLabel = isMovilBus ? seatLabel || "Desde" : "Desde";
         return (React.createElement(React.Fragment, null,
             originalPrice !== discountedPrice && (React.createElement("div", { className: "w-[100%] flex flex-row justify-between items-center" },
                 React.createElement("span", { className: "min-[420]:text-[13px] text-[12px]", style: { color: "#bbb" } }, "Antes"),
                 React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] line-through", style: { color: "#bbb" } }, commonService.currency(originalPrice, currencySign)))),
             React.createElement("div", { className: "w-[100%] flex flex-row justify-between items-center" },
-                React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: isSoldOut ? "#bbb" : "#464647" } }, "Desde"),
+                React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: isSoldOut ? "#bbb" : "#464647" } }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus"
+                    ? seatLabel
+                    : "Desde"),
                 React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: priceColor } }, commonService.currency(discountedPrice, currencySign)))));
     };
     const renderDpSeats = () => {
@@ -103,24 +109,19 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
                 React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] text-[#464647]", style: { opacity: isSoldOut ? 0.5 : 1 } }, "Agotado"))) : null));
     };
     const renderSeats = () => {
-        var _a, _b;
+        var _a, _b, _c;
         if (isPeru) {
             return renderPeruSeats();
         }
         if (removeDuplicateSeats) {
             const uniqueSeats = getUniqueSeats(seatTypesData, 3);
-            return uniqueSeats.map((type, i) => (React.createElement(SeatRow, { key: i, type: type, index: i, displayLabel: commonService.truncateSeatLabel(type.label), fare: getFare(type.fare), isSoldOut: isSoldOut, seatPriceColor: seatPriceColor, hasMultipleTypes: hasMultipleTypes, textSize: "text-[11px]", isTrain: isTrain })));
+            return uniqueSeats.map((type, i) => (React.createElement(SeatRow, { key: i, type: type, index: i, displayLabel: commonService.truncateSeatLabel(type.label), fare: getFare(type.fare), isSoldOut: isSoldOut, seatPriceColor: seatPriceColor, hasMultipleTypes: hasMultipleTypes, textSize: "text-[11px]" })));
         }
-        const filteredSeats = (_a = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label))) === null || _a === void 0 ? void 0 : _a.sort((a, b) => a.fare - b.fare);
-        return (_b = (isTrain ? filteredSeats : filteredSeats === null || filteredSeats === void 0 ? void 0 : filteredSeats.slice(0, 2))) === null || _b === void 0 ? void 0 : _b.map((type, i) => (React.createElement(SeatRow, { key: i, type: type, index: i, displayLabel: type.label, fare: getFare(type.fare), isSoldOut: isSoldOut, seatPriceColor: seatPriceColor, hasMultipleTypes: hasMultipleTypes, textSize: "text-[12px]", isTrain: isTrain })));
+        return (_c = (_b = (_a = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label))) === null || _a === void 0 ? void 0 : _a.sort((a, b) => a.fare - b.fare)) === null || _b === void 0 ? void 0 : _b.slice(0, 2)) === null || _c === void 0 ? void 0 : _c.map((type, i) => (React.createElement(SeatRow, { key: i, type: type, index: i, displayLabel: type.label, fare: getFare(type.fare), isSoldOut: isSoldOut, seatPriceColor: seatPriceColor, hasMultipleTypes: hasMultipleTypes, textSize: "text-[12px]" })));
     };
     const seats = removeDuplicateSeats
         ? getUniqueSeats(seatTypesData, 3)
-        : (() => {
-            var _a;
-            const filtered = (_a = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label))) === null || _a === void 0 ? void 0 : _a.sort((a, b) => a.fare - b.fare);
-            return isTrain ? filtered : filtered === null || filtered === void 0 ? void 0 : filtered.slice(0, 2);
-        })();
+        : (_c = (_b = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label))) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.fare - b.fare)) === null || _c === void 0 ? void 0 : _c.slice(0, 2);
     const discountedSeats = seats === null || seats === void 0 ? void 0 : seats.map((seat) => (Object.assign(Object.assign({}, seat), commonService.calculateDiscountedPrice(seat.fare, serviceItem))));
     const peruLowestFare = isPeru ? getLowestFare() : null;
     const peruDiscountCalc = isPeru && peruLowestFare != null
@@ -131,7 +132,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
             peruDiscountCalc.originalPrice !== peruDiscountCalc.discountedPrice
         : discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.some((s) => s.originalPrice !== s.discountedPrice);
     const discountSeat = isPeru && peruDiscountCalc
-        ? Object.assign({ label: "", fare: peruLowestFare }, peruDiscountCalc) : (_b = discountedSeats === null || discountedSeats === void 0 ? void 0 : discountedSeats.filter((seat) => !EXCEPTIONS.includes(seat.label))) === null || _b === void 0 ? void 0 : _b.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
+        ? 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 = (() => {
         if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "percentage" &&
             typeof (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) === "number") {
@@ -154,14 +155,14 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
     };
     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 = (_d = (_c = seatTypesData === null || seatTypesData === void 0 ? void 0 : seatTypesData.filter((item) => getFilteredSeats(item.label) && !EXCEPTIONS.includes(item.label))) === null || _c === void 0 ? void 0 : _c.sort((a, b) => a.fare - b.fare)[0]) === null || _d === void 0 ? void 0 : _d.fare;
+    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 &&
         dpDiscountPercent != null &&
         firstSeatFare != null;
     return (React.createElement("div", { className: "content-center relative", style: { width: "40%" } }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
-        !((_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) === null || _e === void 0 ? void 0 : _e.length) &&
+        !((_g = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) === null || _g === void 0 ? void 0 : _g.length) &&
         !dpDiscountPercent ? (React.createElement("div", { className: "flex flex-col justify-between h-[2.5rem]", style: { gap: isSoldOut ? "0px" : "5px" } }, renderDpSeats())) : hasDpDiscount ? (React.createElement("div", { className: "relative grid grid-cols-[auto_auto] justify-between gap-x-[8px] " },
         !isNaN(Number(dpDiscountPercent)) &&
             Number(dpDiscountPercent) > 0 && (React.createElement("div", { className: "absolute -top-[18px] right-[0px]", style: {
@@ -193,7 +194,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
         React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
                 color: isSoldOut ? "#bbb" : discountSeatPriceColor || "#ff5964",
             } },
-            ((_f = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _f === void 0 ? void 0 : _f.fireIcon) ? (React.createElement("img", { src: serviceItem.icons.fireIcon, alt: "discount", className: "h-[16px] w-[16px] object-contain", style: { filter: isSoldOut ? "grayscale" : "" } })) : null,
+            ((_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,
         React.createElement("div", { className: "relative grid grid-cols-[auto_auto] justify-between gap-x-[8px] " },
@@ -227,8 +228,8 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
             React.createElement("span", { className: "flex items-center justify-end gap-[4px] text-[14px] bold-text leading-[24px]", style: {
                     color: isSoldOut ? "#bbb" : discountSeatPriceColor || "#ff5964",
                 } },
-                ((_g = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.icons) === null || _g === void 0 ? void 0 : _g.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 ${isTrain ? "" : "h-[2.5rem]"} `, style: {
+                ((_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",
             justifyContent: hasMultipleTypes ? "space-between" : "center",
         } },

package/dist/utils/CommonService.d.ts

@@ -3,7 +3,7 @@ declare const commonService: {
     discountedCurrency(amount: number, currencySign?: string): string;
     copyObject: (ob: any) => any;
     getServiceTypeLabelForFilters: (service_type: any) => "Tipo de servicio" | "Punto de embarque" | "Tipo de asiento" | "SERVICIOS" | "";
-    truncateSeatLabel: (label: string | number, maxLength?: number) => string;
+    truncateSeatLabel: (label: string | number) => string;
     getAmenitiesImage: (name: string, serviceItem: any) => string;
     getAmenityName: (rawAmenity: string) => string;
     getSeatNameForFilters: (rawSeat: any) => any;
@@ -27,6 +27,14 @@ declare const commonService: {
         interval?: number;
     }) => void;
     startCountdown: (node: HTMLSpanElement | null, countdownSeconds?: number) => void;
+    startDealCountdown: (node: HTMLSpanElement | null, countdownSeconds: number) => void;
     startComprandoCount: (node: HTMLSpanElement | null, min?: number, max?: number) => void;
+    timeToMinutes: (time: string) => number;
+    minutesToTime: (minutes: number) => string;
+    generateTimeSlots: (from: string, to: string, windowHours: number) => Array<{
+        label: string;
+        start: number;
+        end: number;
+    }>;
 };
 export default commonService;