kupos-ui-components-lib 10.4.64 → 10.4.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
  2. package/dist/components/ServiceItem/ServiceItemDesktop.js +3 -3
  3. package/dist/components/ServiceItem/types.d.ts +1 -0
  4. package/dist/styles.css +3 -0
  5. package/dist/ui/ExpendedDropDown/ExpandedDropdown.d.ts +1 -0
  6. package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +7 -1
  7. package/dist/ui/SeatSection/SeatSection.d.ts +2 -1
  8. package/dist/ui/SeatSection/SeatSection.js +15 -4
  9. package/dist/ui/mobileweb/ExpandedDropdownMobile.d.ts +1 -0
  10. package/dist/ui/mobileweb/ExpandedDropdownMobile.js +6 -1
  11. package/package.json +1 -1
  12. package/src/components/ServiceItem/ServiceItemDesktop.tsx +3 -0
  13. package/src/components/ServiceItem/types.ts +2 -0
  14. package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +12 -2
  15. package/src/ui/SeatSection/SeatSection.tsx +55 -17
  16. package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +13 -1
package/dist/components/ServiceItem/ServiceItemDesktop.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { ServiceItemProps } from "./types";
3
- declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isTrain, selectedSeatKey, onSeatSelect, onTrainButtonClick, showSeatSelectionError, onShowSeatSelectionError, onClearSeatSelectionError, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, operatorLabel, priority_stage_ids, isShowSeatIcon, showDesdeLabel, showServiceTypeUnderLogo, }: ServiceItemProps & {
3
+ declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isTrain, selectedSeatKey, onSeatSelect, onTrainButtonClick, showSeatSelectionError, onShowSeatSelectionError, onClearSeatSelectionError, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, operatorLabel, priority_stage_ids, isShowSeatIcon, showDesdeLabel, showServiceTypeUnderLogo, showSeatsWithDiscount, }: ServiceItemProps & {
4
4
  currencySign?: string;
5
5
  }): React.ReactElement;
6
6
  export default ServiceItemPB;
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -87,7 +87,7 @@ const ANIMATION_MAP = {
87
87
  kupos: flameAnimation,
88
88
  },
89
89
  };
90
- function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isTrain, selectedSeatKey, onSeatSelect, onTrainButtonClick, showSeatSelectionError, onShowSeatSelectionError, onClearSeatSelectionError, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, operatorLabel, priority_stage_ids, isShowSeatIcon = false, showDesdeLabel = false, showServiceTypeUnderLogo = false, }) {
90
+ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isTrain, selectedSeatKey, onSeatSelect, onTrainButtonClick, showSeatSelectionError, onShowSeatSelectionError, onClearSeatSelectionError, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, operatorLabel, priority_stage_ids, isShowSeatIcon = false, showDesdeLabel = false, showServiceTypeUnderLogo = false, showSeatsWithDiscount = false, }) {
91
91
  var _a, _b, _c;
92
92
  const handleSeatSelect = (key, price, seatKey, apiSeatType) => {
93
93
  onClearSeatSelectionError === null || onClearSeatSelectionError === void 0 ? void 0 : onClearSeatSelectionError();
@@ -366,9 +366,9 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
366
366
  backgroundColor: "#ccc",
367
367
  } }),
368
368
  React.createElement("div", { className: "content-center" },
369
- React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon, discountSeatPriceColor: colors.discountSeatPriceColor, isSeatIcon: isSeatIcon, isTrain: isTrain, selectedSeatKey: selectedSeatKey, onSeatSelect: handleSeatSelect, topLabelColor: colors.topLabelColor, tooltipColor: colors.tooltipColor, discountSeatCrossPriceColor: colors.discountSeatCrossPriceColor, isShowSeatIcon: isShowSeatIcon, showDesdeLabel: showDesdeLabel })),
369
+ React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon, discountSeatPriceColor: colors.discountSeatPriceColor, isSeatIcon: isSeatIcon, isTrain: isTrain, selectedSeatKey: selectedSeatKey, onSeatSelect: handleSeatSelect, topLabelColor: colors.topLabelColor, tooltipColor: colors.tooltipColor, discountSeatCrossPriceColor: colors.discountSeatCrossPriceColor, isShowSeatIcon: isShowSeatIcon, showDesdeLabel: showDesdeLabel, showSeatsWithDiscount: showSeatsWithDiscount })),
370
370
  React.createElement("div", { className: "relative" },
371
- React.createElement(KuposButton, { isSoldOut: isSoldOut, isLoading: serviceDetailsLoading, buttonColor: colors.kuposButtonColor, buyLabel: translation === null || translation === void 0 ? void 0 : translation.buyButton, soldOutLabel: translation === null || translation === void 0 ? void 0 : translation.soldOutButton, soldOutIcon: renderIcon("soldOutIcon", "14px"), onClick: checkMidnight }),
371
+ React.createElement(KuposButton, { isSoldOut: isSoldOut, isLoading: serviceDetailsLoading, buttonColor: colors.kuposButtonColor, buyLabel: translation === null || translation === void 0 ? void 0 : translation.buyButton, soldOutLabel: translation === null || translation === void 0 ? void 0 : translation.soldOutButton, soldOutIcon: renderIcon("soldOutIcon", "14px"), onClick: checkMidnight, buttonTextColor: colors.primaryButtonTextColor }),
372
372
  showSeatSelectionError === serviceItem.id && isTrain && (React.createElement("div", { className: "flex justify-center mr-[11px] w-[100%] right-[0px] absolute left-[0] top-[40px]" },
373
373
  React.createElement("div", { className: "text-[9px] text-center whitespace-nowrap", style: {
374
374
  color: colors.seatPriceColor,
package/dist/components/ServiceItem/types.d.ts CHANGED
@@ -277,5 +277,6 @@ export interface ServiceItemProps {
277
277
  priority_stage_ids?: string[];
278
278
  isShowSeatIcon?: boolean;
279
279
  showDesdeLabel?: boolean;
280
+ showSeatsWithDiscount?: boolean;
280
281
  showServiceTypeUnderLogo?: boolean;
281
282
  }
package/dist/styles.css CHANGED
@@ -183,6 +183,9 @@
183
183
  .col-start-2 {
184
184
  grid-column-start: 2;
185
185
  }
186
+ .row-span-2 {
187
+ grid-row: span 2 / span 2;
188
+ }
186
189
  .row-start-1 {
187
190
  grid-row-start: 1;
188
191
  }
package/dist/ui/ExpendedDropDown/ExpandedDropdown.d.ts CHANGED
@@ -5,6 +5,7 @@ interface ExpandedDropdownProps {
5
5
  pet_seat_info?: Record<string, any>;
6
6
  is_change_ticket?: boolean;
7
7
  is_tracking_enabled?: boolean;
8
+ operator_service_name?: string;
8
9
  };
9
10
  isPeru?: boolean;
10
11
  translation?: Record<string, string>;
package/dist/ui/ExpendedDropDown/ExpandedDropdown.js CHANGED
@@ -2,12 +2,18 @@ import React from "react";
2
2
  function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAnimationIcon, isChangeTicket = false, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, operatorLabel, }) {
3
3
  const hasPetInfo = serviceItem.pet_seat_info &&
4
4
  Object.keys(serviceItem.pet_seat_info).length > 0;
5
+ console.log("ExpandedDropdown serviceItem:", serviceItem);
5
6
  return (React.createElement("div", { className: "px-[15px] pt-[26px] pb-[14px] -mt-[16px] pt-[35px] relative -z-9", style: {
6
7
  backgroundColor: "#ffefef",
7
8
  borderRadius: "0 0 10px 10px",
8
9
  } },
9
10
  React.createElement("div", { className: "flex flex-col gap-[6px] text-[13px] text-[#464647]", style: { lineHeight: 1.5, opacity: isSoldOut ? 0.5 : 1 } },
10
- isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
11
+ isPeru || isDpEnabled ? null : (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) ===
12
+ "Cóndor Bus" ? (React.createElement("div", { className: "flex gap-[8px] text-[13.33px]" },
13
+ React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
14
+ React.createElement("span", null,
15
+ React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
16
+ " Esta empresa permite cambios hasta la hora del viaje."))) : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
11
17
  React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
12
18
  React.createElement("span", null,
13
19
  React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
package/dist/ui/SeatSection/SeatSection.d.ts CHANGED
@@ -16,6 +16,7 @@ interface SeatSectionProps {
16
16
  removeDuplicateSeats?: boolean;
17
17
  isPeru?: boolean;
18
18
  showDesdeLabel?: boolean;
19
+ showSeatsWithDiscount?: boolean;
19
20
  serviceItem?: any;
20
21
  renderIcon?: (iconKey: string, size?: string) => React.ReactNode;
21
22
  discountSeatPriceColor?: string;
@@ -28,5 +29,5 @@ interface SeatSectionProps {
28
29
  discountSeatCrossPriceColor?: string;
29
30
  isShowSeatIcon?: boolean;
30
31
  }
31
- declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isSeatIcon, isTrain, topLabelColor, tooltipColor, discountSeatCrossPriceColor, isShowSeatIcon, showDesdeLabel, }: SeatSectionProps): React.ReactElement;
32
+ declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isSeatIcon, isTrain, topLabelColor, tooltipColor, discountSeatCrossPriceColor, isShowSeatIcon, showDesdeLabel, showSeatsWithDiscount, }: SeatSectionProps): React.ReactElement;
32
33
  export default SeatSection;
package/dist/ui/SeatSection/SeatSection.js CHANGED
@@ -100,7 +100,7 @@ function addSeatDegree(label) {
100
100
  return label;
101
101
  return String(label).replace(/\b(120|140|160|180)\b(?!°)/g, "$1°");
102
102
  }
103
- function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isSeatIcon, isTrain, topLabelColor, tooltipColor, discountSeatCrossPriceColor, isShowSeatIcon, showDesdeLabel = false, }) {
103
+ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isSeatIcon, isTrain, topLabelColor, tooltipColor, discountSeatCrossPriceColor, isShowSeatIcon, showDesdeLabel = false, showSeatsWithDiscount = false, }) {
104
104
  var _a;
105
105
  const uniqueSeats = getUniqueSeats(seatTypes, isTrain);
106
106
  const sortedSeatTypes = getSortedSeatTypes(seatTypes, isTrain);
@@ -367,17 +367,28 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
367
367
  const discountSeatIcon = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 && isShowSeatIcon
368
368
  ? getSeatLabelIcon(discountSeat.label, serviceItem)
369
369
  : null;
370
+ // List the seat types in place of the "Antes / Desde" labels
371
+ const showDiscountSeatRows = showSeatsWithDiscount && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1;
372
+ const discountSeatRows = (showSeatTypeRows ? uniqueSeats : [discountSeat]).filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
370
373
  return (React.createElement("div", { className: "grid grid-cols-2 items-center text-[13.33px] relative", style: { opacity: isSoldOut ? 0.5 : 1 } },
371
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? null : (React.createElement("div", { className: "col-start-1 row-start-2 flex items-center" },
374
+ showDiscountSeatRows ? (React.createElement("div", { className: "col-start-1 row-start-2 row-span-2 flex flex-col justify-center", style: { gap: "8px" } }, discountSeatRows.map((val, key) => (React.createElement("span", { key: key, className: "text-[13.33px] font-normal leading-[20px] text-[#464647] whitespace-nowrap flex items-center" },
375
+ isShowSeatIcon && !isMovilBus && (React.createElement("img", { src: getSeatLabelIcon(val.label, serviceItem), alt: "seattype", style: {
376
+ width: "20px",
377
+ height: "20px",
378
+ marginRight: "5px",
379
+ } })),
380
+ isMovilBus
381
+ ? CommonService.truncateSeatLabel(val.label)
382
+ : CommonService.capitalize(addSeatDegree(val.label))))))) : (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? null : (React.createElement("div", { className: "col-start-1 row-start-2 flex items-center" },
372
383
  React.createElement("span", { className: "text-[13.33px] font-normal leading-[22px] text-[#ccc]" }, "Antes"))),
373
- React.createElement("div", { className: "col-start-1 row-start-3 flex h-[20px] items-end" },
384
+ showDiscountSeatRows ? null : (React.createElement("div", { className: "col-start-1 row-start-3 flex h-[20px] items-end" },
374
385
  React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#464647] whitespace-nowrap flex items-center" },
375
386
  discountSeatIcon && (React.createElement("img", { src: discountSeatIcon, alt: "seattype", style: {
376
387
  width: "20px",
377
388
  height: "20px",
378
389
  marginRight: "5px",
379
390
  } })),
380
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? discountSeat.label : "Desde")),
391
+ (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? discountSeat.label : "Desde"))),
381
392
  React.createElement("div", { className: "col-start-2 row-start-1 flex items-center justify-center absolute", style: { top: "-22px", left: "50%", transform: "translateX(-50%)" } },
382
393
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1 &&
383
394
  !isPeru &&
package/dist/ui/mobileweb/ExpandedDropdownMobile.d.ts CHANGED
@@ -5,6 +5,7 @@ interface ExpandedDropdownMobileProps {
5
5
  pet_seat_info?: Record<string, any>;
6
6
  is_change_ticket?: boolean;
7
7
  is_tracking_enabled?: boolean;
8
+ operator_service_name?: string;
8
9
  };
9
10
  isPeru?: boolean;
10
11
  petSeatInfo?: Record<string, any>;
package/dist/ui/mobileweb/ExpandedDropdownMobile.js CHANGED
@@ -6,7 +6,12 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
6
6
  opacity: isSoldOut ? 0.5 : 1,
7
7
  } },
8
8
  React.createElement("div", { className: "flex flex-col gap-[8px] text-[11px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
9
- isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
9
+ isPeru || isDpEnabled ? null : (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) ===
10
+ "Cóndor Bus" ? (React.createElement("div", { className: "flex gap-[6px]" },
11
+ React.createElement("span", { className: "mt-[3px]" }, renderIcon("changeTicketIcon", "14px")),
12
+ React.createElement("span", null,
13
+ React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
14
+ " Esta empresa permite cambios hasta la hora del viaje."))) : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
10
15
  React.createElement("span", { className: "mt-[3px]" }, renderIcon("changeTicketIcon", "14px")),
11
16
  React.createElement("span", null,
12
17
  React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "10.4.64",
3
+ "version": "10.4.66",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -155,6 +155,7 @@ function ServiceItemPB({
155
155
  isShowSeatIcon = false,
156
156
  showDesdeLabel = false,
157
157
  showServiceTypeUnderLogo = false,
158
+ showSeatsWithDiscount = false,
158
159
  }: ServiceItemProps & { currencySign?: string }): React.ReactElement {
159
160
  const handleSeatSelect = (
160
161
  key: any,
@@ -721,6 +722,7 @@ function ServiceItemPB({
721
722
  }
722
723
  isShowSeatIcon={isShowSeatIcon}
723
724
  showDesdeLabel={showDesdeLabel}
725
+ showSeatsWithDiscount={showSeatsWithDiscount}
724
726
  />
725
727
  </div>
726
728
 
@@ -735,6 +737,7 @@ function ServiceItemPB({
735
737
  soldOutLabel={translation?.soldOutButton}
736
738
  soldOutIcon={renderIcon("soldOutIcon", "14px")}
737
739
  onClick={checkMidnight}
740
+ buttonTextColor ={colors.primaryButtonTextColor}
738
741
  />
739
742
  {showSeatSelectionError === serviceItem.id && isTrain && (
740
743
  <div className="flex justify-center mr-[11px] w-[100%] right-[0px] absolute left-[0] top-[40px]">
package/src/components/ServiceItem/types.ts CHANGED
@@ -290,5 +290,7 @@ export interface ServiceItemProps {
290
290
  isShowSeatIcon?: boolean;
291
291
  // shows a small "Desde" label above the price in the seat section
292
292
  showDesdeLabel?: boolean;
293
+ // keeps listing the seat types next to the discounted price
294
+ showSeatsWithDiscount?: boolean;
293
295
  showServiceTypeUnderLogo?: boolean;
294
296
  }
package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx CHANGED
@@ -7,6 +7,7 @@ interface ExpandedDropdownProps {
7
7
  pet_seat_info?: Record<string, any>;
8
8
  is_change_ticket?: boolean;
9
9
  is_tracking_enabled?: boolean;
10
+ operator_service_name?: string;
10
11
  };
11
12
  isPeru?: boolean;
12
13
  translation?: Record<string, string>;
@@ -34,7 +35,7 @@ function ExpandedDropdown({
34
35
  const hasPetInfo =
35
36
  serviceItem.pet_seat_info &&
36
37
  Object.keys(serviceItem.pet_seat_info).length > 0;
37
-
38
+ console.log("ExpandedDropdown serviceItem:", serviceItem);
38
39
  return (
39
40
  <div
40
41
  className="px-[15px] pt-[26px] pb-[14px] -mt-[16px] pt-[35px] relative -z-9"
@@ -47,7 +48,16 @@ function ExpandedDropdown({
47
48
  className="flex flex-col gap-[6px] text-[13px] text-[#464647]"
48
49
  style={{ lineHeight: 1.5, opacity: isSoldOut ? 0.5 : 1 }}
49
50
  >
50
- {isPeru || isDpEnabled ? null : isChangeTicket ? (
51
+ {isPeru || isDpEnabled ? null : serviceItem?.operator_service_name ===
52
+ "Cóndor Bus" ? (
53
+ <div className="flex gap-[8px] text-[13.33px]">
54
+ <span>{renderIcon("changeTicketIcon", "16px")}</span>
55
+ <span>
56
+ <span className="bold-text">Pasaje flexible:</span> Esta empresa
57
+ permite cambios hasta la hora del viaje.
58
+ </span>
59
+ </div>
60
+ ) : isChangeTicket ? (
51
61
  <div className="flex gap-[8px]" style={{ lineHeight: 1.5 }}>
52
62
  <span>{renderIcon("changeTicketIcon", "16px")}</span>
53
63
  {/* <span style={{ marginTop: "2px" }}>
package/src/ui/SeatSection/SeatSection.tsx CHANGED
@@ -21,6 +21,7 @@ interface SeatSectionProps {
21
21
  removeDuplicateSeats?: boolean;
22
22
  isPeru?: boolean;
23
23
  showDesdeLabel?: boolean;
24
+ showSeatsWithDiscount?: boolean;
24
25
  serviceItem?: any;
25
26
  renderIcon?: (iconKey: string, size?: string) => React.ReactNode;
26
27
  discountSeatPriceColor?: string;
@@ -172,6 +173,7 @@ function SeatSection({
172
173
  discountSeatCrossPriceColor,
173
174
  isShowSeatIcon,
174
175
  showDesdeLabel = false,
176
+ showSeatsWithDiscount = false,
175
177
  }: SeatSectionProps): React.ReactElement {
176
178
  const uniqueSeats = getUniqueSeats(seatTypes, isTrain);
177
179
  const sortedSeatTypes = getSortedSeatTypes(seatTypes, isTrain);
@@ -692,12 +694,46 @@ function SeatSection({
692
694
  ? getSeatLabelIcon(discountSeat.label, serviceItem)
693
695
  : null;
694
696
 
697
+ // List the seat types in place of the "Antes / Desde" labels
698
+ const showDiscountSeatRows =
699
+ showSeatsWithDiscount && serviceItem?.ui_type !== 1;
700
+ const discountSeatRows = (
701
+ showSeatTypeRows ? uniqueSeats : [discountSeat]
702
+ ).filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
703
+
695
704
  return (
696
705
  <div
697
706
  className="grid grid-cols-2 items-center text-[13.33px] relative"
698
707
  style={{ opacity: isSoldOut ? 0.5 : 1 }}
699
708
  >
700
- {serviceItem?.ui_type === 1 ? null : (
709
+ {showDiscountSeatRows ? (
710
+ <div
711
+ className="col-start-1 row-start-2 row-span-2 flex flex-col justify-center"
712
+ style={{ gap: "8px" }}
713
+ >
714
+ {discountSeatRows.map((val, key) => (
715
+ <span
716
+ key={key}
717
+ className="text-[13.33px] font-normal leading-[20px] text-[#464647] whitespace-nowrap flex items-center"
718
+ >
719
+ {isShowSeatIcon && !isMovilBus && (
720
+ <img
721
+ src={getSeatLabelIcon(val.label, serviceItem)}
722
+ alt="seattype"
723
+ style={{
724
+ width: "20px",
725
+ height: "20px",
726
+ marginRight: "5px",
727
+ }}
728
+ />
729
+ )}
730
+ {isMovilBus
731
+ ? CommonService.truncateSeatLabel(val.label)
732
+ : CommonService.capitalize(addSeatDegree(val.label))}
733
+ </span>
734
+ ))}
735
+ </div>
736
+ ) : serviceItem?.ui_type === 1 ? null : (
701
737
  <div className="col-start-1 row-start-2 flex items-center">
702
738
  <span className="text-[13.33px] font-normal leading-[22px] text-[#ccc]">
703
739
  Antes
@@ -705,22 +741,24 @@ function SeatSection({
705
741
  </div>
706
742
  )}
707
743
 
708
- <div className="col-start-1 row-start-3 flex h-[20px] items-end">
709
- <span className="text-[13.33px] font-normal leading-[20px] text-[#464647] whitespace-nowrap flex items-center">
710
- {discountSeatIcon && (
711
- <img
712
- src={discountSeatIcon}
713
- alt="seattype"
714
- style={{
715
- width: "20px",
716
- height: "20px",
717
- marginRight: "5px",
718
- }}
719
- />
720
- )}
721
- {serviceItem?.ui_type === 1 ? discountSeat.label : "Desde"}
722
- </span>
723
- </div>
744
+ {showDiscountSeatRows ? null : (
745
+ <div className="col-start-1 row-start-3 flex h-[20px] items-end">
746
+ <span className="text-[13.33px] font-normal leading-[20px] text-[#464647] whitespace-nowrap flex items-center">
747
+ {discountSeatIcon && (
748
+ <img
749
+ src={discountSeatIcon}
750
+ alt="seattype"
751
+ style={{
752
+ width: "20px",
753
+ height: "20px",
754
+ marginRight: "5px",
755
+ }}
756
+ />
757
+ )}
758
+ {serviceItem?.ui_type === 1 ? discountSeat.label : "Desde"}
759
+ </span>
760
+ </div>
761
+ )}
724
762
 
725
763
  <div
726
764
  className="col-start-2 row-start-1 flex items-center justify-center absolute"
package/src/ui/mobileweb/ExpandedDropdownMobile.tsx CHANGED
@@ -7,6 +7,7 @@ interface ExpandedDropdownMobileProps {
7
7
  pet_seat_info?: Record<string, any>;
8
8
  is_change_ticket?: boolean;
9
9
  is_tracking_enabled?: boolean;
10
+ operator_service_name?: string;
10
11
  };
11
12
  isPeru?: boolean;
12
13
  petSeatInfo?: Record<string, any>;
@@ -48,7 +49,18 @@ function ExpandedDropdownMobile({
48
49
  className="flex flex-col gap-[8px] text-[11px] min-[420px]:text-[12px] text-[#464647]"
49
50
  style={{ lineHeight: 1.6 }}
50
51
  >
51
- {isPeru || isDpEnabled ? null : isChangeTicket ? (
52
+ {isPeru || isDpEnabled ? null : serviceItem?.operator_service_name ===
53
+ "Cóndor Bus" ? (
54
+ <div className="flex gap-[6px]">
55
+ <span className="mt-[3px]">
56
+ {renderIcon("changeTicketIcon", "14px")}
57
+ </span>
58
+ <span>
59
+ <span className="bold-text">Pasaje flexible:</span> Esta empresa
60
+ permite cambios hasta la hora del viaje.
61
+ </span>
62
+ </div>
63
+ ) : isChangeTicket ? (
52
64
  <div className="flex gap-[6px]">
53
65
  <span className="mt-[3px]">
54
66
  {renderIcon("changeTicketIcon", "14px")}