kupos-ui-components-lib 10.4.20 → 10.4.22

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 (11) hide show
  1. package/dist/components/ServiceItem/PeruServiceItemDesktop.js +3 -1
  2. package/dist/components/ServiceItem/types.d.ts +1 -0
  3. package/dist/ui/BottomAmenities/BottomAmenities.js +1 -1
  4. package/dist/ui/ServiceBadges/ServiceBadges.js +8 -4
  5. package/dist/ui/mobileweb/BottomAmenitiesMobile.js +1 -1
  6. package/package.json +1 -1
  7. package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +4 -2
  8. package/src/components/ServiceItem/types.ts +1 -0
  9. package/src/ui/BottomAmenities/BottomAmenities.tsx +1 -1
  10. package/src/ui/ServiceBadges/ServiceBadges.tsx +8 -8
  11. package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +1 -1
package/dist/components/ServiceItem/PeruServiceItemDesktop.js CHANGED
@@ -428,7 +428,9 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
428
428
  React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:14%_40%_0.5%_24%_13.5%] gap-x-[2%] items-center",
429
429
  // style={{ marginTop: showTopLabel ? "8px" : "" }}
430
430
  style: {
431
- marginTop: showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "8px" : "",
431
+ marginTop: showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) || boardingName
432
+ ? "8px"
433
+ : "",
432
434
  } },
433
435
  React.createElement("div", { style: {
434
436
  display: "flex",
package/dist/components/ServiceItem/types.d.ts CHANGED
@@ -179,6 +179,7 @@ export interface ServiceItemProps {
179
179
  leftGradiantColor?: string;
180
180
  discountSeatPriceColor?: string;
181
181
  topLabelBgColor?: string;
182
+ boardingBorderColor?: string;
182
183
  };
183
184
  cityOrigin?: {
184
185
  value: number;
package/dist/ui/BottomAmenities/BottomAmenities.js CHANGED
@@ -19,7 +19,7 @@ function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, i
19
19
  React.createElement("div", { className: "flex items-center justify-end shrink-0 ml-[5px] w-[150px]" },
20
20
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled) && (React.createElement("div", { className: grayscaleClass + " mr-[10px]" },
21
21
  React.createElement(LottiePlayer, { animationData: getAnimationIcon("locationAnim"), width: "20px", height: "20px" }))),
22
- serviceItem.is_change_ticket && !isDpEnabled && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
22
+ serviceItem.is_change_ticket && !isDpEnabled && !isPeru && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
23
23
  serviceItem.ladies_booked_seats &&
24
24
  String(serviceItem.ladies_booked_seats).trim() !== "" &&
25
25
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true && (React.createElement(FemaleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
package/dist/ui/ServiceBadges/ServiceBadges.js CHANGED
@@ -1,5 +1,4 @@
1
1
  import React from "react";
2
- import LottiePlayer from "../../assets/LottiePlayer";
3
2
  import CommonService from "../../utils/CommonService";
4
3
  const ServiceBadges = ({ showTopLabel, isSoldOut, colors, renderIcon, translation, serviceItem, isAllinBus = false, boardingName, getAnimationIcon, }) => {
5
4
  return (React.createElement("div", { className: "absolute -top-[10px] left-0 w-full flex items-center justify-end gap-[12px] pr-[22px] z-10" },
@@ -43,9 +42,14 @@ const ServiceBadges = ({ showTopLabel, isSoldOut, colors, renderIcon, translatio
43
42
  React.createElement("div", null, "Tren Express"))),
44
43
  boardingName && isAllinBus && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px] z-20`, style: {
45
44
  backgroundColor: colors.topLabelBgColor || "#fff",
45
+ border: isSoldOut
46
+ ? "1px solid #ccc"
47
+ : `1px solid ${colors.boardingBorderColor}`,
48
+ color: isSoldOut ? "#ccc" : colors.boardingBorderColor,
46
49
  } },
47
- React.createElement("div", { className: isSoldOut ? "grayscale" : "" },
48
- React.createElement(LottiePlayer, { animationData: getAnimationIcon("priorityStageAnim"), width: "14px", height: "14px" })),
49
- React.createElement("div", { className: isSoldOut ? "text-white" : `text-[${colors.topLabelColor}]` }, CommonService.capitalize(boardingName))))));
50
+ renderIcon("specialDeparture", "12px", {
51
+ filter: isSoldOut ? "grayscale(0.5)" : "",
52
+ }),
53
+ React.createElement("div", { className: isSoldOut ? "text-white" : `text-[${colors.boardingBorderColor}]` }, CommonService.capitalize(boardingName))))));
50
54
  };
51
55
  export default ServiceBadges;
package/dist/ui/mobileweb/BottomAmenitiesMobile.js CHANGED
@@ -19,7 +19,7 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
19
19
  React.createElement("div", { className: "flex items-center" },
20
20
  React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
21
21
  React.createElement(LottiePlayer, { animationData: petFriendlyAnim, width: "16px", height: "16px" })))))) : null,
22
- isChangeTicket && !isDpEnabled && (React.createElement("div", { className: "flex items-center" },
22
+ isChangeTicket && !isDpEnabled && !isPeru && (React.createElement("div", { className: "flex items-center" },
23
23
  React.createElement("div", { className: "relative group cursor-default" },
24
24
  React.createElement("div", { className: "flex items-center" },
25
25
  React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "10.4.20",
3
+ "version": "10.4.22",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/PeruServiceItemDesktop.tsx CHANGED
@@ -556,7 +556,7 @@ function PeruServiceItemDesktop({
556
556
  />
557
557
  ),
558
558
  },
559
- {
559
+ {
560
560
  key: "seatCategory",
561
561
  width: "40%",
562
562
  condition: serviceItem.api_type === 78 && !!serviceItem.number,
@@ -679,7 +679,9 @@ function PeruServiceItemDesktop({
679
679
  // style={{ marginTop: showTopLabel ? "8px" : "" }}
680
680
  style={{
681
681
  marginTop:
682
- showTopLabel || serviceItem?.is_direct_trip ? "8px" : "",
682
+ showTopLabel || serviceItem?.is_direct_trip || boardingName
683
+ ? "8px"
684
+ : "",
683
685
  }}
684
686
  >
685
687
  {/* OPERATOR LOGO */}
package/src/components/ServiceItem/types.ts CHANGED
@@ -183,6 +183,7 @@ export interface ServiceItemProps {
183
183
  leftGradiantColor?: string;
184
184
  discountSeatPriceColor?: string;
185
185
  topLabelBgColor?: string;
186
+ boardingBorderColor?: string;
186
187
  };
187
188
  cityOrigin?: { value: number; label: string };
188
189
  cityDestination?: { value: number; label: string };
package/src/ui/BottomAmenities/BottomAmenities.tsx CHANGED
@@ -86,7 +86,7 @@ function BottomAmenities({
86
86
  />
87
87
  </div>
88
88
  )}
89
- {serviceItem.is_change_ticket && !isDpEnabled && (
89
+ {serviceItem.is_change_ticket && !isDpEnabled && !isPeru && (
90
90
  <FlexibleBlock
91
91
  translation={translation}
92
92
  getAnimationIcon={getAnimationIcon}
package/src/ui/ServiceBadges/ServiceBadges.tsx CHANGED
@@ -102,18 +102,18 @@ const ServiceBadges: React.FC<ServiceBadgesProps> = ({
102
102
  className={`flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px] z-20`}
103
103
  style={{
104
104
  backgroundColor: colors.topLabelBgColor || "#fff",
105
+ border: isSoldOut
106
+ ? "1px solid #ccc"
107
+ : `1px solid ${colors.boardingBorderColor}`,
108
+ color: isSoldOut ? "#ccc" : colors.boardingBorderColor,
105
109
  }}
106
110
  >
107
- <div className={isSoldOut ? "grayscale" : ""}>
108
- <LottiePlayer
109
- animationData={getAnimationIcon("priorityStageAnim")}
110
- width="14px"
111
- height="14px"
112
- />
113
- </div>
111
+ {renderIcon("specialDeparture", "12px", {
112
+ filter: isSoldOut ? "grayscale(0.5)" : "",
113
+ })}
114
114
  <div
115
115
  className={
116
- isSoldOut ? "text-white" : `text-[${colors.topLabelColor}]`
116
+ isSoldOut ? "text-white" : `text-[${colors.boardingBorderColor}]`
117
117
  }
118
118
  >
119
119
  {CommonService.capitalize(boardingName)}
package/src/ui/mobileweb/BottomAmenitiesMobile.tsx CHANGED
@@ -134,7 +134,7 @@ function BottomAmenitiesMobile({
134
134
  ) : null}
135
135
 
136
136
  {/* Flexible ticket */}
137
- {isChangeTicket && !isDpEnabled && (
137
+ {isChangeTicket && !isDpEnabled && !isPeru && (
138
138
  <div className="flex items-center">
139
139
  <div className="relative group cursor-default">
140
140
  <div className="flex items-center">