kupos-ui-components-lib 10.4.62 → 10.4.64

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 (39) hide show
  1. package/dist/components/FilterBar/FilterBarDesktop.js +10 -0
  2. package/dist/components/FilterBar/ServiceFilter.d.ts +1 -0
  3. package/dist/components/FilterBar/ServiceFilter.js +10 -4
  4. package/dist/components/ServiceItem/PeruServiceItemDesktop.js +3 -1
  5. package/dist/components/ServiceItem/PeruServiceItemMobile.js +5 -3
  6. package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
  7. package/dist/components/ServiceItem/ServiceItemDesktop.js +7 -5
  8. package/dist/components/ServiceItem/ServiceItemMobile.d.ts +1 -1
  9. package/dist/components/ServiceItem/ServiceItemMobile.js +14 -16
  10. package/dist/components/ServiceItem/mobileTypes.d.ts +3 -0
  11. package/dist/components/ServiceItem/types.d.ts +3 -0
  12. package/dist/styles.css +3 -0
  13. package/dist/ui/OfferBanner.d.ts +1 -1
  14. package/dist/ui/OfferBanner.js +9 -5
  15. package/dist/ui/PeruOfferBanner.d.ts +1 -1
  16. package/dist/ui/PeruOfferBanner.js +5 -1
  17. package/dist/ui/RatingBlock.d.ts +1 -1
  18. package/dist/ui/RatingBlock.js +7 -3
  19. package/dist/ui/SeatSection/SeatSection.js +28 -13
  20. package/dist/ui/ServiceBadges/ServiceBadges.js +1 -1
  21. package/dist/ui/mobileweb/SeatSectionMobile.js +10 -5
  22. package/dist/utils/CommonService.d.ts +7 -0
  23. package/dist/utils/CommonService.js +6 -0
  24. package/package.json +1 -1
  25. package/src/components/FilterBar/FilterBarDesktop.tsx +16 -0
  26. package/src/components/FilterBar/ServiceFilter.tsx +12 -2
  27. package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +4 -1
  28. package/src/components/ServiceItem/PeruServiceItemMobile.tsx +6 -3
  29. package/src/components/ServiceItem/ServiceItemDesktop.tsx +9 -3
  30. package/src/components/ServiceItem/ServiceItemMobile.tsx +25 -14
  31. package/src/components/ServiceItem/mobileTypes.ts +3 -0
  32. package/src/components/ServiceItem/types.ts +3 -0
  33. package/src/ui/OfferBanner.tsx +10 -5
  34. package/src/ui/PeruOfferBanner.tsx +7 -1
  35. package/src/ui/RatingBlock.tsx +7 -2
  36. package/src/ui/SeatSection/SeatSection.tsx +53 -29
  37. package/src/ui/ServiceBadges/ServiceBadges.tsx +1 -1
  38. package/src/ui/mobileweb/SeatSectionMobile.tsx +30 -20
  39. package/src/utils/CommonService.ts +13 -0
@@ -175,6 +175,16 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
175
175
  return true;
176
176
  });
177
177
  }
178
+ if (fil.type == "service_type") {
179
+ const activeOptions = fil.options.filter((it) => it.active);
180
+ if (activeOptions.length) {
181
+ filteredRoutes = filteredRoutes.filter((it) => activeOptions.some((f) => f.value ===
182
+ String(it.service_type || "")
183
+ .trim()
184
+ .replace(/\s+/g, " ")
185
+ .toLowerCase()));
186
+ }
187
+ }
178
188
  if (fil.type == "operator") {
179
189
  let activeOptions = fil.options.filter((it) => it.active);
180
190
  filteredRoutes = filteredRoutes.filter((it) => {
@@ -9,6 +9,7 @@ interface ServiceFilterBarDesktopState {
9
9
  showTrainType: boolean;
10
10
  addMargin: boolean;
11
11
  showAmenities: boolean;
12
+ showServiceType: boolean;
12
13
  sortedFilters: any[];
13
14
  }
14
15
  declare class ServiceFilter extends React.Component<ServiceFilterProps, ServiceFilterBarDesktopState> {
@@ -23,6 +23,7 @@ class ServiceFilter extends React.Component {
23
23
  showTrainType: ((_f = props.initialOpenFilters) === null || _f === void 0 ? void 0 : _f.includes("train_type")) || true,
24
24
  addMargin: false,
25
25
  showAmenities: ((_g = props.initialOpenFilters) === null || _g === void 0 ? void 0 : _g.includes("amenities")) || true,
26
+ showServiceType: true,
26
27
  sortedFilters: this.sortFilters(props.filtersArray),
27
28
  };
28
29
  this.handleScroll = this.handleScroll.bind(this);
@@ -53,6 +54,7 @@ class ServiceFilter extends React.Component {
53
54
  const FILTER_ORDER = [
54
55
  "time",
55
56
  "operator",
57
+ "service_type",
56
58
  "special_departure",
57
59
  "tipo",
58
60
  "seat_types",
@@ -120,18 +122,21 @@ class ServiceFilter extends React.Component {
120
122
  ? !prevState.showTrainType
121
123
  : prevState.showTrainType, showAmenities: type === "amenities"
122
124
  ? !prevState.showAmenities
123
- : prevState.showAmenities });
125
+ : prevState.showAmenities, showServiceType: type === "service_type"
126
+ ? !prevState.showServiceType
127
+ : prevState.showServiceType });
124
128
  });
125
129
  }
126
130
  renderFilterItem(option, onClick, key) {
127
- const { showOperators, showTimeOptions, showSeatOptions, showTypeOptions, showSpecialDeparture, showTrainType, showAmenities, } = this.state;
131
+ const { showOperators, showTimeOptions, showSeatOptions, showTypeOptions, showSpecialDeparture, showTrainType, showAmenities, showServiceType, } = this.state;
128
132
  const isOpen = (option.type === "operator" && showOperators) ||
129
133
  (option.type === "time" && showTimeOptions) ||
130
134
  (option.type === "seat_types" && showSeatOptions) ||
131
135
  (option.type === "tipo" && showTypeOptions) ||
132
136
  (option.type === "special_departure" && showSpecialDeparture) ||
133
137
  (option.type === "train_type" && showTrainType) ||
134
- (option.type === "amenities" && showAmenities);
138
+ (option.type === "amenities" && showAmenities) ||
139
+ (option.type === "service_type" && showServiceType);
135
140
  if ((option === null || option === void 0 ? void 0 : option.type) === "train_type" && !this.props.isTrain) {
136
141
  return null;
137
142
  }
@@ -159,7 +164,8 @@ class ServiceFilter extends React.Component {
159
164
  option.type !== "seat_types" &&
160
165
  option.type !== "tipo" &&
161
166
  option.type !== "special_departure" &&
162
- option.type !== "train_type")) &&
167
+ option.type !== "train_type" &&
168
+ option.type !== "service_type")) &&
163
169
  option.options.map((val, i) => {
164
170
  var _a, _b, _c, _d, _e, _f, _g, _h;
165
171
  let iconKey = "";
@@ -110,7 +110,9 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
110
110
  return label;
111
111
  })();
112
112
  let isSoldOut = serviceItem.available_seats <= 0;
113
- const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true;
113
+ // show_dp_ui: false renders a DP service with the regular card UI
114
+ const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true &&
115
+ !CommonService.isDpUiHidden(serviceItem);
114
116
  const peruDiscount = (_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discounts) === null || _a === void 0 ? void 0 : _a[0];
115
117
  const uiType = peruDiscount === null || peruDiscount === void 0 ? void 0 : peruDiscount.ui_type;
116
118
  const renderIcon = (iconKey, size = "14px") => {
@@ -33,7 +33,9 @@ function PeruServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStag
33
33
  const displayOfferText = offerText.length > OFFER_TEXT_MAX_CHARS
34
34
  ? `${offerText.slice(0, OFFER_TEXT_MAX_CHARS).trimEnd()}...`
35
35
  : offerText;
36
- const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true;
36
+ // show_dp_ui: false renders a DP service with the regular card UI
37
+ const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true &&
38
+ !commonService.isDpUiHidden(serviceItem);
37
39
  const hasDpRibbon = hasDpEnabled && Boolean(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents);
38
40
  // ui_type comes from the active discount entry: 1 = offer-text-only tier,
39
41
  // 2 = full new-UI tier (timer, bomb animation, viewers).
@@ -117,7 +119,7 @@ function PeruServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStag
117
119
  const dropoffName = ((_f = serviceItem.stage_details_arr) === null || _f === void 0 ? void 0 : _f.length)
118
120
  ? extractStage(serviceItem.stage_details_arr, 1)
119
121
  : null;
120
- return (React.createElement("div", { className: `relative ${!hasOfferText || !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? "mb-[14px]" : showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "mb-[20px]" : "mb-[12px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
122
+ return (React.createElement("div", { className: `relative ${!hasOfferText || !hasDpEnabled ? "mb-[14px]" : showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "mb-[20px]" : "mb-[12px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
121
123
  isConexion ||
122
124
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
123
125
  showTopLabel ||
@@ -185,7 +187,7 @@ function PeruServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStag
185
187
  } },
186
188
  React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
187
189
  React.createElement("div", { className: "flex justify-between items-center" },
188
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
190
+ hasDpEnabled &&
189
191
  Object.keys((_s = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _s !== void 0 ? _s : {}).length ===
190
192
  0 &&
191
193
  ((_t = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _t !== void 0 ? _t : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
@@ -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, }: 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, }: ServiceItemProps & {
4
4
  currencySign?: string;
5
5
  }): React.ReactElement;
6
6
  export default ServiceItemPB;
@@ -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, }) {
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, }) {
91
91
  var _a, _b, _c;
92
92
  const handleSeatSelect = (key, price, seatKey, apiSeatType) => {
93
93
  onClearSeatSelectionError === null || onClearSeatSelectionError === void 0 ? void 0 : onClearSeatSelectionError();
@@ -165,9 +165,11 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
165
165
  }
166
166
  return false;
167
167
  })();
168
+ // show_dp_ui: false renders a DP service with the regular card UI
169
+ const isDpUiHidden = CommonService.isDpUiHidden(serviceItem);
168
170
  const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {})[0];
169
- const dpDiscountPercent = dpDiscountEntry === null || dpDiscountEntry === void 0 ? void 0 : dpDiscountEntry[1];
170
- const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true;
171
+ const dpDiscountPercent = isDpUiHidden ? undefined : dpDiscountEntry === null || dpDiscountEntry === void 0 ? void 0 : dpDiscountEntry[1];
172
+ const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true && !isDpUiHidden;
171
173
  const offerGradient = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"} 0%, ${colors.leftGradiantColor || "#ff8842"} 100%)`;
172
174
  const offerGradientWithOpacity = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"}80 0%, ${colors.leftGradiantColor || "#ff8842"}80 100%)`;
173
175
  const serviceCardStyle = ((isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
@@ -356,7 +358,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
356
358
  React.createElement("div", null,
357
359
  React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `h-[30px] w-[auto] ${isSoldOut ? "grayscale" : ""}` }),
358
360
  isCiva ? (React.createElement("div", { className: "text-[13.33px] black-text ml-2" }, serviceItem.operator_details[2])) : null),
359
- React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru, isTrain: isTrain })),
361
+ React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru, isTrain: isTrain, showServiceTypeUnderLogo: showServiceTypeUnderLogo })),
360
362
  React.createElement(DateTimeSection, { serviceItem: serviceItem, isSoldOut: isSoldOut, isCiva: isCiva, isLinatal: isLinatal, removeArrivalTime: removeArrivalTime, orignLabel: orignLabel, destinationLabel: destinationLabel, busStage: busStage, metaData: metaData, colors: colors }),
361
363
  React.createElement("div", { style: {
362
364
  width: "1px",
@@ -376,7 +378,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
376
378
  color: colors.seatPriceColor,
377
379
  } }, "\u00A1\u00DAltimos Asientos!")))) : null)),
378
380
  React.createElement(BottomAmenities, { otherItems: otherItems, serviceItem: serviceItem, grayscaleClass: grayscaleClass, isSoldOut: isSoldOut, isItemExpanded: isItemExpanded, colors: colors, translation: translation, getAnimationIcon: getAnimationIcon, downArrowIcon: renderIcon("downArrow", "10px"), onToggleExpand: () => setIsExpand &&
379
- setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain, isDpEnabled: serviceItem.is_dp_enabled, serviceType: serviceItem.service_type, renderIcon: renderIcon }))),
381
+ setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain, isDpEnabled: serviceItem.is_dp_enabled, serviceType: showServiceTypeUnderLogo ? undefined : serviceItem.service_type, renderIcon: renderIcon }))),
380
382
  isPeru ? null : (React.createElement("div", { style: {
381
383
  display: "grid",
382
384
  gridTemplateRows: isItemExpanded ? "1fr" : "0fr",
@@ -1,4 +1,4 @@
1
1
  import React from "react";
2
2
  import { MobileServiceItemProps } from "./mobileTypes";
3
- declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, operatorLabel, isTrain, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, isAllinBus, isPeruSite, priority_stage_ids, isShowSeatIcon, showDesdeLabel, }: MobileServiceItemProps): React.ReactElement;
3
+ declare function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, operatorLabel, isTrain, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, isAllinBus, isPeruSite, priority_stage_ids, isShowSeatIcon, showDesdeLabel, showServiceTypeUnderLogo, }: MobileServiceItemProps): React.ReactElement;
4
4
  export default ServiceItemMobile;
@@ -19,7 +19,7 @@ const exceptions = [
19
19
  "blanco",
20
20
  "asiento_mascota",
21
21
  ];
22
- function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, operatorLabel, isTrain, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, isAllinBus, isPeruSite, priority_stage_ids, isShowSeatIcon = false, showDesdeLabel = false, }) {
22
+ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, operatorLabel, isTrain, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, cityOrigin, cityDestination, isNewUi, onRemateUiButtonClick, selectedTimeSlot, onTimeSlotChange, isTimeDropdownOpen, onTimeDropdownToggle, wowDealData, isFlores, isAllinBus, isPeruSite, priority_stage_ids, isShowSeatIcon = false, showDesdeLabel = false, showServiceTypeUnderLogo = false, }) {
23
23
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
24
24
  const isItemExpanded = serviceItem.id === isExpanded;
25
25
  const isPetSeat = (Object.keys(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.pet_seat_info) || []).length > 0;
@@ -32,13 +32,15 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
32
32
  const hasDiscount = discountedSeats.some((seat) => seat.originalPrice !== seat.discountedPrice);
33
33
  const isLongOfferText = (((_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) === null || _d === void 0 ? void 0 : _d.length) || 0) > 35;
34
34
  const hasDpEnabled = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true;
35
+ // show_dp_ui: false renders a DP service with the regular card UI
36
+ const showDpUi = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !commonService.isDpUiHidden(serviceItem);
35
37
  const isDiscountBelow20 = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) > 0 &&
36
38
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) < 20;
37
39
  const hasOfferText = Boolean(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text);
38
40
  const offerGradient = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"} 0%, ${colors.leftGradiantColor || "#ff8842"} 100%)`;
39
41
  const offerGradientWithOpacity = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"}80 0%, ${colors.leftGradiantColor || "#ff8842"}80 100%)`;
40
42
  const serviceCardStyle = (isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
41
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
43
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
42
44
  ? {
43
45
  borderColor: isSoldOut ? "#ccc" : "transparent",
44
46
  borderStyle: "solid",
@@ -120,7 +122,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
120
122
  setIsFeatureDropDownExpand(isFeatureDropDownExpand === serviceItem.id ||
121
123
  isFeatureDropDownExpand === true
122
124
  ? null
123
- : serviceItem.id), selectedTimeSlot: selectedTimeSlot, onTimeSlotChange: onTimeSlotChange, isTimeDropdownOpen: isTimeDropdownOpen, onTimeDropdownToggle: onTimeDropdownToggle, wowDealData: wowDealData })) : (React.createElement("div", { className: `relative ${!hasOfferText || !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? "mb-[14px]" : showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "mb-[20px]" : "mb-[12px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
125
+ : serviceItem.id), selectedTimeSlot: selectedTimeSlot, onTimeSlotChange: onTimeSlotChange, isTimeDropdownOpen: isTimeDropdownOpen, onTimeDropdownToggle: onTimeDropdownToggle, wowDealData: wowDealData })) : (React.createElement("div", { className: `relative ${!hasOfferText || !showDpUi ? "mb-[14px]" : showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "mb-[20px]" : "mb-[12px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
124
126
  isConexion ||
125
127
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
126
128
  showTopLabel ||
@@ -128,8 +130,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
128
130
  ? "mt-[20px]"
129
131
  : "mt-[10px]"} `, style: { zIndex: 1 } },
130
132
  React.createElement("div", { className: `z-1 ${((isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
131
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
132
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))) &&
133
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))) &&
133
134
  !isSoldOut
134
135
  ? "rounded-[18px]"
135
136
  : "rounded-[10px] border border-[#ccc]"}`, style: Object.assign(Object.assign({}, serviceCardStyle), { backgroundColor: "#fff" }) },
@@ -145,7 +146,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
145
146
  } },
146
147
  React.createElement("div", { className: `w-[115px] ${isFlores ? "" : "overflow-y-hidden"} h-[30px]` },
147
148
  React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `w-[100px] h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
148
- isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[12px] text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[12px] h-[22px] items-center" },
149
+ isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[12px] text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showServiceTypeUnderLogo && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type) ? (React.createElement("div", { className: "min-[420]:text-[13px] text-[12px] text-ellipsis overflow-hidden whitespace-nowrap max-w-[150px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, commonService.capitalizeFirstLetter(serviceItem.service_type))) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[12px] h-[22px] items-center" },
149
150
  React.createElement("div", { className: "flex items-center" },
150
151
  React.createElement("div", { className: "flex items-center" },
151
152
  React.createElement("img", { src: serviceItem.icons.rating, alt: "origin", className: `w-[12px] h-[12px] mr-[4px] object-contain ${isSoldOut ? "grayscale" : ""}` }),
@@ -161,7 +162,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
161
162
  color: colors.tooltipBgColor,
162
163
  } }, "\u00A1\u00DAltimos Asientos!")))) : null,
163
164
  React.createElement("div", { className: "bg-[#E6E6E6] mt-[10px] mb-[8px] h-[1px]" }),
164
- React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (_j = serviceItem.duration) === null || _j === void 0 ? void 0 : _j.toString(), isDirectTrip: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip, serviceType: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type, 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: () => {
165
+ React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (_j = serviceItem.duration) === null || _j === void 0 ? void 0 : _j.toString(), isDirectTrip: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip, serviceType: showServiceTypeUnderLogo ? undefined : serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type, 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: () => {
165
166
  setIsExpanded(isItemExpanded ? null : serviceItem.id);
166
167
  }, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, isTrain: isTrain, renderIcon: renderIcon })),
167
168
  React.createElement(ServiceBadgesMobile, { showTopLabel: showTopLabel || undefined, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, serviceItem: serviceItem, isConexion: isConexion, isAllinBus: isAllinBus, boardingName: boardingName })),
@@ -169,7 +170,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
169
170
  isNewUiEnabled &&
170
171
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 &&
171
172
  !isSoldOut &&
172
- !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
173
+ !showDpUi && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
173
174
  background: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor,
174
175
  borderRadius: "0 0 14px 14px",
175
176
  zIndex: -1,
@@ -185,8 +186,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
185
186
  } },
186
187
  React.createElement("span", { className: "whitespace-nowrap min-[380px]:text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text))))))),
187
188
  ((isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
188
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
189
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))) &&
189
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))) &&
190
190
  !isSoldOut && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
191
191
  background: isSoldOut
192
192
  ? offerGradientWithOpacity
@@ -197,7 +197,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
197
197
  } },
198
198
  React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
199
199
  React.createElement("div", { className: "flex justify-between items-center" },
200
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
200
+ showDpUi &&
201
201
  Object.keys((_k = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _k !== void 0 ? _k : {})
202
202
  .length === 0 &&
203
203
  ((_l = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _l !== void 0 ? _l : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
@@ -242,8 +242,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
242
242
  transition: "grid-template-rows 0.3s ease-in-out, opacity 0.25s ease-in-out",
243
243
  position: "relative",
244
244
  zIndex: hasOfferText ||
245
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
246
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents)) ||
245
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents)) ||
247
246
  (isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2)
248
247
  ? -2
249
248
  : -1,
@@ -251,13 +250,12 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
251
250
  React.createElement("div", { style: {
252
251
  overflow: "hidden",
253
252
  minHeight: 0,
254
- position: hasOfferText || isNewUiEnabled || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
253
+ position: hasOfferText || isNewUiEnabled || showDpUi
255
254
  ? "relative"
256
255
  : undefined,
257
256
  zIndex: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ||
258
257
  (isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
259
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
260
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
258
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
261
259
  ? -3
262
260
  : undefined,
263
261
  marginTop: hasOfferText ? "-15px" : "-10px",
@@ -37,6 +37,8 @@ export interface MobileServiceItemProps {
37
37
  train_type_label?: string;
38
38
  ladies_booked_seats?: string;
39
39
  is_dp_enabled?: boolean;
40
+ show_dp_ui?: boolean;
41
+ show_best_price?: boolean;
40
42
  offer_text?: string;
41
43
  is_direct_trip?: boolean;
42
44
  is_train_type?: boolean;
@@ -254,4 +256,5 @@ export interface MobileServiceItemProps {
254
256
  priority_stage_ids?: string[];
255
257
  isShowSeatIcon?: boolean;
256
258
  showDesdeLabel?: boolean;
259
+ showServiceTypeUnderLogo?: boolean;
257
260
  }
@@ -41,6 +41,8 @@ export interface ServiceItemProps {
41
41
  offer_text?: string;
42
42
  is_direct_trip?: boolean;
43
43
  is_dp_enabled?: boolean;
44
+ show_dp_ui?: boolean;
45
+ show_best_price?: boolean;
44
46
  dp_discount_percents?: any;
45
47
  dp_discounted_seats?: any;
46
48
  original_dp_price?: any;
@@ -275,4 +277,5 @@ export interface ServiceItemProps {
275
277
  priority_stage_ids?: string[];
276
278
  isShowSeatIcon?: boolean;
277
279
  showDesdeLabel?: boolean;
280
+ showServiceTypeUnderLogo?: boolean;
278
281
  }
package/dist/styles.css CHANGED
@@ -596,6 +596,9 @@
596
596
  .max-w-\[120px\] {
597
597
  max-width: 120px;
598
598
  }
599
+ .max-w-\[150px\] {
600
+ max-width: 150px;
601
+ }
599
602
  .max-w-\[165px\] {
600
603
  max-width: 165px;
601
604
  }
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { ServiceItemProps } from "../components/ServiceItem/types";
3
- type ServiceItemSlice = Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats" | "show_register_button" | "ui_type">;
3
+ type ServiceItemSlice = Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "show_dp_ui" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats" | "show_register_button" | "ui_type">;
4
4
  interface OfferBannerColors {
5
5
  bottomStripColor?: string;
6
6
  }
@@ -10,6 +10,8 @@ function truncateOfferText(text) {
10
10
  }
11
11
  function hasDpDiscounts(serviceItem) {
12
12
  var _a, _b;
13
+ if (CommonService.isDpUiHidden(serviceItem))
14
+ return false;
13
15
  return (Object.keys((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _a !== void 0 ? _a : {}).length > 0 ||
14
16
  ((_b = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _b !== void 0 ? _b : []).length > 0);
15
17
  }
@@ -64,16 +66,18 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, isLoggedIn, showLo
64
66
  const isDiscountBelow20 = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) > 0 &&
65
67
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) < 20;
66
68
  const offerText = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "";
69
+ // With show_dp_ui: false the banner renders as for a non-DP service
70
+ const showDpUi = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !CommonService.isDpUiHidden(serviceItem);
67
71
  const isLegacyOffer = !!offerText &&
68
72
  isNewUiEnabled &&
69
73
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 &&
70
- !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled);
74
+ !showDpUi;
71
75
  const showViewers = (isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 1) ||
72
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled);
76
+ showDpUi;
73
77
  const background = isLegacyOffer ? colors === null || colors === void 0 ? void 0 : colors.bottomStripColor : offerGradient;
74
78
  const renderLeftContent = () => {
75
79
  const hasDp = hasDpDiscounts(serviceItem);
76
- if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !hasDp) {
80
+ if (showDpUi && !hasDp) {
77
81
  return React.createElement(PopularServiceBanner, { getAnimationIcon: getAnimationIcon });
78
82
  }
79
83
  if (isLegacyOffer) {
@@ -86,13 +90,13 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, isLoggedIn, showLo
86
90
  };
87
91
  return (React.createElement("div", { className: `text-white w-full absolute ${coachKey ? "-bottom-[40px]" : isExpand ? "-bottom-[40px]" : "-bottom-[40px]"} rounded-b-[14px] text-[14px] h-[58px] flex items-end `, style: {
88
92
  background: (isNewUiEnabled && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 2) ||
89
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
93
+ (showDpUi && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents))
90
94
  ? offerGradient
91
95
  : background,
92
96
  opacity: isSoldOut ? 0.5 : 1,
93
97
  zIndex: isLinatal ? "-1" : "0",
94
98
  paddingBottom: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) !== 2
95
- ? "12px"
99
+ ? "7px"
96
100
  : "9px",
97
101
  } },
98
102
  React.createElement("div", { className: "flex items-center w-full gap-[20px] px-[15px] justify-between" },
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { ServiceItemProps } from "../components/ServiceItem/types";
3
- type ServiceItemSlice = Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats" | "show_register_button">;
3
+ type ServiceItemSlice = Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "show_dp_ui" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats" | "show_register_button">;
4
4
  interface OfferBannerColors {
5
5
  bottomStripColor?: string;
6
6
  }
@@ -10,6 +10,8 @@ function truncateOfferText(text) {
10
10
  }
11
11
  function hasDpDiscounts(serviceItem) {
12
12
  var _a, _b;
13
+ if (CommonService.isDpUiHidden(serviceItem))
14
+ return false;
13
15
  return (Object.keys((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _a !== void 0 ? _a : {}).length > 0 ||
14
16
  ((_b = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _b !== void 0 ? _b : []).length > 0);
15
17
  }
@@ -64,7 +66,9 @@ const PeruOfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, is
64
66
  ? (colors === null || colors === void 0 ? void 0 : colors.bottomStripColor) || offerGradient
65
67
  : offerGradient;
66
68
  const renderLeftContent = () => {
67
- if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !hasDp) {
69
+ if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
70
+ !CommonService.isDpUiHidden(serviceItem) &&
71
+ !hasDp) {
68
72
  return React.createElement(PopularServiceBanner, { getAnimationIcon: getAnimationIcon });
69
73
  }
70
74
  if (isOfferTextOnly) {
@@ -1,3 +1,3 @@
1
1
  import React from "react";
2
- declare const RatingBlock: ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru, isTrain, }: any) => React.JSX.Element;
2
+ declare const RatingBlock: ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru, isTrain, showServiceTypeUnderLogo, }: any) => React.JSX.Element;
3
3
  export default RatingBlock;
@@ -1,15 +1,19 @@
1
1
  import React from "react";
2
2
  import RatingHover from "../components/ServiceItem/RatingHover";
3
- const RatingBlock = ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru = false, isTrain = false, }) => {
3
+ import commonService from "../utils/CommonService";
4
+ const RatingBlock = ({ showRating, serviceItem, isSoldOut, colors, t, translation, isPeru = false, isTrain = false, showServiceTypeUnderLogo = false, }) => {
5
+ const operatorLabel = showServiceTypeUnderLogo
6
+ ? commonService.capitalizeFirstLetter(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type)
7
+ : serviceItem.operator_details[2];
4
8
  return (React.createElement("div", { className: "flex items-center whitespace-nowrap" },
5
9
  showRating && (React.createElement(RatingHover, { serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru })),
6
10
  React.createElement("div", { className: "group relative ml-[10px] text-[12px]", style: {
7
11
  marginLeft: showRating ? "6px" : "0",
8
12
  color: isSoldOut ? "#c0c0c0" : "#464647",
9
13
  } },
10
- React.createElement("span", { className: `block max-w-[120px] cursor-pointer text-[12px] ${isPeru || isTrain ? "overflow-hidden text-ellipsis whitespace-nowrap" : ""}` }, serviceItem.operator_details[2]),
14
+ React.createElement("span", { className: `block max-w-[120px] cursor-pointer text-[12px] ${isPeru || isTrain ? "overflow-hidden text-ellipsis whitespace-nowrap" : ""}` }, operatorLabel),
11
15
  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-nowrap z-10 mt-2.5 w-max text-center shadow-service text-[12px]", style: { backgroundColor: colors.bottomStripColor, zIndex: "300" } },
12
16
  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 } }),
13
- serviceItem.operator_details[2]))));
17
+ operatorLabel))));
14
18
  };
15
19
  export default RatingBlock;
@@ -66,6 +66,10 @@ function getUniqueSeats(seatTypes, isTrain) {
66
66
  return true;
67
67
  });
68
68
  }
69
+ // Matches "160°" as well as a bare "160" label
70
+ function hasInclinationSeatTypes(seatTypes) {
71
+ return (seatTypes !== null && seatTypes !== void 0 ? seatTypes : []).some((seat) => { var _a; return /\b(120|140|160|180)\b/.test(String((_a = seat === null || seat === void 0 ? void 0 : seat.label) !== null && _a !== void 0 ? _a : "")); });
72
+ }
69
73
  function getNumberOfSeats(seatTypes) {
70
74
  return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
71
75
  }
@@ -101,6 +105,12 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
101
105
  const uniqueSeats = getUniqueSeats(seatTypes, isTrain);
102
106
  const sortedSeatTypes = getSortedSeatTypes(seatTypes, isTrain);
103
107
  const numberOfSeats = getNumberOfSeats(seatTypes);
108
+ const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
109
+ (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
110
+ // Peru: list every seat type with its own fare (MovilBus, or inclination
111
+ // seats like 160° / 180°) instead of only the cheapest one.
112
+ const showSeatTypeRows = (isMovilBus || hasInclinationSeatTypes(seatTypes)) &&
113
+ uniqueSeats.length > 1;
104
114
  const isCentered = numberOfSeats < 2 || removeDuplicateSeats;
105
115
  const formatPrice = (price) => availableSeats <= 0
106
116
  ? CommonService.currency(0, currencySign)
@@ -146,10 +156,8 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
146
156
  };
147
157
  const renderSeatPrices = () => {
148
158
  if (isPeru) {
149
- const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
150
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
151
- // Multiple unique seat types → show a price row for each (MovilBus only)
152
- if (isMovilBus && uniqueSeats.length > 1) {
159
+ // Multiple unique seat types → show a price row for each
160
+ if (showSeatTypeRows) {
153
161
  return uniqueSeats
154
162
  .filter((s) => !SEAT_EXCEPTIONS.includes(s.label))
155
163
  .map((val, key) => {
@@ -215,10 +223,8 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
215
223
  })();
216
224
  const renderLabels = () => {
217
225
  if (isPeru) {
218
- const isMovilBus = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "MovilBus" ||
219
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_service_name) === "Movil Bus";
220
- // Multiple unique seat types → show a label row for each (MovilBus only)
221
- if (isMovilBus && uniqueSeats.length > 1) {
226
+ // Multiple unique seat types → show a label row for each
227
+ if (showSeatTypeRows) {
222
228
  return uniqueSeats
223
229
  .filter((s) => !SEAT_EXCEPTIONS.includes(s.label))
224
230
  .map((val, key) => (React.createElement("span", { key: key, className: `flex items-center justify-between text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
@@ -227,7 +233,14 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
227
233
  height: "20px",
228
234
  marginRight: "5px",
229
235
  } })),
230
- CommonService.truncateSeatLabel(val.label))));
236
+ !isMovilBus && isShowSeatIcon && (React.createElement("img", { src: getSeatLabelIcon(val.label, serviceItem), alt: "seattype", style: {
237
+ width: "20px",
238
+ height: "20px",
239
+ marginRight: "5px",
240
+ } })),
241
+ isMovilBus
242
+ ? CommonService.truncateSeatLabel(val.label)
243
+ : CommonService.capitalize(addSeatDegree(val.label)))));
231
244
  }
232
245
  // Single seat type → original behaviour
233
246
  const seats = removeDuplicateSeats ? uniqueSeats : sortedSeatTypes;
@@ -268,6 +281,8 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
268
281
  // ).find(([, percent]) => Number(percent));
269
282
  const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {}).sort(([, a], [, b]) => Number(a) - Number(b))[0];
270
283
  const dpDiscountPercent = dpDiscountEntry === null || dpDiscountEntry === void 0 ? void 0 : dpDiscountEntry[1];
284
+ // show_dp_ui: false falls through to the regular fare layout
285
+ const isDpUiHidden = CommonService.isDpUiHidden(serviceItem);
271
286
  const getLowestDpValue = (source) => {
272
287
  if (!source)
273
288
  return undefined;
@@ -312,7 +327,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
312
327
  ? CommonService.currency(0, currencySign)
313
328
  : CommonService.discountedCurrency(Number(seatTypeFare), currencySign)))));
314
329
  };
315
- if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !dpDiscountEntry) {
330
+ if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !isDpUiHidden && !dpDiscountEntry) {
316
331
  const dpSeats = (removeDuplicateSeats ? uniqueSeats : sortedSeatTypes).filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
317
332
  const lowestFare = dpSeats.length > 0 ? Math.min(...dpSeats.map((s) => Number(s.price))) : 0;
318
333
  return (React.createElement("div", { className: "flex items-center justify-between text-[13.33px] ", style: {
@@ -324,7 +339,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
324
339
  React.createElement("div", null,
325
340
  React.createElement("div", { className: "relative" },
326
341
  React.createElement("div", { className: "absolute -left-[20px] transform -translate-y-1/2 top-[16px]" }, renderIcon("fireIcon", "16px")),
327
- React.createElement("div", { className: "absolute bottom-[35px] left-1/2 -translate-x-1/2 ", style: {
342
+ CommonService.showDpBestPrice(serviceItem) && (React.createElement("div", { className: "absolute bottom-[35px] left-1/2 -translate-x-1/2 ", style: {
328
343
  animation: "pulse-zoom 2s ease-in-out infinite",
329
344
  whiteSpace: "nowrap",
330
345
  } },
@@ -333,12 +348,12 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
333
348
  whiteSpace: "nowrap",
334
349
  color: dpSeatColor,
335
350
  backgroundColor: tooltipColor,
336
- } }, "Mejor precio")),
351
+ } }, "Mejor precio"))),
337
352
  React.createElement("div", { className: "text-[22px] bold-text leading-[30px] text-center", style: { color: isSoldOut ? "#c0c0c0" : dpSeatColor } }, availableSeats <= 0
338
353
  ? CommonService.currency(0, currencySign)
339
354
  : CommonService.discountedCurrency(lowestFare, currencySign))))));
340
355
  }
341
- if (dpDiscountEntry) {
356
+ if (dpDiscountEntry && !isDpUiHidden) {
342
357
  const originalDpPrice = getLowestDpValue(serviceItem.original_dp_price);
343
358
  const allFares = ((_a = serviceItem.seat_types) !== null && _a !== void 0 ? _a : [])
344
359
  .map((st) => st.fare)
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import CommonService from "../../utils/CommonService";
3
3
  const ServiceBadges = ({ showTopLabel, isSoldOut, colors, renderIcon, translation, serviceItem, isAllinBus = false, boardingName, getAnimationIcon, }) => {
4
- return (React.createElement("div", { className: "absolute -top-[13px] left-0 w-full flex items-center justify-end gap-[12px] pr-[22px] z-10" },
4
+ return (React.createElement("div", { className: "absolute -top-[11px] left-0 w-full flex items-center justify-end gap-[12px] pr-[22px] z-10" },
5
5
  showTopLabel && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px] z-10`, style: {
6
6
  backgroundColor: colors.topLabelBgColor || "#fff",
7
7
  border: isSoldOut