kupos-ui-components-lib 9.6.10 → 9.7.1
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/KuposUIComponent.d.ts +3 -0
- package/dist/components/ServiceItem/PeruServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/PeruServiceItemDesktop.js +133 -189
- package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +12 -3
- package/dist/components/ServiceItem/ServiceItemMobile.js +1 -1
- package/dist/components/ServiceItem/mobileTypes.d.ts +1 -0
- package/dist/components/ServiceItem/types.d.ts +12 -0
- package/dist/styles.css +165 -0
- package/dist/types.d.ts +1 -0
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.d.ts +2 -1
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +6 -4
- package/dist/ui/FeatureServiceUI/FeatureServiceUi.d.ts +7 -1
- package/dist/ui/FeatureServiceUI/FeatureServiceUi.js +55 -24
- package/dist/ui/mobileweb/ExpandedDropdownMobile.d.ts +2 -1
- package/dist/ui/mobileweb/ExpandedDropdownMobile.js +6 -3
- package/dist/utils/CommonService.js +11 -1
- package/package.json +1 -1
- package/src/KuposUIComponent.tsx +3 -0
- package/src/assets/images/anims/service_list/thunder_icon.json +1 -0
- package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +255 -322
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +38 -5
- package/src/components/ServiceItem/ServiceItemMobile.tsx +1 -0
- package/src/components/ServiceItem/mobileTypes.ts +1 -0
- package/src/components/ServiceItem/types.ts +13 -0
- package/src/types.ts +1 -0
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +12 -3
- package/src/ui/FeatureServiceUI/FeatureServiceUi.tsx +622 -0
- package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +13 -2
- package/src/utils/CommonService.ts +13 -1
|
@@ -15,6 +15,9 @@ interface KuposUIComponentProps {
|
|
|
15
15
|
orignLabel?: string;
|
|
16
16
|
destinationLabel?: string;
|
|
17
17
|
t?: (key: string) => string;
|
|
18
|
+
ticketQuantity?: number;
|
|
19
|
+
onIncreaseTicketQuantity?: (serviceItem: any) => void;
|
|
20
|
+
onDecreaseTicketQuantity?: (serviceItem: any) => void;
|
|
18
21
|
id?: string;
|
|
19
22
|
name?: string;
|
|
20
23
|
description?: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ServiceItemProps } from "./types";
|
|
3
|
-
declare function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus,
|
|
3
|
+
declare function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus, t, }: ServiceItemProps & {
|
|
4
4
|
currencySign?: string;
|
|
5
5
|
}): React.ReactElement;
|
|
6
6
|
export default PeruServiceItemDesktop;
|
|
@@ -14,65 +14,73 @@ import pullmanFlexibleAnimation from "../../assets/images/anims/service_list/pul
|
|
|
14
14
|
import pullmanPetFriendlyAnimation from "../../assets/images/anims/service_list/pullmanPetFriendly.json";
|
|
15
15
|
import pullmanLocationAnimation from "../../assets/images/anims/service_list/pullmanLocation.json";
|
|
16
16
|
import pullmanPriorityStageAnimation from "../../assets/images/anims/service_list/pullmanPriorityStage.json";
|
|
17
|
+
import pullmanPromoAnimation from "../../assets/images/anims/service_list/promocion.json";
|
|
18
|
+
import pullmanDirectoAnimation from "../../assets/images/anims/service_list/directo.json";
|
|
17
19
|
import opsitesFlexibleAnimation from "../../assets/images/anims/service_list/opsitesFlexible.json";
|
|
18
20
|
import opsitesPetFriendlyAnimation from "../../assets/images/anims/service_list/opsitesPetFriendly.json";
|
|
19
21
|
import opsitesLocationAnimation from "../../assets/images/anims/service_list/opsitesLocation.json";
|
|
20
22
|
import opsitesPriorityStageAnimation from "../../assets/images/anims/service_list/opsitesPriorityStage.json";
|
|
21
|
-
import
|
|
22
|
-
import
|
|
23
|
+
import opsitesPromoAnimation from "../../assets/images/anims/service_list/promocion.json";
|
|
24
|
+
import opsitesDirectoAnimation from "../../assets/images/anims/service_list/directo.json";
|
|
25
|
+
import linatalFlexibleAnimation from "../../assets/images/anims/service_list/flexible.json";
|
|
26
|
+
import linatalPromoAnimation from "../../assets/images/anims/service_list/promocion.json";
|
|
27
|
+
import linatalDirectoAnimation from "../../assets/images/anims/service_list/directo.json";
|
|
28
|
+
import linatalPriorityStageAnimation from "../../assets/images/anims/service_list/priority_stage.json";
|
|
29
|
+
import linatalPetFriendlyAnimation from "../../assets/images/anims/service_list/pet_friendly.json";
|
|
30
|
+
import linatalLocationAnimation from "../../assets/images/anims/service_list/location.json";
|
|
23
31
|
import StageTooltip from "../../ui/StagesTooltip";
|
|
24
32
|
import RatingBlock from "../../ui/RatingBlock";
|
|
25
33
|
import DurationBlock from "../../ui/DurationBlock";
|
|
26
34
|
import PetBlock from "../../ui/PetBlock";
|
|
27
35
|
import FlexibleBlock from "../../ui/FlexibleBlock";
|
|
28
36
|
import AmenitiesBlock from "../../ui/AmenitiesBlock";
|
|
29
|
-
import SeatSection from "../../ui/SeatSection/SeatSection";
|
|
30
|
-
import KuposButton from "../../ui/KuposButton/KuposButton";
|
|
31
|
-
import BottomAmenities from "../../ui/BottomAmenities/BottomAmenities";
|
|
32
37
|
const SEAT_EXCEPTIONS = ["Asiento mascota"];
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
38
|
+
function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isSeatIcon, showAvailableSeats, isPeru, siteType, isAllinBus, t = (key) => key, }) {
|
|
39
|
+
var _a, _b, _c, _d;
|
|
40
|
+
const animationMap = {
|
|
41
|
+
promoAnim: {
|
|
42
|
+
kupos: promoAnimation,
|
|
43
|
+
pullman: pullmanPromoAnimation,
|
|
44
|
+
opsites: opsitesPromoAnimation,
|
|
45
|
+
linatal: linatalPromoAnimation,
|
|
46
|
+
},
|
|
47
|
+
locationAnim: {
|
|
48
|
+
kupos: locationAnimation,
|
|
49
|
+
pullman: pullmanLocationAnimation,
|
|
50
|
+
opsites: opsitesLocationAnimation,
|
|
51
|
+
linatal: linatalLocationAnimation,
|
|
52
|
+
},
|
|
53
|
+
directoAnim: {
|
|
54
|
+
kupos: directoAnimation,
|
|
55
|
+
pullman: pullmanDirectoAnimation,
|
|
56
|
+
opsites: opsitesDirectoAnimation,
|
|
57
|
+
linatal: linatalDirectoAnimation,
|
|
58
|
+
},
|
|
59
|
+
petFriendlyAnim: {
|
|
60
|
+
kupos: petFriendlyAnimation,
|
|
61
|
+
pullman: pullmanPetFriendlyAnimation,
|
|
62
|
+
opsites: opsitesPetFriendlyAnimation,
|
|
63
|
+
linatal: linatalPetFriendlyAnimation,
|
|
64
|
+
},
|
|
65
|
+
priorityStageAnim: {
|
|
66
|
+
kupos: priorityStageAnimation,
|
|
67
|
+
pullman: pullmanPriorityStageAnimation,
|
|
68
|
+
opsites: opsitesPriorityStageAnimation,
|
|
69
|
+
linatal: linatalPriorityStageAnimation,
|
|
70
|
+
},
|
|
71
|
+
flexibleIcon: {
|
|
72
|
+
kupos: flexibleAnimation,
|
|
73
|
+
pullman: pullmanFlexibleAnimation,
|
|
74
|
+
opsites: opsitesFlexibleAnimation,
|
|
75
|
+
linatal: linatalFlexibleAnimation,
|
|
76
|
+
},
|
|
77
|
+
};
|
|
70
78
|
const getAnimationIcon = (icon) => {
|
|
71
|
-
|
|
72
|
-
const animation = ANIMATION_MAP[icon];
|
|
79
|
+
const animation = animationMap[icon];
|
|
73
80
|
if (!animation)
|
|
74
81
|
return null;
|
|
75
|
-
|
|
82
|
+
const currentSiteType = siteType || "kupos";
|
|
83
|
+
return animation[currentSiteType];
|
|
76
84
|
};
|
|
77
85
|
const SvgAmenities = ({ moreAnemities, name, color, }) => {
|
|
78
86
|
var _a;
|
|
@@ -216,7 +224,6 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
216
224
|
};
|
|
217
225
|
const checkMidnight = () => {
|
|
218
226
|
var _a, _b;
|
|
219
|
-
setIsExpand === null || setIsExpand === void 0 ? void 0 : setIsExpand(null);
|
|
220
227
|
if ((cityOrigin === null || cityOrigin === void 0 ? void 0 : cityOrigin.label) &&
|
|
221
228
|
(cityDestination === null || cityDestination === void 0 ? void 0 : cityDestination.label) &&
|
|
222
229
|
((cityOrigin.label.toLowerCase().includes("argentina") &&
|
|
@@ -305,55 +312,18 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
305
312
|
const dropoffName = ((_b = serviceItem.stage_details_arr) === null || _b === void 0 ? void 0 : _b.length)
|
|
306
313
|
? extractStage(serviceItem.stage_details_arr, 1)
|
|
307
314
|
: null;
|
|
308
|
-
const countdownSeconds = 599;
|
|
309
|
-
const startCountdown = (node) => {
|
|
310
|
-
if (!node)
|
|
311
|
-
return;
|
|
312
|
-
const prevId = node.dataset.countdownId;
|
|
313
|
-
if (prevId)
|
|
314
|
-
clearInterval(Number(prevId));
|
|
315
|
-
let remaining = countdownSeconds;
|
|
316
|
-
const formatTime = (totalSecs) => {
|
|
317
|
-
const m = Math.floor(totalSecs / 60);
|
|
318
|
-
const s = totalSecs % 60;
|
|
319
|
-
return `${String(m).padStart(2, "0")}:${String(s).padStart(2, "0")}`;
|
|
320
|
-
};
|
|
321
|
-
node.textContent = formatTime(remaining);
|
|
322
|
-
const id = setInterval(() => {
|
|
323
|
-
remaining -= 1;
|
|
324
|
-
if (remaining <= 0) {
|
|
325
|
-
remaining = countdownSeconds;
|
|
326
|
-
}
|
|
327
|
-
node.textContent = formatTime(remaining);
|
|
328
|
-
}, 1000);
|
|
329
|
-
node.dataset.countdownId = String(id);
|
|
330
|
-
};
|
|
331
315
|
const items = [
|
|
332
316
|
{
|
|
333
|
-
key: "
|
|
334
|
-
width: "
|
|
335
|
-
|
|
336
|
-
render: (React.createElement(AmenitiesBlock, { serviceItem: serviceItem, metaData: metaData, isSoldOut: isSoldOut, colors: colors, getAnimationIcon: getAnimationIcon, getAmenityName: CommonService.getAmenityName, SvgAmenities: SvgAmenities, isPeru: isPeru })),
|
|
317
|
+
key: "rating",
|
|
318
|
+
width: "30%",
|
|
319
|
+
render: (React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru })),
|
|
337
320
|
},
|
|
338
321
|
{
|
|
339
322
|
key: "duration",
|
|
340
|
-
width: "
|
|
323
|
+
width: "20%",
|
|
341
324
|
condition: serviceItem.duration,
|
|
342
325
|
render: (React.createElement(DurationBlock, { serviceItem: serviceItem, translation: translation, renderIcon: renderIcon, isSoldOut: isSoldOut, colors: colors })),
|
|
343
326
|
},
|
|
344
|
-
// {
|
|
345
|
-
// key: "directo",
|
|
346
|
-
// width: "12%",
|
|
347
|
-
// condition: serviceItem?.is_direct_trip === true,
|
|
348
|
-
// render: (
|
|
349
|
-
// <DirectoBlock
|
|
350
|
-
// translation={translation}
|
|
351
|
-
// getAnimationIcon={getAnimationIcon}
|
|
352
|
-
// colors={colors}
|
|
353
|
-
// isSoldOut={isSoldOut}
|
|
354
|
-
// />
|
|
355
|
-
// ),
|
|
356
|
-
// },
|
|
357
327
|
{
|
|
358
328
|
key: "pet",
|
|
359
329
|
width: "20%",
|
|
@@ -364,82 +334,48 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
364
334
|
{
|
|
365
335
|
key: "flexible",
|
|
366
336
|
width: "20%",
|
|
367
|
-
condition:
|
|
337
|
+
condition: false,
|
|
368
338
|
render: (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
369
339
|
},
|
|
340
|
+
{
|
|
341
|
+
key: "amenities",
|
|
342
|
+
width: "20%",
|
|
343
|
+
render: (React.createElement(AmenitiesBlock, { serviceItem: serviceItem, metaData: metaData, isSoldOut: isSoldOut, colors: colors, isPeru: isPeru, getAnimationIcon: getAnimationIcon, getAmenityName: CommonService.getAmenityName, SvgAmenities: SvgAmenities })),
|
|
344
|
+
},
|
|
370
345
|
];
|
|
371
|
-
const
|
|
372
|
-
const
|
|
373
|
-
|
|
374
|
-
const hasOfferText = Boolean(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text);
|
|
375
|
-
const offerGradient = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"} 0%, ${colors.leftGradiantColor || "#ff8842"} 100%)`;
|
|
376
|
-
const offerGradientWithOpacity = `linear-gradient(90deg, ${colors.rightGradiantColor || "#ff5964"}80 0%, ${colors.leftGradiantColor || "#ff8842"}80 100%)`;
|
|
377
|
-
const serviceCardStyle = hasOfferText
|
|
378
|
-
? {
|
|
379
|
-
borderColor: "transparent",
|
|
380
|
-
borderStyle: "solid",
|
|
381
|
-
borderWidth: "3px 3px 0 3px",
|
|
382
|
-
borderRadius: isItemExpanded || coachKey ? "18px 18px 0 0" : "18px",
|
|
383
|
-
background: `linear-gradient(#fff, #fff) padding-box, ${isSoldOut ? offerGradientWithOpacity : offerGradient} border-box`,
|
|
384
|
-
// zIndex: 1,
|
|
385
|
-
}
|
|
386
|
-
: {};
|
|
387
|
-
const seats = removeDuplicateSeats
|
|
388
|
-
? ((_c = serviceItem.seat_types) === null || _c === void 0 ? void 0 : _c.filter((seat, index, self) => index === self.findIndex((s) => s.label === seat.label))) || []
|
|
389
|
-
: serviceItem.seat_types || [];
|
|
390
|
-
const discountedSeats = seats.map((seat) => (Object.assign(Object.assign({}, seat), CommonService.calculateDiscountedPrice(seat.fare, serviceItem))));
|
|
391
|
-
const hasDiscount = discountedSeats.some((seat) => seat.originalPrice !== seat.discountedPrice);
|
|
392
|
-
return (React.createElement("div", { className: `relative hover:z-[150] ${hasOfferText ? "mb-[55px]" : "mb-[10px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
|
|
346
|
+
const amenitiesItem = items.find((i) => i.key === "amenities");
|
|
347
|
+
const otherItems = items.filter((i) => i.key !== "amenities" && i.condition !== false);
|
|
348
|
+
return (React.createElement("div", { className: `relative ${serviceItem.offer_text ? "mb-[55px]" : "mb-[10px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
|
|
393
349
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
|
|
394
350
|
showTopLabel
|
|
395
351
|
? "mt-[24px]"
|
|
396
352
|
: "mt-[20px]"} ` },
|
|
397
|
-
React.createElement("div", {
|
|
398
|
-
|
|
399
|
-
: "
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
:
|
|
404
|
-
? "20px 15px 20px 15px"
|
|
405
|
-
: "20px 15px 10px 15px",
|
|
406
|
-
marginTop: hasDiscount || hasOfferText ? "14px" : "",
|
|
407
|
-
} },
|
|
408
|
-
React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:14%_40%_0.5%_24%_13.5%] gap-x-[2%] items-center",
|
|
409
|
-
// style={{ marginTop: showTopLabel ? "8px" : "" }}
|
|
410
|
-
style: {
|
|
411
|
-
marginTop: showTopLabel || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ? "8px" : "",
|
|
412
|
-
} },
|
|
413
|
-
React.createElement("div", { style: {
|
|
414
|
-
display: "flex",
|
|
415
|
-
flexDirection: "column",
|
|
416
|
-
// gap: "5px",
|
|
417
|
-
} },
|
|
418
|
-
React.createElement("div", {
|
|
419
|
-
// className="flex items-center justify-center m-[auto]"
|
|
420
|
-
className: "" },
|
|
421
|
-
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `h-[30px] w-[auto] ${isSoldOut ? "grayscale" : ""}` }),
|
|
422
|
-
isCiva ? (React.createElement("div", { className: "text-[13.33px] black-text ml-2" }, serviceItem.operator_details[2])) : null),
|
|
423
|
-
React.createElement(RatingBlock, { showRating: showRating, serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation, isPeru: isPeru })),
|
|
353
|
+
React.createElement("div", { className: "bg-white rounded-[20px] shadow-service mx-auto relative" },
|
|
354
|
+
React.createElement("div", { className: "p-[15px] pt-[20px]" },
|
|
355
|
+
React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:14%_40%_0.5%_24%_13.5%] gap-x-[2%] items-center", style: { marginTop: showTopLabel ? "8px" : "" } },
|
|
356
|
+
React.createElement("div", { className: "flex items-center justify-center m-[auto]" },
|
|
357
|
+
React.createElement("div", { className: " " },
|
|
358
|
+
React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: ` h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
|
|
359
|
+
isCiva ? (React.createElement("div", { className: "text-[13.33px] black-text ml-2" }, serviceItem.operator_details[2])) : null),
|
|
424
360
|
React.createElement("div", { className: `min-h-[2.5rem] grid grid-cols-[0.8fr_auto_26%_1fr] gap-x-4 items-center text-[13.33px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: {
|
|
425
361
|
gridTemplateRows: "1fr",
|
|
426
362
|
} },
|
|
427
|
-
React.createElement("div", { className: "flex flex-col gap-[
|
|
363
|
+
React.createElement("div", { className: "flex flex-col gap-[10px]" },
|
|
428
364
|
orignLabel ? (React.createElement("div", { className: "w-[60px] h-[20px] flex items-center bold-text" }, orignLabel)) : (React.createElement("div", { className: "h-[20px] flex items-center" },
|
|
429
|
-
React.createElement("img", { src: (
|
|
365
|
+
React.createElement("img", { src: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.origin, alt: "origin", className: `w-[18px] h-auto mr-[8px] ${isSoldOut ? "grayscale" : ""}` }))),
|
|
430
366
|
!isCiva &&
|
|
431
367
|
(destinationLabel ? (React.createElement("div", { className: "w-[60px] h-[20px] flex items-center bold-text" }, destinationLabel)) : (React.createElement("div", { className: "h-[20px] flex items-center" },
|
|
432
|
-
React.createElement("img", { src: (
|
|
433
|
-
React.createElement("div", { className: "flex flex-col gap-[
|
|
368
|
+
React.createElement("img", { src: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.destination, className: `w-[18px] h-auto mr-[8px] ${isSoldOut ? "grayscale" : ""}`, style: { opacity: isSoldOut ? 0.5 : 1 } }))))),
|
|
369
|
+
React.createElement("div", { className: "flex flex-col gap-[10px]" },
|
|
434
370
|
React.createElement(StageTooltip, { stageData: serviceItem.boarding_stages, direction: 1, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
|
|
435
371
|
React.createElement("span", { className: "cursor-pointer bold-text capitalize" }, DateService.getServiceItemDate(serviceItem.travel_date))),
|
|
436
372
|
!isCiva && (React.createElement(StageTooltip, { stageData: serviceItem.dropoff_stages, direction: 2, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
|
|
437
373
|
React.createElement("span", { className: "cursor-pointer bold-text capitalize" }, DateService.getServiceItemDate(serviceItem.arrival_date))))),
|
|
438
|
-
React.createElement("div", { className: "flex flex-col gap-[
|
|
374
|
+
React.createElement("div", { className: "flex flex-col gap-[10px] items-center" },
|
|
439
375
|
React.createElement("div", { className: "h-[20px] flex items-center justify-center" },
|
|
440
376
|
React.createElement("div", null, "\u2022")),
|
|
441
377
|
!isCiva && (React.createElement("div", { className: "h-[20px] flex items-center justify-center" }, removeArrivalTime ? null : serviceItem.arr_time ? (React.createElement("div", null, "\u2022")) : null))),
|
|
442
|
-
React.createElement("div", { className: "flex flex-col gap-[
|
|
378
|
+
React.createElement("div", { className: "flex flex-col gap-[10px]" },
|
|
443
379
|
React.createElement(StageTooltip, { stageData: serviceItem.boarding_stages, direction: 1, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
|
|
444
380
|
React.createElement("div", { className: "font-[900] bold-text" }, DateService.formatTime(serviceItem.dep_time))),
|
|
445
381
|
!isCiva && (React.createElement(StageTooltip, { stageData: serviceItem.dropoff_stages, direction: 2, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
|
|
@@ -455,55 +391,63 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
455
391
|
margin: "auto",
|
|
456
392
|
} }),
|
|
457
393
|
React.createElement("div", { className: "content-center" },
|
|
458
|
-
React.createElement(
|
|
394
|
+
React.createElement("div", { className: `relative flex gap-[10px] text-[13.33px] justify-between min-h-[2.5rem] ${getNumberOfSeats() < 3 ? "" : ""}`, style: getNumberOfSeats() < 2
|
|
395
|
+
? { alignItems: "center" }
|
|
396
|
+
: { alignItems: "center" } },
|
|
397
|
+
React.createElement("div", { className: "flex flex-col justify-between" }, getSeatNames()),
|
|
398
|
+
React.createElement("div", { className: "flex flex-col justify-between absolute inset-y-0 right-0 left-1/2 h-full", style: {
|
|
399
|
+
color: isSoldOut ? "#c0c0c0" : colors.priceColor,
|
|
400
|
+
top: 0,
|
|
401
|
+
bottom: 0,
|
|
402
|
+
left: "68%",
|
|
403
|
+
right: 0,
|
|
404
|
+
justifyContent: getNumberOfSeats() < 2 ? "center" : "center",
|
|
405
|
+
gap: "5px",
|
|
406
|
+
} },
|
|
407
|
+
React.createElement("span", { style: {
|
|
408
|
+
position: "absolute",
|
|
409
|
+
top: getNumberOfSeats() > 1 ? -10 : -5,
|
|
410
|
+
fontWeight: "initial",
|
|
411
|
+
fontSize: "12px",
|
|
412
|
+
left: 0,
|
|
413
|
+
color: "#6a6a6a",
|
|
414
|
+
} }, "Desde"),
|
|
415
|
+
getSeatPrice()))),
|
|
459
416
|
React.createElement("div", null,
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
417
|
+
React.createElement("button", { onClick: () => (!isSoldOut ? checkMidnight() : null), disabled: serviceDetailsLoading, className: `w-full ${serviceDetailsLoading || isSoldOut ? "py-[12px]" : "py-[12px]"} text-[13.33px] font-bold text-white rounded-[10px] border-none px-[20px] flex items-center justify-center`, style: {
|
|
418
|
+
backgroundColor: serviceDetailsLoading || isSoldOut
|
|
419
|
+
? "lightgray"
|
|
420
|
+
: colors.kuposButtonColor,
|
|
421
|
+
cursor: serviceDetailsLoading || isSoldOut
|
|
422
|
+
? "not-allowed"
|
|
423
|
+
: "pointer",
|
|
424
|
+
} },
|
|
425
|
+
React.createElement("span", { className: "min-w-[75px] flex justify-center items-center bold-text uppercase" },
|
|
426
|
+
isSoldOut ? renderIcon("soldOutIcon", "14px") : null,
|
|
427
|
+
serviceDetailsLoading ? (React.createElement("span", { className: "loader-circle" })) : !isSoldOut ? (translation === null || translation === void 0 ? void 0 : translation.buyButton) : (translation === null || translation === void 0 ? void 0 : translation.soldOutButton))))),
|
|
428
|
+
showLastSeats ? (React.createElement("div", { className: "flex justify-end mr-[11px]" }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
|
|
429
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[12px] text-[red] mt-1 text-center" }, "\u00A1 \u00DAltimos Asientos!")))) : null,
|
|
430
|
+
React.createElement("div", { className: "flex items-center mt-[15px] border-t border-[#eee] pt-[10px]" },
|
|
431
|
+
React.createElement("div", { className: "grid items-center gap-[2%] flex-1", style: {
|
|
432
|
+
gridTemplateColumns: "30% 18% 23% 23%",
|
|
433
|
+
// otherItems
|
|
434
|
+
// .map((i) => i.width)
|
|
435
|
+
// .join(" "),
|
|
436
|
+
} }, otherItems.map((item) => (React.createElement("div", { key: item.key, className: "flex items-center " }, item.render)))),
|
|
437
|
+
React.createElement("div", { className: "flex items-center ml-[12px] shrink-0 w-[130px] justify-end" }, amenitiesItem === null || amenitiesItem === void 0 ? void 0 : amenitiesItem.render)))),
|
|
468
438
|
children,
|
|
469
|
-
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && (React.createElement("div", { className:
|
|
470
|
-
|
|
439
|
+
(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: {
|
|
440
|
+
backgroundColor: isSoldOut
|
|
441
|
+
? colors === null || colors === void 0 ? void 0 : colors.bottomStripColor
|
|
442
|
+
: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor,
|
|
471
443
|
opacity: isSoldOut ? 0.5 : 1,
|
|
472
444
|
} },
|
|
473
|
-
React.createElement(
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 30
|
|
480
|
-
? ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").slice(0, 30) + "..."
|
|
481
|
-
: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "",
|
|
482
|
-
" ",
|
|
483
|
-
isLoggedIn ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
|
|
484
|
-
" ",
|
|
485
|
-
"\u00A0"),
|
|
486
|
-
" ",
|
|
487
|
-
"| Termina en\u00A0",
|
|
488
|
-
React.createElement("span", { className: "bold-text text-end", ref: (node) => CommonService.startCountdown(node, 599), style: {
|
|
489
|
-
fontVariantNumeric: "tabular-nums",
|
|
490
|
-
display: "inline-block",
|
|
491
|
-
} })))),
|
|
492
|
-
React.createElement("div", { className: "flex items-center" },
|
|
493
|
-
React.createElement(LottiePlayer, { animationData: getAnimationIcon("dotAnimation"), width: "12px", height: "12px" }),
|
|
494
|
-
React.createElement("span", { className: "ml-[6px]" },
|
|
495
|
-
React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startViewerCount(node, viewersConfig), style: { fontVariantNumeric: "tabular-nums" } }),
|
|
496
|
-
" ",
|
|
497
|
-
React.createElement("span", null,
|
|
498
|
-
" ",
|
|
499
|
-
(viewersConfig === null || viewersConfig === void 0 ? void 0 : viewersConfig.label) || " viendo",
|
|
500
|
-
" |",
|
|
501
|
-
" ",
|
|
502
|
-
React.createElement("span", { className: "" },
|
|
503
|
-
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) ? null : "Quedan pocos • ",
|
|
504
|
-
React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
|
|
505
|
-
" ",
|
|
506
|
-
"comprando"))))))),
|
|
445
|
+
React.createElement(LottiePlayer
|
|
446
|
+
// animationData={serviceItem.icons.promoAnim}
|
|
447
|
+
, {
|
|
448
|
+
// animationData={serviceItem.icons.promoAnim}
|
|
449
|
+
animationData: getAnimationIcon("promoAnim"), width: "18px", height: "18px" }),
|
|
450
|
+
React.createElement("span", { className: "ml-[10px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text))),
|
|
507
451
|
React.createElement("div", { className: "absolute -top-[11px] left-0 w-full flex items-center justify-end gap-[12px] pr-[15px] z-10 " },
|
|
508
452
|
showTopLabel && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] px-[14px] rounded-[38px] text-[12.5px] z-20`, style: {
|
|
509
453
|
backgroundColor: isSoldOut ? "#ddd" : colors.ratingBottomColor,
|
|
@@ -528,7 +472,7 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
|
|
|
528
472
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_transpordo) && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] text-white px-[14px] rounded-[38px] text-[12.5px] z-20`, style: {
|
|
529
473
|
backgroundColor: isSoldOut ? "#ddd" : colors.tooltipColor,
|
|
530
474
|
} },
|
|
531
|
-
|
|
475
|
+
React.createElement(LottiePlayer, { animationData: serviceItem.icons.connectingServiceIcon, width: "14px", height: "14px" }),
|
|
532
476
|
React.createElement("div", null, "Conexión"))),
|
|
533
477
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) && (React.createElement("div", { className: `flex items-center gap-[10px] py-[4px] text-white px-[14px] rounded-[38px] text-[12.5px] z-20 `, style: {
|
|
534
478
|
backgroundColor: isSoldOut ? "#ddd" : colors.tooltipColor,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ServiceItemProps } from "./types";
|
|
3
|
-
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption, }: ServiceItemProps & {
|
|
3
|
+
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, }: ServiceItemProps & {
|
|
4
4
|
currencySign?: string;
|
|
5
5
|
}): React.ReactElement;
|
|
6
6
|
export default ServiceItemPB;
|
|
@@ -32,6 +32,8 @@ import KuposButton from "../../ui/KuposButton/KuposButton";
|
|
|
32
32
|
import BottomAmenities from "../../ui/BottomAmenities/BottomAmenities";
|
|
33
33
|
import SeatSection from "../../ui/SeatSection/SeatSection";
|
|
34
34
|
import DateTimeSection from "../../ui/DateTimeSection/DateTimeSection";
|
|
35
|
+
import FeatureServiceUi from "../../ui/FeatureServiceUI/FeatureServiceUi";
|
|
36
|
+
import thunderAnimation from "../../assets/images/anims/service_list/thunder_icon.json";
|
|
35
37
|
import ServiceBadges from "../../ui/ServiceBadges/ServiceBadges";
|
|
36
38
|
const SEAT_EXCEPTIONS = ["Asiento mascota"];
|
|
37
39
|
const ANIMATION_MAP = {
|
|
@@ -64,6 +66,9 @@ const ANIMATION_MAP = {
|
|
|
64
66
|
bombAnimation: {
|
|
65
67
|
kupos: bombAnimation,
|
|
66
68
|
},
|
|
69
|
+
thunderAnimation: {
|
|
70
|
+
kupos: thunderAnimation,
|
|
71
|
+
},
|
|
67
72
|
dotAnimation: {
|
|
68
73
|
kupos: dotAnimation,
|
|
69
74
|
},
|
|
@@ -74,7 +79,7 @@ const ANIMATION_MAP = {
|
|
|
74
79
|
kupos: femaleAnimation,
|
|
75
80
|
},
|
|
76
81
|
};
|
|
77
|
-
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption, }) {
|
|
82
|
+
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, isNewUi, showLoginModal, isLoggedIn, showLoginOption, isFeatureDropDownExpand, setIsFeatureDropDownExpand, ticketQuantity, onIncreaseTicketQuantity, onDecreaseTicketQuantity, }) {
|
|
78
83
|
var _a;
|
|
79
84
|
const getAnimationIcon = (icon) => {
|
|
80
85
|
var _a;
|
|
@@ -243,7 +248,11 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
243
248
|
},
|
|
244
249
|
];
|
|
245
250
|
const otherItems = items.filter((i) => i.key !== "pet" && i.key !== "flexible" && !!i.condition);
|
|
246
|
-
return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus
|
|
251
|
+
return (React.createElement(React.Fragment, null, isPeruSites ? (React.createElement(PeruServiceItemDesktop, { serviceItem: serviceItem, onBookButtonPress: onBookButtonPress, colors: colors, metaData: metaData, children: children, busStage: busStage, serviceDetailsLoading: serviceDetailsLoading, cityOrigin: cityOrigin, cityDestination: cityDestination, translation: translation, orignLabel: orignLabel, destinationLabel: destinationLabel, currencySign: currencySign, isCiva: isCiva, showRating: showRating, showLastSeats: showLastSeats, removeArrivalTime: removeArrivalTime, removeDuplicateSeats: removeDuplicateSeats, isPeruSites: isPeruSites, t: (key) => t(key), showAvailableSeats: showAvailableSeats, isSeatIcon: isSeatIcon, isPeru: isPeru, siteType: siteType, isAllinBus: isAllinBus })) : isNewUi ? (React.createElement(FeatureServiceUi, { serviceItem: serviceItem, showTopLabel: showTopLabel, colors: colors, isSoldOut: isSoldOut, getAnimationIcon: getAnimationIcon, cityOrigin: cityOrigin, cityDestination: cityDestination, renderIcon: renderIcon, viewersConfig: viewersConfig, isFeatureDropDownExpand: isFeatureDropDownExpand, ticketQuantity: ticketQuantity, onIncreaseTicketQuantity: onIncreaseTicketQuantity, onDecreaseTicketQuantity: onDecreaseTicketQuantity, onBookButtonPress: onBookButtonPress, onToggleExpand: () => setIsFeatureDropDownExpand &&
|
|
252
|
+
setIsFeatureDropDownExpand(isFeatureDropDownExpand === serviceItem.id ||
|
|
253
|
+
isFeatureDropDownExpand === true
|
|
254
|
+
? null
|
|
255
|
+
: serviceItem.id) })) : (React.createElement("div", { className: `relative hover:z-[150] ${hasOfferText || hasDpEnabled ? "mb-[55px]" : "mb-[10px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
|
|
247
256
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
|
|
248
257
|
showTopLabel
|
|
249
258
|
? "mt-[24px]"
|
|
@@ -299,7 +308,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
299
308
|
boxSizing: "border-box",
|
|
300
309
|
}
|
|
301
310
|
: {})) },
|
|
302
|
-
React.createElement(ExpandedDropdown, { serviceItem: serviceItem, isPeru: isPeru, translation: translation, getAnimationIcon: getAnimationIcon, isChangeTicket: serviceItem.is_change_ticket === true, isSoldOut: isSoldOut, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })))),
|
|
311
|
+
React.createElement(ExpandedDropdown, { serviceItem: serviceItem, isPeru: isPeru, translation: translation, getAnimationIcon: getAnimationIcon, isChangeTicket: serviceItem.is_change_ticket === true, isSoldOut: isSoldOut, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, renderIcon: renderIcon })))),
|
|
303
312
|
children,
|
|
304
313
|
React.createElement(ServiceBadges, { showTopLabel: showTopLabel, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, translation: translation, serviceItem: serviceItem })))));
|
|
305
314
|
}
|
|
@@ -180,6 +180,6 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
180
180
|
zIndex: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? -3 : undefined,
|
|
181
181
|
marginTop: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "-15px" : "-10px",
|
|
182
182
|
} },
|
|
183
|
-
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, femaleAnim: serviceItem.icons.femaleAnim, flexibleAnim: serviceItem.icons.flexibleAnim })))));
|
|
183
|
+
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled, femaleAnim: serviceItem.icons.femaleAnim, flexibleAnim: serviceItem.icons.flexibleAnim, renderIcon: renderIcon })))));
|
|
184
184
|
}
|
|
185
185
|
export default ServiceItemMobile;
|
|
@@ -124,6 +124,7 @@ export interface MobileServiceItemProps {
|
|
|
124
124
|
directoIcon?: string;
|
|
125
125
|
whiteFireIcon?: string;
|
|
126
126
|
femaleAnim?: string;
|
|
127
|
+
cancelTicketIcon?: string;
|
|
127
128
|
[key: string]: string | Record<string, string | undefined> | undefined;
|
|
128
129
|
};
|
|
129
130
|
useLottieFor?: string[];
|
|
@@ -129,6 +129,12 @@ export interface ServiceItemProps {
|
|
|
129
129
|
personIcon?: string;
|
|
130
130
|
whiteFireIcon?: string;
|
|
131
131
|
fireIcon?: string;
|
|
132
|
+
whiteOrigin?: string;
|
|
133
|
+
whiteDestination?: string;
|
|
134
|
+
userIcon?: string;
|
|
135
|
+
sheildIcon?: string;
|
|
136
|
+
busIcon?: string;
|
|
137
|
+
whiteDownArrow?: string;
|
|
132
138
|
[key: string]: string | Record<string, string | undefined> | undefined;
|
|
133
139
|
};
|
|
134
140
|
useLottieFor?: string[];
|
|
@@ -213,6 +219,11 @@ export interface ServiceItemProps {
|
|
|
213
219
|
isAllinBus?: boolean;
|
|
214
220
|
isExpand?: any;
|
|
215
221
|
setIsExpand?: (value: any) => void;
|
|
222
|
+
isFeatureDropDownExpand?: any;
|
|
223
|
+
setIsFeatureDropDownExpand?: (value: any) => void;
|
|
224
|
+
ticketQuantity?: number;
|
|
225
|
+
onIncreaseTicketQuantity?: (serviceItem: ServiceItemProps["serviceItem"]) => void;
|
|
226
|
+
onDecreaseTicketQuantity?: (serviceItem: ServiceItemProps["serviceItem"]) => void;
|
|
216
227
|
coachKey?: number;
|
|
217
228
|
viewersConfig?: {
|
|
218
229
|
min: number;
|
|
@@ -221,6 +232,7 @@ export interface ServiceItemProps {
|
|
|
221
232
|
label?: string;
|
|
222
233
|
icon?: string;
|
|
223
234
|
};
|
|
235
|
+
isNewUi?: boolean;
|
|
224
236
|
showLoginModal?: any;
|
|
225
237
|
isLoggedIn?: any;
|
|
226
238
|
showLoginOption?: boolean;
|