kupos-ui-components-lib 5.0.4 → 5.0.6
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.
|
@@ -566,9 +566,10 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
566
566
|
React.createElement("div", { className: "group" },
|
|
567
567
|
React.createElement("div", { className: `${isSoldOut ? "grayscale" : ""}` },
|
|
568
568
|
React.createElement(SvgAmenities, { moreAnemities: false, name: (_c = metaData.amenities[val]) === null || _c === void 0 ? void 0 : _c.split(".")[0].toLowerCase() })),
|
|
569
|
-
React.createElement("div", { className: "hidden group-hover:block absolute top-[
|
|
569
|
+
React.createElement("div", { className: "hidden group-hover:block absolute top-[30px] left-1/2 -translate-x-1/2 text-white rounded-[14px] whitespace-nowrap mt-2.5 text-center shadow-service text-[13.33px]", style: {
|
|
570
570
|
backgroundColor: colors.tooltipColor,
|
|
571
571
|
zIndex: 21,
|
|
572
|
+
padding: "12px",
|
|
572
573
|
} },
|
|
573
574
|
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: {
|
|
574
575
|
borderBottomColor: colors.tooltipColor,
|
|
@@ -576,26 +577,29 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
576
577
|
getAmenityName((_d = metaData.amenities[val]) === null || _d === void 0 ? void 0 : _d.split(".")[0].split("_").join(" ")))))) : null;
|
|
577
578
|
}),
|
|
578
579
|
((_e = serviceItem.operator_details[4]) === null || _e === void 0 ? void 0 : _e.length) > 3 && (React.createElement("div", { className: "relative ml-1 cursor-pointer" },
|
|
579
|
-
React.createElement("div", { className: "w-[16px] h-[16px] bg-gray-200 rounded-full flex justify-center text-sm font-bold group", style: {
|
|
580
|
+
React.createElement("div", { className: "w-[16px] h-[16px] bg-gray-200 rounded-full flex justify-center text-sm font-bold group", style: {
|
|
581
|
+
alignItems: "flex-end",
|
|
582
|
+
marginTop: "3px",
|
|
583
|
+
} },
|
|
580
584
|
React.createElement("img", { src: ((_f = serviceItem.icons) === null || _f === void 0 ? void 0 : _f.plus) ||
|
|
581
585
|
"/images/icons/amenities/icon_plus.svg", className: "w-[16px] h-[16px]", alt: "plus" }),
|
|
582
|
-
React.createElement("div", { className: "hidden group-hover:block absolute
|
|
583
|
-
React.createElement("div", { className: "
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
586
|
+
React.createElement("div", { style: { zIndex: 100 }, className: "hidden group-hover:block absolute top-[30px] left-1/2 -translate-x-1/2 text-white rounded-[14px] whitespace-nowrap mt-2.5 text-center shadow-service text-[13.33px]" },
|
|
587
|
+
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: {
|
|
588
|
+
borderBottomColor: colors.tooltipColor,
|
|
589
|
+
} }),
|
|
590
|
+
React.createElement("div", { className: "flex flex-col gap-[10px] p-3 rounded-[8px] shadow-md animate-fadeIn relative", style: {
|
|
591
|
+
backgroundColor: colors.tooltipColor,
|
|
592
|
+
padding: "1rem",
|
|
593
|
+
} }, metaData &&
|
|
594
|
+
((_g = serviceItem.operator_details[4]) === null || _g === void 0 ? void 0 : _g.map((val, key) => {
|
|
595
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
596
|
+
// Show all amenities with index 3 or higher, excluding WATER
|
|
597
|
+
return key >= 3 &&
|
|
598
|
+
((_b = (_a = metaData.amenities[val]) === null || _a === void 0 ? void 0 : _a.split(".")[0]) === null || _b === void 0 ? void 0 : _b.toUpperCase()) !== "WATER" ? (React.createElement("div", { key: key, className: "flex items-center gap-[5px] whitespace-nowrap text-[13.33px]" },
|
|
599
|
+
React.createElement("div", { className: `${isSoldOut ? "grayscale" : ""}` },
|
|
600
|
+
React.createElement(SvgAmenities, { moreAnemities: true, name: (_d = (_c = metaData.amenities[val]) === null || _c === void 0 ? void 0 : _c.split(".")[0]) === null || _d === void 0 ? void 0 : _d.toUpperCase(), color: "white" })),
|
|
601
|
+
React.createElement("span", { className: "text-white text-xs" }, getAmenityName((_g = (_f = (_e = metaData.amenities[val]) === null || _e === void 0 ? void 0 : _e.split(".")[0]) === null || _f === void 0 ? void 0 : _f.split("_")) === null || _g === void 0 ? void 0 : _g.join(" "))))) : null;
|
|
602
|
+
})))))))))))))),
|
|
599
603
|
children,
|
|
600
604
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && (React.createElement("div", { className: ` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[36px] pt-[50px] -z-10 rounded-b-[14px] text-[14px]`, style: {
|
|
601
605
|
backgroundColor: isSoldOut
|
package/package.json
CHANGED
|
@@ -1109,10 +1109,11 @@ function PeruServiceItemDesktop({
|
|
|
1109
1109
|
/>
|
|
1110
1110
|
</div>
|
|
1111
1111
|
<div
|
|
1112
|
-
className="hidden group-hover:block absolute top-[
|
|
1112
|
+
className="hidden group-hover:block absolute top-[30px] left-1/2 -translate-x-1/2 text-white rounded-[14px] whitespace-nowrap mt-2.5 text-center shadow-service text-[13.33px]"
|
|
1113
1113
|
style={{
|
|
1114
1114
|
backgroundColor: colors.tooltipColor,
|
|
1115
1115
|
zIndex: 21,
|
|
1116
|
+
padding: "12px",
|
|
1116
1117
|
}}
|
|
1117
1118
|
>
|
|
1118
1119
|
{/* Tooltip arrow */}
|
|
@@ -1139,7 +1140,10 @@ function PeruServiceItemDesktop({
|
|
|
1139
1140
|
<div className="relative ml-1 cursor-pointer">
|
|
1140
1141
|
<div
|
|
1141
1142
|
className="w-[16px] h-[16px] bg-gray-200 rounded-full flex justify-center text-sm font-bold group"
|
|
1142
|
-
style={{
|
|
1143
|
+
style={{
|
|
1144
|
+
alignItems: "flex-end",
|
|
1145
|
+
marginTop: "3px",
|
|
1146
|
+
}}
|
|
1143
1147
|
>
|
|
1144
1148
|
<img
|
|
1145
1149
|
src={
|
|
@@ -1149,21 +1153,29 @@ function PeruServiceItemDesktop({
|
|
|
1149
1153
|
className="w-[16px] h-[16px]"
|
|
1150
1154
|
alt="plus"
|
|
1151
1155
|
/>
|
|
1152
|
-
<div
|
|
1156
|
+
<div
|
|
1157
|
+
style={{ zIndex: 100 }}
|
|
1158
|
+
className="hidden group-hover:block absolute top-[30px] left-1/2 -translate-x-1/2 text-white rounded-[14px] whitespace-nowrap mt-2.5 text-center shadow-service text-[13.33px]"
|
|
1159
|
+
>
|
|
1160
|
+
<div
|
|
1161
|
+
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"
|
|
1162
|
+
style={{
|
|
1163
|
+
borderBottomColor: colors.tooltipColor,
|
|
1164
|
+
}}
|
|
1165
|
+
></div>
|
|
1153
1166
|
<div
|
|
1154
1167
|
className="flex flex-col gap-[10px] p-3 rounded-[8px] shadow-md animate-fadeIn relative"
|
|
1155
|
-
style={{
|
|
1168
|
+
style={{
|
|
1169
|
+
backgroundColor: colors.tooltipColor,
|
|
1170
|
+
padding: "1rem",
|
|
1171
|
+
}}
|
|
1156
1172
|
>
|
|
1157
1173
|
{/* Additional amenities */}
|
|
1158
1174
|
{metaData &&
|
|
1159
1175
|
serviceItem.operator_details[4]?.map(
|
|
1160
1176
|
(val, key) => {
|
|
1161
|
-
|
|
1162
|
-
|
|
1163
|
-
];
|
|
1164
|
-
return exceptions.includes(
|
|
1165
|
-
key
|
|
1166
|
-
) ? null : key >= 3 &&
|
|
1177
|
+
// Show all amenities with index 3 or higher, excluding WATER
|
|
1178
|
+
return key >= 3 &&
|
|
1167
1179
|
metaData.amenities[val]
|
|
1168
1180
|
?.split(".")[0]
|
|
1169
1181
|
?.toUpperCase() !== "WATER" ? (
|
|
@@ -1197,12 +1209,12 @@ function PeruServiceItemDesktop({
|
|
|
1197
1209
|
}
|
|
1198
1210
|
)}
|
|
1199
1211
|
{/* Tooltip arrow */}
|
|
1200
|
-
<div
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1212
|
+
{/* <div
|
|
1213
|
+
className="tooltip-arrow absolute -left-[6px] top-[15px] w-0 h-0 border-t-8 border-b-8 border-r-8 border-t-transparent border-b-transparent "
|
|
1214
|
+
style={{
|
|
1215
|
+
borderRightColor: colors.tooltipColor,
|
|
1216
|
+
}}
|
|
1217
|
+
></div> */}
|
|
1206
1218
|
</div>
|
|
1207
1219
|
</div>
|
|
1208
1220
|
</div>
|