kupos-ui-components-lib 10.4.41 → 10.4.43

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 (19) hide show
  1. package/dist/assets/images/directo-icon.png +0 -0
  2. package/dist/components/ServiceItem/ServiceItemDesktop.js +8 -0
  3. package/dist/components/ServiceItem/ServiceItemMobile.js +2 -2
  4. package/dist/components/ServiceItem/mobileTypes.d.ts +2 -0
  5. package/dist/components/ServiceItem/types.d.ts +1 -0
  6. package/dist/ui/SeatSection/SeatSection.js +10 -7
  7. package/dist/ui/ServiceType.d.ts +9 -0
  8. package/dist/ui/ServiceType.js +9 -0
  9. package/dist/ui/mobileweb/BottomAmenitiesMobile.d.ts +4 -1
  10. package/dist/ui/mobileweb/BottomAmenitiesMobile.js +6 -2
  11. package/dist/ui/mobileweb/SeatSectionMobile.js +2 -2
  12. package/package.json +1 -1
  13. package/src/components/ServiceItem/ServiceItemDesktop.tsx +14 -0
  14. package/src/components/ServiceItem/ServiceItemMobile.tsx +2 -0
  15. package/src/components/ServiceItem/mobileTypes.ts +2 -0
  16. package/src/components/ServiceItem/types.ts +1 -0
  17. package/src/ui/SeatSection/SeatSection.tsx +10 -5
  18. package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +30 -0
  19. package/src/ui/mobileweb/SeatSectionMobile.tsx +2 -2
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -297,6 +297,14 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
297
297
  Object.keys(serviceItem.pet_seat_info).length > 0,
298
298
  render: (React.createElement(PetBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, isSoldOut: isSoldOut })),
299
299
  },
300
+ {
301
+ key: "servicetype",
302
+ width: "20%",
303
+ condition: serviceItem.service_type,
304
+ render: (React.createElement("div", { className: "mt-[4px]" },
305
+ renderIcon("serviceTypeIcon", "12px"),
306
+ React.createElement("span", { className: "group text-[13.33px] cursor-pointer ml-[3px] " }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type))),
307
+ },
300
308
  {
301
309
  key: "flexible",
302
310
  width: "20%",
package/dist/components/ServiceItem/ServiceItemMobile.js CHANGED
@@ -161,9 +161,9 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
161
161
  color: colors.tooltipBgColor,
162
162
  } }, "\u00A1\u00DAltimos Asientos!")))) : null,
163
163
  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, 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: () => {
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
165
  setIsExpanded(isItemExpanded ? null : serviceItem.id);
166
- }, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, isTrain: isTrain })),
166
+ }, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, isTrain: isTrain, renderIcon: renderIcon })),
167
167
  React.createElement(ServiceBadgesMobile, { showTopLabel: showTopLabel || undefined, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, serviceItem: serviceItem, isConexion: isConexion, isAllinBus: isAllinBus, boardingName: boardingName })),
168
168
  hasOfferText &&
169
169
  isNewUiEnabled &&
package/dist/components/ServiceItem/mobileTypes.d.ts CHANGED
@@ -3,6 +3,7 @@ export interface MobileServiceItemProps {
3
3
  amenitiesData?: any;
4
4
  serviceItem: {
5
5
  id: string;
6
+ service_type?: string;
6
7
  is_transpordo?: boolean;
7
8
  operator_details: [
8
9
  string,
@@ -102,6 +103,7 @@ export interface MobileServiceItemProps {
102
103
  airConditionIcon?: string;
103
104
  baggageIcon?: string;
104
105
  chargingIcon?: string;
106
+ serviceTypeIcon?: string;
105
107
  coffeeIcon?: string;
106
108
  foodIcon?: string;
107
109
  gamingIcon?: string;
package/dist/components/ServiceItem/types.d.ts CHANGED
@@ -5,6 +5,7 @@ export interface ServiceItemProps {
5
5
  children?: React.ReactNode;
6
6
  serviceItem: {
7
7
  id: string;
8
+ service_type?: string;
8
9
  operator_details: [
9
10
  string,
10
11
  string | number,
package/dist/ui/SeatSection/SeatSection.js CHANGED
@@ -268,17 +268,18 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
268
268
  Math.round(Number(dpDiscountPercent)),
269
269
  "% OFF"))),
270
270
  React.createElement("div", { className: "col-start-2 row-start-2 flex items-center justify-center", style: { textAlign: "center" } },
271
- React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#9f9f9f] relative", style: { position: "relative" } },
271
+ React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#9f9f9f] relative", style: { position: "relative", display: "inline-block" } },
272
272
  formatPrice(Number(originalDpPrice)),
273
- React.createElement("span", { style: {
273
+ React.createElement("span", { "aria-hidden": "true", style: {
274
274
  position: "absolute",
275
275
  left: "-2px",
276
+ right: "-2px",
276
277
  top: "50%",
277
- width: "calc(100% + 4px)",
278
278
  height: "1px",
279
- backgroundColor: discountSeatPriceColor,
279
+ backgroundColor: discountSeatPriceColor || "#ff5c60",
280
280
  transform: "rotate(-10deg)",
281
281
  transformOrigin: "center",
282
+ pointerEvents: "none",
282
283
  } }))),
283
284
  React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
284
285
  React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : dpSeatColor || "#ff5964" } },
@@ -349,18 +350,20 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
349
350
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.ui_type) === 1 ? null : (React.createElement("div", { className: "col-start-2 row-start-2 flex items-center justify-center ", style: { textAlign: "center" } },
350
351
  React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] relative whitespace-nowrap", style: {
351
352
  position: "relative",
353
+ display: "inline-block",
352
354
  color: discountSeatCrossPriceColor,
353
355
  } },
354
356
  formatPrice(discountSeat.originalPrice),
355
- React.createElement("span", { style: {
357
+ React.createElement("span", { "aria-hidden": "true", style: {
356
358
  position: "absolute",
357
359
  left: "-2px",
360
+ right: "-2px",
358
361
  top: "50%",
359
- width: "calc(100% + 4px)",
360
362
  height: "1px",
361
- backgroundColor: discountSeatCrossPriceColor,
363
+ backgroundColor: discountSeatCrossPriceColor || "#ff5c60",
362
364
  transform: "rotate(-10deg)",
363
365
  transformOrigin: "center",
366
+ pointerEvents: "none",
364
367
  } })))),
365
368
  React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
366
369
  React.createElement("span", { className: "flex items-center gap-[6px] bold-text leading-[30px]", style: {
package/dist/ui/ServiceType.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import React from "react";
2
+ declare const ServiceType: ({ serviceItem, translation, renderIcon, isSoldOut, colors, }: {
3
+ serviceItem: any;
4
+ translation: any;
5
+ renderIcon: any;
6
+ isSoldOut: any;
7
+ colors: any;
8
+ }) => React.JSX.Element;
9
+ export default ServiceType;
package/dist/ui/ServiceType.js ADDED
@@ -0,0 +1,9 @@
1
+ import React from "react";
2
+ const ServiceType = ({ serviceItem, translation, renderIcon, isSoldOut, colors, }) => (React.createElement("div", { className: "flex items-baseline relative whitespace-nowrap " },
3
+ React.createElement("div", { className: `w-[18px] mr-[4px] ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }),
4
+ React.createElement("div", { className: "group text-[13.33px] cursor-pointer" },
5
+ React.createElement("span", { style: { opacity: isSoldOut ? 0.5 : 1 } }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.service_type),
6
+ React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[188px] text-center break-normal shadow-service text-[12px]", style: { backgroundColor: colors.bottomStripColor } },
7
+ 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 } }),
8
+ "Duraci\u00F3n estimada del viaje"))));
9
+ export default ServiceType;
package/dist/ui/mobileweb/BottomAmenitiesMobile.d.ts CHANGED
@@ -25,6 +25,9 @@ interface BottomAmenitiesMobileProps {
25
25
  isDpEnabled?: boolean;
26
26
  isTrain?: boolean;
27
27
  seatCategoryText?: string;
28
+ serviceType?: string;
29
+ serviceTypeIcon?: string;
30
+ renderIcon?: any;
28
31
  }
29
- declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, isTrain, seatCategoryText, }: BottomAmenitiesMobileProps): React.ReactElement;
32
+ declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, isTrain, seatCategoryText, serviceType, serviceTypeIcon, renderIcon, }: BottomAmenitiesMobileProps): React.ReactElement;
30
33
  export default BottomAmenitiesMobile;
package/dist/ui/mobileweb/BottomAmenitiesMobile.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import LottiePlayer from "../../assets/LottiePlayer";
3
3
  import DateService from "../../utils/DateService";
4
- function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, isTrain, seatCategoryText, }) {
4
+ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, isTrain, seatCategoryText, serviceType, serviceTypeIcon, renderIcon, }) {
5
5
  return (React.createElement("div", { className: `${"flex justify-between items-center items-center "}` },
6
6
  React.createElement("div", { className: "w-[55%] flex justify-between items-center" },
7
7
  React.createElement("div", { style: { opacity: isSoldOut ? 0.5 : 1 } }, amenitiesNodes),
@@ -10,7 +10,11 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
10
10
  "\u00A0",
11
11
  React.createElement("div", { className: `cursor-default group min-[420]:text-[13px] text-[12px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: { lineHeight: "normal" } },
12
12
  DateService.formatDuration(duration),
13
- "hrs"))),
13
+ "hrs")),
14
+ serviceType && (React.createElement("div", { className: "flex relative ", style: { color: isSoldOut ? "#bbb" : "text-[#464647]" } },
15
+ React.createElement("div", { className: `w-[12px] h-auto mr-[2px] ${isSoldOut ? "grayscale" : ""}` }, renderIcon("serviceTypeIcon", "12px")),
16
+ "\u00A0",
17
+ React.createElement("div", { className: `cursor-default group min-[420]:text-[13px] text-[12px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: { lineHeight: "normal" } }, serviceType)))),
14
18
  seatCategoryText && (React.createElement("div", { className: "flex-1 text-right whitespace-nowrap min-[420]:text-[13px] text-[12px]", style: { opacity: isSoldOut ? 0.5 : 1 } }, seatCategoryText)),
15
19
  React.createElement("div", { className: "flex items-center" },
16
20
  React.createElement("div", null, (isChangeTicket || isPetSeat) && (React.createElement("div", { className: "flex items-center" },
package/dist/ui/mobileweb/SeatSectionMobile.js CHANGED
@@ -246,7 +246,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
246
246
  left: "50%",
247
247
  width: "80%",
248
248
  height: "1px",
249
- background: discountSeatPriceColor,
249
+ background: discountSeatPriceColor || "#ff5c60",
250
250
  transform: "rotate(-12deg)",
251
251
  transformOrigin: "center",
252
252
  } })),
@@ -282,7 +282,7 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
282
282
  left: "50%",
283
283
  width: "80%",
284
284
  height: "1px",
285
- background: discountSeatCrossPriceColor,
285
+ background: discountSeatCrossPriceColor || "#ff5c60",
286
286
  transform: "rotate(-12deg)",
287
287
  transformOrigin: "center",
288
288
  } })))),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "10.4.41",
3
+ "version": "10.4.43",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -462,6 +462,20 @@ function ServiceItemPB({
462
462
  ),
463
463
  },
464
464
 
465
+ {
466
+ key: "servicetype",
467
+ width: "20%",
468
+ condition: serviceItem.service_type,
469
+ render: (
470
+ <div className="mt-[4px]">
471
+ {renderIcon("serviceTypeIcon", "12px")}
472
+ <span className="group text-[13.33px] cursor-pointer ml-[3px] ">
473
+ {serviceItem?.service_type}
474
+ </span>
475
+ </div>
476
+ ),
477
+ },
478
+
465
479
  {
466
480
  key: "flexible",
467
481
  width: "20%",
package/src/components/ServiceItem/ServiceItemMobile.tsx CHANGED
@@ -432,6 +432,7 @@ function ServiceItemMobile({
432
432
  hoursIcon={renderIcon("hours", "14px")}
433
433
  duration={serviceItem.duration?.toString()}
434
434
  isDirectTrip={serviceItem?.is_direct_trip}
435
+ serviceType={serviceItem?.service_type}
435
436
  directoColor={colors.directoColor}
436
437
  directoAnim={serviceItem.icons.directoAnim}
437
438
  isChangeTicket={serviceItem.is_change_ticket}
@@ -454,6 +455,7 @@ function ServiceItemMobile({
454
455
  ladiesBookedSeats={serviceItem.ladies_booked_seats}
455
456
  isDpEnabled={serviceItem.is_dp_enabled}
456
457
  isTrain={isTrain}
458
+ renderIcon={renderIcon}
457
459
  />
458
460
  </div>
459
461
 
package/src/components/ServiceItem/mobileTypes.ts CHANGED
@@ -6,6 +6,7 @@ export interface MobileServiceItemProps {
6
6
  amenitiesData?: any;
7
7
  serviceItem: {
8
8
  id: string;
9
+ service_type?: string;
9
10
  is_transpordo?: boolean;
10
11
  operator_details: [
11
12
  string,
@@ -105,6 +106,7 @@ export interface MobileServiceItemProps {
105
106
  airConditionIcon?: string;
106
107
  baggageIcon?: string;
107
108
  chargingIcon?: string;
109
+ serviceTypeIcon?: string;
108
110
  coffeeIcon?: string;
109
111
  foodIcon?: string;
110
112
  gamingIcon?: string;
package/src/components/ServiceItem/types.ts CHANGED
@@ -7,6 +7,7 @@ export interface ServiceItemProps {
7
7
  children?: React.ReactNode;
8
8
  serviceItem: {
9
9
  id: string;
10
+ service_type?: string;
10
11
  operator_details: [
11
12
  string,
12
13
  string | number,
package/src/ui/SeatSection/SeatSection.tsx CHANGED
@@ -516,19 +516,21 @@ function SeatSection({
516
516
  >
517
517
  <span
518
518
  className="text-[13.33px] font-normal leading-[20px] text-[#9f9f9f] relative"
519
- style={{ position: "relative" }}
519
+ style={{ position: "relative", display: "inline-block" }}
520
520
  >
521
521
  {formatPrice(Number(originalDpPrice))}
522
522
  <span
523
+ aria-hidden="true"
523
524
  style={{
524
525
  position: "absolute",
525
526
  left: "-2px",
527
+ right: "-2px",
526
528
  top: "50%",
527
- width: "calc(100% + 4px)",
528
529
  height: "1px",
529
- backgroundColor: discountSeatPriceColor,
530
+ backgroundColor: discountSeatPriceColor || "#ff5c60",
530
531
  transform: "rotate(-10deg)",
531
532
  transformOrigin: "center",
533
+ pointerEvents: "none",
532
534
  }}
533
535
  />
534
536
  </span>
@@ -694,20 +696,23 @@ function SeatSection({
694
696
  className="text-[13.33px] font-normal leading-[20px] relative whitespace-nowrap"
695
697
  style={{
696
698
  position: "relative",
699
+ display: "inline-block",
697
700
  color: discountSeatCrossPriceColor,
698
701
  }}
699
702
  >
700
703
  {formatPrice(discountSeat.originalPrice)}
701
704
  <span
705
+ aria-hidden="true"
702
706
  style={{
703
707
  position: "absolute",
704
708
  left: "-2px",
709
+ right: "-2px",
705
710
  top: "50%",
706
- width: "calc(100% + 4px)",
707
711
  height: "1px",
708
- backgroundColor: discountSeatCrossPriceColor,
712
+ backgroundColor: discountSeatCrossPriceColor || "#ff5c60",
709
713
  transform: "rotate(-10deg)",
710
714
  transformOrigin: "center",
715
+ pointerEvents: "none",
711
716
  }}
712
717
  />
713
718
  </span>
package/src/ui/mobileweb/BottomAmenitiesMobile.tsx CHANGED
@@ -28,6 +28,9 @@ interface BottomAmenitiesMobileProps {
28
28
  isDpEnabled?: boolean;
29
29
  isTrain?: boolean;
30
30
  seatCategoryText?: string;
31
+ serviceType?: string;
32
+ serviceTypeIcon?: string;
33
+ renderIcon?: any;
31
34
  }
32
35
 
33
36
  function BottomAmenitiesMobile({
@@ -56,6 +59,9 @@ function BottomAmenitiesMobile({
56
59
  isDpEnabled,
57
60
  isTrain,
58
61
  seatCategoryText,
62
+ serviceType,
63
+ serviceTypeIcon,
64
+ renderIcon,
59
65
  }: BottomAmenitiesMobileProps): React.ReactElement {
60
66
  return (
61
67
  <div className={`${"flex justify-between items-center items-center "}`}>
@@ -84,6 +90,30 @@ function BottomAmenitiesMobile({
84
90
  </div>
85
91
  </div>
86
92
 
93
+ {serviceType && (
94
+ <div
95
+ className="flex relative "
96
+ style={{ color: isSoldOut ? "#bbb" : "text-[#464647]" }}
97
+ >
98
+ <div
99
+ className={`w-[12px] h-auto mr-[2px] ${
100
+ isSoldOut ? "grayscale" : ""
101
+ }`}
102
+ >
103
+ {renderIcon("serviceTypeIcon", "12px")}
104
+ </div>
105
+ &nbsp;
106
+ <div
107
+ className={`cursor-default group min-[420]:text-[13px] text-[12px] ${
108
+ isSoldOut ? "text-[#c0c0c0]" : ""
109
+ }`}
110
+ style={{ lineHeight: "normal" }}
111
+ >
112
+ {serviceType}
113
+ </div>
114
+ </div>
115
+ )}
116
+
87
117
  {/* {isDirectTrip && (
88
118
  <div
89
119
  className={`flex items-center gap-[2px] text-white min-[420]:text-[12px] text-[10px] z-20 `}
package/src/ui/mobileweb/SeatSectionMobile.tsx CHANGED
@@ -568,7 +568,7 @@ function SeatSectionMobile({
568
568
  left: "50%",
569
569
  width: "80%",
570
570
  height: "1px",
571
- background: discountSeatPriceColor,
571
+ background: discountSeatPriceColor || "#ff5c60",
572
572
  transform: "rotate(-12deg)",
573
573
  transformOrigin: "center",
574
574
  }}
@@ -654,7 +654,7 @@ function SeatSectionMobile({
654
654
  left: "50%",
655
655
  width: "80%",
656
656
  height: "1px",
657
- background: discountSeatCrossPriceColor,
657
+ background: discountSeatCrossPriceColor || "#ff5c60",
658
658
  transform: "rotate(-12deg)",
659
659
  transformOrigin: "center",
660
660
  }}