kupos-ui-components-lib 10.3.1 → 10.3.2
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.
- package/dist/components/ServiceItem/ServiceItemDesktop.js +1 -1
- package/dist/ui/BottomAmenities/BottomAmenities.d.ts +2 -1
- package/dist/ui/BottomAmenities/BottomAmenities.js +2 -2
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +3 -2
- package/dist/ui/mobileweb/BottomAmenitiesMobile.js +1 -1
- package/dist/ui/mobileweb/ExpandedDropdownMobile.js +2 -2
- package/package.json +1 -1
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +1 -0
- package/src/ui/BottomAmenities/BottomAmenities.tsx +3 -1
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +3 -2
- package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +1 -1
- package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +2 -2
|
@@ -339,7 +339,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
339
339
|
color: colors.seatPriceColor,
|
|
340
340
|
} }, "\u00A1\u00DAltimos Asientos!")))) : null)),
|
|
341
341
|
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 &&
|
|
342
|
-
setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain }))),
|
|
342
|
+
setIsExpand(isItemExpanded ? null : serviceItem.id), isPeru: isPeru, isTrain: isTrain, isDpEnabled: serviceItem.is_dp_enabled }))),
|
|
343
343
|
isPeru ? null : (React.createElement("div", { style: {
|
|
344
344
|
display: "grid",
|
|
345
345
|
gridTemplateRows: isItemExpanded ? "1fr" : "0fr",
|
|
@@ -25,6 +25,7 @@ interface BottomAmenitiesProps {
|
|
|
25
25
|
onToggleExpand: () => void;
|
|
26
26
|
isPeru?: boolean;
|
|
27
27
|
isTrain?: boolean;
|
|
28
|
+
isDpEnabled?: boolean;
|
|
28
29
|
}
|
|
29
|
-
declare function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, }: BottomAmenitiesProps): React.ReactElement;
|
|
30
|
+
declare function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, isDpEnabled, }: BottomAmenitiesProps): React.ReactElement;
|
|
30
31
|
export default BottomAmenities;
|
|
@@ -3,7 +3,7 @@ import LottiePlayer from "../../assets/LottiePlayer";
|
|
|
3
3
|
import FlexibleBlock from "../FlexibleBlock";
|
|
4
4
|
import PetBlock from "../PetBlock";
|
|
5
5
|
import FemaleBlock from "../FemaleBlock";
|
|
6
|
-
function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, }) {
|
|
6
|
+
function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, isTrain, isDpEnabled, }) {
|
|
7
7
|
const hasPetInfo = serviceItem.pet_seat_info &&
|
|
8
8
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
9
9
|
const showDownArrow = ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_change_ticket) && serviceItem.pet_seat_info) ||
|
|
@@ -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 && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
22
|
+
serviceItem.is_change_ticket && !isDpEnabled && (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 })),
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAnimationIcon, isChangeTicket = false, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, operatorLabel, }) {
|
|
3
|
+
console.log("🚀 ~ ExpandedDropdown ~ isDpEnabled:", isDpEnabled, serviceItem);
|
|
3
4
|
const hasPetInfo = serviceItem.pet_seat_info &&
|
|
4
5
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
5
6
|
return (React.createElement("div", { className: "px-[15px] pt-[26px] pb-[14px] -mt-[16px] pt-[35px] relative -z-9", style: {
|
|
@@ -7,7 +8,7 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
|
|
|
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 ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
|
|
11
|
+
isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[8px]", style: { lineHeight: 1.5 } },
|
|
11
12
|
React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
|
|
12
13
|
React.createElement("span", null,
|
|
13
14
|
React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
|
|
@@ -41,7 +42,7 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
|
|
|
41
42
|
React.createElement("span", null, renderIcon("cancelTicketIcon", "16px")),
|
|
42
43
|
React.createElement("span", null,
|
|
43
44
|
React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n: "),
|
|
44
|
-
isDpEnabled ? (React.createElement("span", null, "Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
45
|
+
isDpEnabled ? (React.createElement("span", null, "Tu pasaje no podr\u00E1 ser anulado o cambiado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
45
46
|
" ",
|
|
46
47
|
"Tu pasaje puede ser anulado de forma online",
|
|
47
48
|
" ",
|
|
@@ -18,7 +18,7 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
|
|
|
18
18
|
React.createElement("div", { className: "flex items-center" },
|
|
19
19
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
20
20
|
React.createElement(LottiePlayer, { animationData: petFriendlyAnim, width: "16px", height: "16px" })))))) : null,
|
|
21
|
-
isChangeTicket && (React.createElement("div", { className: "flex items-center" },
|
|
21
|
+
isChangeTicket && !isDpEnabled && (React.createElement("div", { className: "flex items-center" },
|
|
22
22
|
React.createElement("div", { className: "relative group cursor-default" },
|
|
23
23
|
React.createElement("div", { className: "flex items-center" },
|
|
24
24
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
@@ -6,7 +6,7 @@ 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 ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
|
|
9
|
+
isPeru || isDpEnabled ? null : isChangeTicket ? (React.createElement("div", { className: "flex gap-[6px]" },
|
|
10
10
|
React.createElement("span", { className: "mt-[3px]" }, renderIcon("changeTicketIcon", "14px")),
|
|
11
11
|
React.createElement("span", null,
|
|
12
12
|
React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
|
|
@@ -50,7 +50,7 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
|
|
|
50
50
|
React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n: "),
|
|
51
51
|
isDpEnabled ? (React.createElement("span", null,
|
|
52
52
|
" ",
|
|
53
|
-
"Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
53
|
+
"Tu pasaje no podr\u00E1 ser anulado o cambiado por tener una tarifa preferencial.")) : (React.createElement("span", null,
|
|
54
54
|
"Tu pasaje puede ser anulado de forma online",
|
|
55
55
|
" ",
|
|
56
56
|
React.createElement("span", { className: "bold-text" }, " hasta 4 horas antes"),
|
package/package.json
CHANGED
|
@@ -29,6 +29,7 @@ interface BottomAmenitiesProps {
|
|
|
29
29
|
onToggleExpand: () => void;
|
|
30
30
|
isPeru?: boolean;
|
|
31
31
|
isTrain?: boolean;
|
|
32
|
+
isDpEnabled?: boolean;
|
|
32
33
|
}
|
|
33
34
|
|
|
34
35
|
function BottomAmenities({
|
|
@@ -44,6 +45,7 @@ function BottomAmenities({
|
|
|
44
45
|
onToggleExpand,
|
|
45
46
|
isPeru,
|
|
46
47
|
isTrain,
|
|
48
|
+
isDpEnabled,
|
|
47
49
|
}: BottomAmenitiesProps): React.ReactElement {
|
|
48
50
|
const hasPetInfo =
|
|
49
51
|
serviceItem.pet_seat_info &&
|
|
@@ -84,7 +86,7 @@ function BottomAmenities({
|
|
|
84
86
|
/>
|
|
85
87
|
</div>
|
|
86
88
|
)}
|
|
87
|
-
{serviceItem.is_change_ticket && (
|
|
89
|
+
{serviceItem.is_change_ticket && !isDpEnabled && (
|
|
88
90
|
<FlexibleBlock
|
|
89
91
|
translation={translation}
|
|
90
92
|
getAnimationIcon={getAnimationIcon}
|
|
@@ -31,6 +31,7 @@ function ExpandedDropdown({
|
|
|
31
31
|
renderIcon,
|
|
32
32
|
operatorLabel,
|
|
33
33
|
}: ExpandedDropdownProps): React.ReactElement {
|
|
34
|
+
console.log("🚀 ~ ExpandedDropdown ~ isDpEnabled:", isDpEnabled, serviceItem);
|
|
34
35
|
const hasPetInfo =
|
|
35
36
|
serviceItem.pet_seat_info &&
|
|
36
37
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
@@ -47,7 +48,7 @@ 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 ? null : isChangeTicket ? (
|
|
51
|
+
{isPeru || isDpEnabled ? null : isChangeTicket ? (
|
|
51
52
|
<div className="flex gap-[8px]" style={{ lineHeight: 1.5 }}>
|
|
52
53
|
<span>{renderIcon("changeTicketIcon", "16px")}</span>
|
|
53
54
|
{/* <span style={{ marginTop: "2px" }}>
|
|
@@ -110,7 +111,7 @@ function ExpandedDropdown({
|
|
|
110
111
|
<span className="bold-text">Políticas de anulación: </span>
|
|
111
112
|
{isDpEnabled ? (
|
|
112
113
|
<span>
|
|
113
|
-
Tu pasaje no podrá ser anulado por tener una tarifa
|
|
114
|
+
Tu pasaje no podrá ser anulado o cambiado por tener una tarifa
|
|
114
115
|
preferencial.
|
|
115
116
|
</span>
|
|
116
117
|
) : (
|
|
@@ -123,7 +123,7 @@ function BottomAmenitiesMobile({
|
|
|
123
123
|
) : null}
|
|
124
124
|
|
|
125
125
|
{/* Flexible ticket */}
|
|
126
|
-
{isChangeTicket && (
|
|
126
|
+
{isChangeTicket && !isDpEnabled && (
|
|
127
127
|
<div className="flex items-center">
|
|
128
128
|
<div className="relative group cursor-default">
|
|
129
129
|
<div className="flex items-center">
|
|
@@ -48,7 +48,7 @@ function ExpandedDropdownMobile({
|
|
|
48
48
|
className="flex flex-col gap-[8px] text-[11px] min-[420px]:text-[12px] text-[#464647]"
|
|
49
49
|
style={{ lineHeight: 1.6 }}
|
|
50
50
|
>
|
|
51
|
-
{isPeru ? null : isChangeTicket ? (
|
|
51
|
+
{isPeru || isDpEnabled ? null : isChangeTicket ? (
|
|
52
52
|
<div className="flex gap-[6px]">
|
|
53
53
|
<span className="mt-[3px]">
|
|
54
54
|
{renderIcon("changeTicketIcon", "14px")}
|
|
@@ -126,7 +126,7 @@ function ExpandedDropdownMobile({
|
|
|
126
126
|
{isDpEnabled ? (
|
|
127
127
|
<span>
|
|
128
128
|
{" "}
|
|
129
|
-
Tu pasaje no podrá ser anulado por tener una tarifa
|
|
129
|
+
Tu pasaje no podrá ser anulado o cambiado por tener una tarifa
|
|
130
130
|
preferencial.
|
|
131
131
|
</span>
|
|
132
132
|
) : (
|