kupos-ui-components-lib 5.0.3 → 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.
- package/dist/components/FilterBar/FilterBarDesktop.js +20 -8
- package/dist/components/FilterBar/ServiceFilter.js +8 -8
- package/dist/components/ServiceItem/PeruServiceItemDesktop.js +23 -19
- package/package.json +1 -1
- package/src/components/FilterBar/FilterBarDesktop.tsx +12 -0
- package/src/components/FilterBar/ServiceFilter.tsx +10 -9
- package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +28 -16
|
@@ -139,7 +139,7 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
139
139
|
let activeOptions = fil.options.filter((it) => it.active);
|
|
140
140
|
// if (activeOptions && activeOptions.length > 0) {
|
|
141
141
|
filteredRoutes = filteredRoutes.filter((it) => {
|
|
142
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
|
|
142
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
|
|
143
143
|
if (activeOptions && activeOptions.length)
|
|
144
144
|
for (let f of activeOptions) {
|
|
145
145
|
if (f.active) {
|
|
@@ -316,6 +316,18 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
316
316
|
}
|
|
317
317
|
}
|
|
318
318
|
}
|
|
319
|
+
else if (f.value.toLowerCase().indexOf("express") > -1) {
|
|
320
|
+
// for (let bt of it.fare_str.split(",")) {
|
|
321
|
+
// if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
|
|
322
|
+
// return true;
|
|
323
|
+
// }
|
|
324
|
+
// }
|
|
325
|
+
for (let bt of it.seat_types) {
|
|
326
|
+
if (((_u = bt === null || bt === void 0 ? void 0 : bt.label) === null || _u === void 0 ? void 0 : _u.toLowerCase().indexOf("express")) > -1) {
|
|
327
|
+
return true;
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
}
|
|
319
331
|
else if (f.value.toLowerCase() == "cama") {
|
|
320
332
|
// for (let bt of it.fare_str.split(",")) {
|
|
321
333
|
// if (bt.toLowerCase().split(":")[0] == "cama") {
|
|
@@ -323,7 +335,7 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
323
335
|
// }
|
|
324
336
|
// }
|
|
325
337
|
for (let bt of it.seat_types) {
|
|
326
|
-
if (((
|
|
338
|
+
if (((_v = bt === null || bt === void 0 ? void 0 : bt.label) === null || _v === void 0 ? void 0 : _v.toLowerCase().indexOf("cama")) > -1) {
|
|
327
339
|
return true;
|
|
328
340
|
}
|
|
329
341
|
}
|
|
@@ -335,7 +347,7 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
335
347
|
// }
|
|
336
348
|
// }
|
|
337
349
|
for (let bt of it.seat_types) {
|
|
338
|
-
if (((
|
|
350
|
+
if (((_w = bt === null || bt === void 0 ? void 0 : bt.label) === null || _w === void 0 ? void 0 : _w.toLowerCase().indexOf("preferente")) > -1) {
|
|
339
351
|
return true;
|
|
340
352
|
}
|
|
341
353
|
}
|
|
@@ -347,7 +359,7 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
347
359
|
// }
|
|
348
360
|
// }
|
|
349
361
|
for (let bt of it.seat_types) {
|
|
350
|
-
if (((
|
|
362
|
+
if (((_x = bt === null || bt === void 0 ? void 0 : bt.label) === null || _x === void 0 ? void 0 : _x.toLowerCase().indexOf("vent")) > -1) {
|
|
351
363
|
return true;
|
|
352
364
|
}
|
|
353
365
|
}
|
|
@@ -361,28 +373,28 @@ const FilterBarDesktop = ({ t, serviceList, setServiceList, allSchedules, showRe
|
|
|
361
373
|
// }
|
|
362
374
|
// }
|
|
363
375
|
for (let bt of it.seat_types) {
|
|
364
|
-
if (((
|
|
376
|
+
if (((_y = bt === null || bt === void 0 ? void 0 : bt.label) === null || _y === void 0 ? void 0 : _y.toLowerCase().indexOf("clasico")) > -1) {
|
|
365
377
|
return true;
|
|
366
378
|
}
|
|
367
379
|
}
|
|
368
380
|
}
|
|
369
381
|
else if (f.value.toLowerCase().indexOf("killa plus") > -1) {
|
|
370
382
|
for (let bt of it.seat_types) {
|
|
371
|
-
if (((
|
|
383
|
+
if (((_z = bt === null || bt === void 0 ? void 0 : bt.label) === null || _z === void 0 ? void 0 : _z.toLowerCase().indexOf("killa plus")) > -1) {
|
|
372
384
|
return true;
|
|
373
385
|
}
|
|
374
386
|
}
|
|
375
387
|
}
|
|
376
388
|
else if (f.value.toLowerCase().indexOf("inka plus") > -1) {
|
|
377
389
|
for (let bt of it.seat_types) {
|
|
378
|
-
if (((
|
|
390
|
+
if (((_0 = bt === null || bt === void 0 ? void 0 : bt.label) === null || _0 === void 0 ? void 0 : _0.toLowerCase().indexOf("inka plus")) > -1) {
|
|
379
391
|
return true;
|
|
380
392
|
}
|
|
381
393
|
}
|
|
382
394
|
}
|
|
383
395
|
else if (f.value.toLowerCase().indexOf("emperador") > -1) {
|
|
384
396
|
for (let bt of it.seat_types) {
|
|
385
|
-
if (((
|
|
397
|
+
if (((_1 = bt === null || bt === void 0 ? void 0 : bt.label) === null || _1 === void 0 ? void 0 : _1.toLowerCase().indexOf("emperador")) > -1) {
|
|
386
398
|
return true;
|
|
387
399
|
}
|
|
388
400
|
}
|
|
@@ -15,14 +15,14 @@ class ServiceFilter extends React.Component {
|
|
|
15
15
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
16
16
|
super(props);
|
|
17
17
|
this.state = {
|
|
18
|
-
showOperators: ((_a = props.initialOpenFilters) === null || _a === void 0 ? void 0 : _a.includes("operator")) ||
|
|
19
|
-
showTimeOptions: ((_b = props.initialOpenFilters) === null || _b === void 0 ? void 0 : _b.includes("time")) ||
|
|
20
|
-
showSeatOptions: ((_c = props.initialOpenFilters) === null || _c === void 0 ? void 0 : _c.includes("seat_types")) ||
|
|
21
|
-
showTypeOptions: ((_d = props.initialOpenFilters) === null || _d === void 0 ? void 0 : _d.includes("tipo")) ||
|
|
22
|
-
showSpecialDeparture: ((_e = props.initialOpenFilters) === null || _e === void 0 ? void 0 : _e.includes("special_departure")) ||
|
|
23
|
-
showTrainType: ((_f = props.initialOpenFilters) === null || _f === void 0 ? void 0 : _f.includes("train_type")) ||
|
|
18
|
+
showOperators: ((_a = props.initialOpenFilters) === null || _a === void 0 ? void 0 : _a.includes("operator")) || true,
|
|
19
|
+
showTimeOptions: ((_b = props.initialOpenFilters) === null || _b === void 0 ? void 0 : _b.includes("time")) || true,
|
|
20
|
+
showSeatOptions: ((_c = props.initialOpenFilters) === null || _c === void 0 ? void 0 : _c.includes("seat_types")) || true,
|
|
21
|
+
showTypeOptions: ((_d = props.initialOpenFilters) === null || _d === void 0 ? void 0 : _d.includes("tipo")) || true,
|
|
22
|
+
showSpecialDeparture: ((_e = props.initialOpenFilters) === null || _e === void 0 ? void 0 : _e.includes("special_departure")) || true,
|
|
23
|
+
showTrainType: ((_f = props.initialOpenFilters) === null || _f === void 0 ? void 0 : _f.includes("train_type")) || true,
|
|
24
24
|
addMargin: false,
|
|
25
|
-
showAmenities: ((_g = props.initialOpenFilters) === null || _g === void 0 ? void 0 : _g.includes("amenities")) ||
|
|
25
|
+
showAmenities: ((_g = props.initialOpenFilters) === null || _g === void 0 ? void 0 : _g.includes("amenities")) || true,
|
|
26
26
|
sortedFilters: this.sortFilters(props.filtersArray),
|
|
27
27
|
};
|
|
28
28
|
this.handleScroll = this.handleScroll.bind(this);
|
|
@@ -211,7 +211,7 @@ class ServiceFilter extends React.Component {
|
|
|
211
211
|
color: val.active ? this.props.colors.selectedTextColor : "",
|
|
212
212
|
}, className: `flex items-center h-[24px] rounded-[15px] cursor-pointer pt-[4px] ${val.active ? "bold-text" : ""}` },
|
|
213
213
|
val.icon && this.props.icons && (React.createElement("img", { src: iconKey, alt: val.icon, className: "w-[20px] h-[20px] mr-[10px]" })),
|
|
214
|
-
label));
|
|
214
|
+
label.charAt(0).toUpperCase() + label.slice(1).toLowerCase()));
|
|
215
215
|
})));
|
|
216
216
|
}
|
|
217
217
|
render() {
|
|
@@ -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
|
@@ -367,6 +367,18 @@ const FilterBarDesktop = ({
|
|
|
367
367
|
return true;
|
|
368
368
|
}
|
|
369
369
|
}
|
|
370
|
+
} else if (f.value.toLowerCase().indexOf("express") > -1) {
|
|
371
|
+
// for (let bt of it.fare_str.split(",")) {
|
|
372
|
+
// if (bt.toLowerCase().split(":")[0].indexOf("vip") > -1) {
|
|
373
|
+
// return true;
|
|
374
|
+
// }
|
|
375
|
+
// }
|
|
376
|
+
|
|
377
|
+
for (let bt of it.seat_types) {
|
|
378
|
+
if (bt?.label?.toLowerCase().indexOf("express") > -1) {
|
|
379
|
+
return true;
|
|
380
|
+
}
|
|
381
|
+
}
|
|
370
382
|
} else if (f.value.toLowerCase() == "cama") {
|
|
371
383
|
// for (let bt of it.fare_str.split(",")) {
|
|
372
384
|
// if (bt.toLowerCase().split(":")[0] == "cama") {
|
|
@@ -34,16 +34,15 @@ class ServiceFilter extends React.Component<
|
|
|
34
34
|
super(props);
|
|
35
35
|
|
|
36
36
|
this.state = {
|
|
37
|
-
showOperators: props.initialOpenFilters?.includes("operator") ||
|
|
38
|
-
showTimeOptions: props.initialOpenFilters?.includes("time") ||
|
|
39
|
-
showSeatOptions:
|
|
40
|
-
|
|
41
|
-
showTypeOptions: props.initialOpenFilters?.includes("tipo") || false,
|
|
37
|
+
showOperators: props.initialOpenFilters?.includes("operator") || true,
|
|
38
|
+
showTimeOptions: props.initialOpenFilters?.includes("time") || true,
|
|
39
|
+
showSeatOptions: props.initialOpenFilters?.includes("seat_types") || true,
|
|
40
|
+
showTypeOptions: props.initialOpenFilters?.includes("tipo") || true,
|
|
42
41
|
showSpecialDeparture:
|
|
43
|
-
props.initialOpenFilters?.includes("special_departure") ||
|
|
44
|
-
showTrainType: props.initialOpenFilters?.includes("train_type") ||
|
|
42
|
+
props.initialOpenFilters?.includes("special_departure") || true,
|
|
43
|
+
showTrainType: props.initialOpenFilters?.includes("train_type") || true,
|
|
45
44
|
addMargin: false,
|
|
46
|
-
showAmenities: props.initialOpenFilters?.includes("amenities") ||
|
|
45
|
+
showAmenities: props.initialOpenFilters?.includes("amenities") || true,
|
|
47
46
|
sortedFilters: this.sortFilters(props.filtersArray),
|
|
48
47
|
};
|
|
49
48
|
|
|
@@ -294,7 +293,9 @@ class ServiceFilter extends React.Component<
|
|
|
294
293
|
className="w-[20px] h-[20px] mr-[10px]"
|
|
295
294
|
/>
|
|
296
295
|
)}
|
|
297
|
-
{label}
|
|
296
|
+
{/* {commonService.capitalize(label)} */}
|
|
297
|
+
|
|
298
|
+
{label.charAt(0).toUpperCase() + label.slice(1).toLowerCase()}
|
|
298
299
|
</div>
|
|
299
300
|
);
|
|
300
301
|
})}
|
|
@@ -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>
|