kupos-ui-components-lib 9.0.6 → 9.0.7
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/README copy.md +67 -223
- package/dist/assets/images/anims/service_list/directo.json +1 -1
- package/dist/assets/images/anims/service_list/priority_stage.json +1 -1
- package/dist/components/ServiceItem/RatingHover.js +31 -31
- package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +263 -125
- package/dist/components/ServiceItem/ServiceItemMobile.js +291 -44
- package/dist/components/ServiceItem/mobileTypes.d.ts +0 -3
- package/dist/components/ServiceItem/types.d.ts +0 -7
- package/dist/styles.css +17 -66
- package/dist/ui/AmenitiesBlock.js +36 -25
- package/dist/ui/DurationBlock.js +2 -2
- package/dist/ui/FlexibleBlock.js +4 -2
- package/dist/ui/PetBlock.js +3 -1
- package/dist/ui/RatingBlock.js +2 -6
- package/package.json +1 -1
- package/src/assets/images/anims/service_list/directo.json +1 -1
- package/src/assets/images/anims/service_list/priority_stage.json +1 -1
- package/src/components/ServiceItem/RatingHover.tsx +51 -51
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +466 -222
- package/src/components/ServiceItem/ServiceItemMobile.tsx +501 -120
- package/src/components/ServiceItem/mobileTypes.ts +0 -3
- package/src/components/ServiceItem/types.ts +0 -7
- package/src/ui/AmenitiesBlock.tsx +15 -34
- package/src/ui/DurationBlock.tsx +2 -2
- package/src/ui/FlexibleBlock.tsx +3 -3
- package/src/ui/PetBlock.tsx +2 -2
- package/src/ui/RatingBlock.tsx +4 -16
- package/src/assets/images/anims/service_list/bomb.json +0 -1
- package/src/ui/BottomAmenities/BottomAmenities.tsx +0 -109
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +0 -85
- package/src/ui/KuposButton/KuposButton.tsx +0 -48
- package/src/ui/SeatSection/SeatSection.tsx +0 -187
- package/src/ui/TopAmenities/TopAmenities.tsx +0 -82
- package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +0 -168
- package/src/ui/mobileweb/DateTimeSectionMobile.tsx +0 -192
- package/src/ui/mobileweb/SeatSectionMobile.tsx +0 -256
- package/src/ui/mobileweb/TopAmenitieMobile.tsx +0 -82
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import LottiePlayer from "../assets/LottiePlayer";
|
|
2
3
|
const DEFAULT_PRIORITY_IDS = ["2", "3", "13"];
|
|
3
4
|
const TOOLTIP_CLASS = "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]";
|
|
4
5
|
const getAmenityBaseName = (amenityStr) => { var _a; return (_a = amenityStr === null || amenityStr === void 0 ? void 0 : amenityStr.split(".")[0]) !== null && _a !== void 0 ? _a : ""; };
|
|
@@ -26,7 +27,7 @@ const getAmenitySplit = ({ isPeru, amenities, priorityIds }) => {
|
|
|
26
27
|
};
|
|
27
28
|
};
|
|
28
29
|
const AmenitiesBlock = ({ serviceItem, metaData, isSoldOut, colors, isPeru, getAnimationIcon, getAmenityName, SvgAmenities, }) => {
|
|
29
|
-
var _a, _b;
|
|
30
|
+
var _a, _b, _c;
|
|
30
31
|
if (!metaData ||
|
|
31
32
|
!((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details) === null || _a === void 0 ? void 0 : _a[4]) ||
|
|
32
33
|
!serviceItem.operator_details[4].length) {
|
|
@@ -44,29 +45,39 @@ const AmenitiesBlock = ({ serviceItem, metaData, isSoldOut, colors, isPeru, getA
|
|
|
44
45
|
});
|
|
45
46
|
const shouldShowPlus = plusAmenities.length > 0;
|
|
46
47
|
const grayscaleClass = isSoldOut ? "grayscale" : "";
|
|
47
|
-
return (React.createElement("div", { className: "flex items-center gap-[6px]" },
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
React.createElement("div", {
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
48
|
+
return (React.createElement("div", { className: "flex items-center gap-[6px]" },
|
|
49
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled) && (React.createElement("div", { className: grayscaleClass },
|
|
50
|
+
React.createElement(LottiePlayer, { animationData: getAnimationIcon("locationAnim"), width: "20px", height: "20px" }))),
|
|
51
|
+
visibleAmenities.map((val, key) => {
|
|
52
|
+
const raw = metaData.amenities[val];
|
|
53
|
+
if (isWater(raw))
|
|
54
|
+
return null;
|
|
55
|
+
const baseName = getAmenityBaseName(raw);
|
|
56
|
+
return (React.createElement("div", { key: key, className: "relative group cursor-pointer" },
|
|
57
|
+
React.createElement("div", { className: grayscaleClass },
|
|
58
|
+
React.createElement(SvgAmenities, { moreAnemities: false, name: baseName.toLowerCase() })),
|
|
59
|
+
React.createElement("div", { className: TOOLTIP_CLASS, style: {
|
|
60
|
+
backgroundColor: colors.tooltipColor,
|
|
61
|
+
zIndex: 21,
|
|
62
|
+
padding: "12px",
|
|
63
|
+
} },
|
|
64
|
+
React.createElement(TooltipArrow, { color: colors.tooltipColor }),
|
|
65
|
+
getAmenityName(baseName.split("_").join(" ")))));
|
|
66
|
+
}),
|
|
67
|
+
shouldShowPlus && (React.createElement("div", { className: "relative ml-1 cursor-pointer" },
|
|
68
|
+
React.createElement("div", { className: "group" },
|
|
69
|
+
React.createElement("img", { src: ((_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.plus) ||
|
|
70
|
+
"/images/icons/amenities/icon_plus.svg", className: "w-[16px] h-[16px]", alt: "plus" }),
|
|
71
|
+
React.createElement("div", { style: { zIndex: 100 }, className: TOOLTIP_CLASS },
|
|
72
|
+
React.createElement(TooltipArrow, { color: colors.tooltipColor }),
|
|
73
|
+
React.createElement("div", { className: "flex flex-col gap-[10px] p-3 rounded-[8px] shadow-md", style: { backgroundColor: colors.tooltipColor } }, plusAmenities.map((val, key) => {
|
|
74
|
+
const raw = metaData.amenities[val];
|
|
75
|
+
if (isWater(raw))
|
|
76
|
+
return null;
|
|
77
|
+
const baseName = getAmenityBaseName(raw);
|
|
78
|
+
return (React.createElement("div", { key: key, className: "flex items-center gap-[5px] text-xs whitespace-nowrap" },
|
|
79
|
+
React.createElement(SvgAmenities, { moreAnemities: true, name: baseName.toUpperCase(), color: "white" }),
|
|
80
|
+
getAmenityName(baseName.split("_").join(" "))));
|
|
81
|
+
}))))))));
|
|
71
82
|
};
|
|
72
83
|
export default AmenitiesBlock;
|
package/dist/ui/DurationBlock.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
const DurationBlock = ({ serviceItem, translation, renderIcon, isSoldOut, colors, }) => (React.createElement("div", { className: "flex items-baseline relative whitespace-nowrap
|
|
2
|
+
const DurationBlock = ({ serviceItem, translation, renderIcon, isSoldOut, colors, }) => (React.createElement("div", { className: "flex items-baseline relative whitespace-nowrap" },
|
|
3
3
|
React.createElement("div", { className: `w-[18px] mr-[4px] ${isSoldOut ? "grayscale" : ""}` }, renderIcon("hours", "14px")),
|
|
4
|
-
React.createElement("div", { className: "group text-[13.33px]
|
|
4
|
+
React.createElement("div", { className: "group text-[13.33px]" },
|
|
5
5
|
serviceItem.duration,
|
|
6
6
|
" ",
|
|
7
7
|
translation.hours,
|
package/dist/ui/FlexibleBlock.js
CHANGED
|
@@ -3,14 +3,16 @@ import LottiePlayer from "../assets/LottiePlayer";
|
|
|
3
3
|
const FlexibleBlock = ({ translation, getAnimationIcon, colors, serviceItem, isSoldOut, }) => {
|
|
4
4
|
var _a;
|
|
5
5
|
return (React.createElement("div", { className: "flex items-center" },
|
|
6
|
-
React.createElement("div", { className: "relative group cursor-
|
|
6
|
+
React.createElement("div", { className: "relative group cursor-default" },
|
|
7
7
|
React.createElement("div", { className: "flex items-center" },
|
|
8
8
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
9
9
|
React.createElement(LottiePlayer
|
|
10
10
|
// animationData={serviceItem.icons.flexibleAnim}
|
|
11
11
|
, {
|
|
12
12
|
// animationData={serviceItem.icons.flexibleAnim}
|
|
13
|
-
animationData: getAnimationIcon("flexibleIcon"), width: "20px", height: "20px" }))
|
|
13
|
+
animationData: getAnimationIcon("flexibleIcon"), width: "20px", height: "20px" })),
|
|
14
|
+
React.createElement("div", { className: "h-auto mr-[4px] text-[13px] text-[#464647]" },
|
|
15
|
+
React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.flexible))),
|
|
14
16
|
React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[230px] text-center break-normal shadow-service text-[12px]", style: {
|
|
15
17
|
backgroundColor: colors.tooltipColor,
|
|
16
18
|
lineHeight: "1.5",
|
package/dist/ui/PetBlock.js
CHANGED
|
@@ -8,7 +8,9 @@ const PetBlock = ({ translation, getAnimationIcon, colors, isSoldOut }) => (Reac
|
|
|
8
8
|
// animationData={serviceItem.icons.petFriendlyAnim}
|
|
9
9
|
, {
|
|
10
10
|
// animationData={serviceItem.icons.petFriendlyAnim}
|
|
11
|
-
animationData: getAnimationIcon("petFriendlyAnim"), width: "20px", height: "20px" }))
|
|
11
|
+
animationData: getAnimationIcon("petFriendlyAnim"), width: "20px", height: "20px" })),
|
|
12
|
+
React.createElement("div", { className: "h-auto mr-[4px] text-[13px] text-[#464647]" },
|
|
13
|
+
React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.petFriendly))),
|
|
12
14
|
React.createElement("div", { className: " hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[230px] text-center break-normal shadow-service", style: { backgroundColor: colors === null || colors === void 0 ? void 0 : colors.tooltipColor } },
|
|
13
15
|
React.createElement("div", { className: "tooltip-arrow absolute text-[13.33px] -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: { borderBottomColor: colors === null || colors === void 0 ? void 0 : colors.tooltipColor } }),
|
|
14
16
|
"Este servicio incluye asientos para mascotas."))));
|
package/dist/ui/RatingBlock.js
CHANGED
|
@@ -2,12 +2,8 @@ import React from "react";
|
|
|
2
2
|
import RatingHover from "../components/ServiceItem/RatingHover";
|
|
3
3
|
const RatingBlock = ({ showRating, serviceItem, isSoldOut, colors, t, translation, }) => (React.createElement("div", { className: "flex items-center whitespace-nowrap" },
|
|
4
4
|
showRating && (React.createElement(RatingHover, { serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation })),
|
|
5
|
-
React.createElement("
|
|
5
|
+
React.createElement("span", { className: "ml-[10px] text-[13.33px]", style: {
|
|
6
6
|
marginLeft: showRating ? "10px" : "0",
|
|
7
7
|
color: isSoldOut ? "#c0c0c0" : "#464647",
|
|
8
|
-
} },
|
|
9
|
-
React.createElement("span", { className: "block max-w-[120px] overflow-hidden text-ellipsis whitespace-nowrap cursor-pointer" }, serviceItem.operator_details[2]),
|
|
10
|
-
React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-nowrap z-10 mt-2.5 w-max text-center shadow-service text-[12px]", style: { backgroundColor: colors.tooltipColor } },
|
|
11
|
-
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: { borderBottomColor: colors.tooltipColor } }),
|
|
12
|
-
serviceItem.operator_details[2]))));
|
|
8
|
+
} }, serviceItem.operator_details[2])));
|
|
13
9
|
export default RatingBlock;
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"nm":"Main Scene","ddd":0,"h":500,"w":500,"meta":{"g":"@lottiefiles/creator 1.
|
|
1
|
+
{"nm":"Main Scene","ddd":0,"h":500,"w":500,"meta":{"g":"@lottiefiles/creator 1.25.0"},"layers":[{"ty":0,"nm":" Main Scene","sr":1,"st":0,"op":90,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[250,250]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[250,250]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"w":500,"h":500,"refId":"precomp_Main Scene_c6717324-fe11-4912-8421-1a94a5c0a552","ind":1}],"v":"5.7.0","fr":30,"op":90,"ip":0,"assets":[{"nm":"Main Scene","id":"precomp_Main Scene_c6717324-fe11-4912-8421-1a94a5c0a552","layers":[{"ty":4,"nm":"Shape Layer - SVG","sr":1,"st":0,"op":90,"ip":0,"hd":false,"ln":"Capa_1","ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[38.5,32.5]},"s":{"a":0,"k":[596.2908,596.2908]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[103.191,249.995],"t":24},{"s":[221.8237,249.9635],"t":39}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[0],"t":24},{"s":[100],"t":30}]}},"shapes":[{"ty":"gr","bm":0,"hd":false,"nm":"Group 1","it":[{"ty":"sh","bm":0,"hd":false,"nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[0.2699999999999996,0.37000000000000455],[-0.5899999999999999,0.759999999999998],[0,0],[0,0],[0,0.5100000000000002],[-0.2700000000000031,0.3600000000000001],[-0.39000000000000057,0],[-0.2699999999999996,-0.37000000000000005],[0,0],[0.5700000000000003,-0.759999999999998],[0,0],[0.39000000000000057,0]],"o":[[-0.39000000000000057,0],[-0.5700000000000003,-0.75],[0,0],[0,0],[-0.28000000000000114,-0.33999999999999986],[0,-0.5100000000000002],[0.28000000000000114,-0.36],[0.39000000000000057,0],[0,0],[0.5700000000000003,0.75],[0,0],[-0.28000000000000114,0.35999999999999943],[0,0]],"v":[[26.98,65],[25.96,64.44],[25.96,61.71],[48.010000000000005,32.269999999999996],[25.94,3.28],[25.52,1.9299999999999997],[25.94,0.5599999999999996],[26.98,-4.440892098500626e-16],[28,0.5599999999999996],[51.07,30.88],[51.07,33.61],[28.01,64.43],[26.970000000000002,65.01]]}}},{"ty":"st","bm":0,"hd":false,"nm":"Stroke","lc":1,"lj":1,"ml":4,"o":{"a":0,"k":100},"w":{"a":0,"k":0.87},"c":{"a":0,"k":[1,1,1]}},{"ty":"fl","bm":0,"hd":false,"nm":"Fill","c":{"a":0,"k":[1,1,1]},"r":1,"o":{"a":0,"k":100}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":1},{"ty":4,"nm":"Shape Layer - SVG 1","sr":1,"st":0,"op":90,"ip":0,"hd":false,"ln":"Capa_1","ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[38.5,32.5]},"s":{"a":0,"k":[596.2908,596.2908]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[80.0835,249.995],"t":2},{"s":[395.1269,249.9635],"t":24}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[0],"t":0},{"s":[100],"t":4}]}},"shapes":[{"ty":"gr","bm":0,"hd":false,"nm":"Group 1","it":[{"ty":"sh","bm":0,"hd":false,"nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[0.2699999999999996,0.37000000000000455],[-0.5899999999999999,0.759999999999998],[0,0],[0,0],[0,0.5100000000000002],[-0.2700000000000031,0.3600000000000001],[-0.39000000000000057,0],[-0.2699999999999996,-0.37000000000000005],[0,0],[0.5700000000000003,-0.759999999999998],[0,0],[0.39000000000000057,0]],"o":[[-0.39000000000000057,0],[-0.5700000000000003,-0.75],[0,0],[0,0],[-0.28000000000000114,-0.33999999999999986],[0,-0.5100000000000002],[0.28000000000000114,-0.36],[0.39000000000000057,0],[0,0],[0.5700000000000003,0.75],[0,0],[-0.28000000000000114,0.35999999999999943],[0,0]],"v":[[26.98,65],[25.96,64.44],[25.96,61.71],[48.010000000000005,32.269999999999996],[25.94,3.28],[25.52,1.9299999999999997],[25.94,0.5599999999999996],[26.98,-4.440892098500626e-16],[28,0.5599999999999996],[51.07,30.88],[51.07,33.61],[28.01,64.43],[26.970000000000002,65.01]]}}},{"ty":"st","bm":0,"hd":false,"nm":"Stroke","lc":1,"lj":1,"ml":4,"o":{"a":0,"k":100},"w":{"a":0,"k":0.87},"c":{"a":0,"k":[1,1,1]}},{"ty":"fl","bm":0,"hd":false,"nm":"Fill","c":{"a":0,"k":[1,1,1]},"r":1,"o":{"a":0,"k":100}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":2}]}]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"nm":"Main Scene","ddd":0,"h":
|
|
1
|
+
{"nm":"Main Scene","ddd":0,"h":500,"w":500,"meta":{"g":"@lottiefiles/creator 1.25.0"},"layers":[{"ty":0,"nm":" Main Scene","sr":1,"st":0,"op":90,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[250,250]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[250,250]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"w":500,"h":500,"refId":"precomp_Main Scene_c6717324-fe11-4912-8421-1a94a5c0a552","ind":1}],"v":"5.7.0","fr":30,"op":90,"ip":0,"assets":[{"nm":"Main Scene","id":"precomp_Main Scene_c6717324-fe11-4912-8421-1a94a5c0a552","layers":[{"ty":4,"nm":"Shape Layer - SVG","sr":1,"st":0,"op":90,"ip":0,"hd":false,"ln":"Capa_1","ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[32.5,32.5]},"s":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[0,0],"t":4},{"s":[619.0851,619.0851],"t":14}]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[249.94198808735723,248.20464459007883]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[0],"t":0},{"s":[100],"t":7}]}},"shapes":[{"ty":"gr","bm":0,"hd":false,"nm":"Group 1","it":[{"ty":"sh","bm":0,"hd":false,"nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[1.0100000000000051,0.14999999999999858],[0,0],[0,0],[1.0400000000000063,0],[0.46000000000000085,-0.9199999999999999],[0,0],[0,0],[0.3200000000000003,-0.9899999999999984],[-0.75,-0.740000000000002],[0,0],[0,0],[-0.8599999999999994,-0.6299999999999955],[-0.9000000000000004,0.480000000000004],[0,0],[0,0],[-0.4299999999999997,0],[-0.47000000000000597,0.3400000000000034],[0.14999999999999858,1.0300000000000011],[0,0],[0,0],[0.3299999999999983,0.990000000000002],[0,0]],"o":[[-0.3200000000000003,-0.9899999999999984],[0,0],[0,0],[-0.46999999999999886,-0.96],[-1.0400000000000063,0],[0,0],[0,0],[-1.0099999999999998,0.14999999999999858],[-0.32000000000000006,0.9899999999999984],[0,0],[0,0],[-0.17999999999999972,1.0300000000000011],[0.8300000000000001,0.6300000000000026],[0,0],[0,0],[0.3999999999999986,0.21999999999999886],[0.5399999999999991,0],[0.8299999999999983,-0.6300000000000026],[0,0],[0,0],[0.7199999999999989,-0.7399999999999984],[0,0],[0,0]],"v":[[62.9,25.51],[60.739999999999995,23.67],[42.89999999999999,21.020000000000003],[34.93999999999999,4.510000000000002],[32.52999999999999,3.0000000000000018],[30.119999999999987,4.510000000000002],[22.149999999999988,21.020000000000003],[4.309999999999988,23.67],[2.149999999999988,25.51],[2.829999999999988,28.310000000000002],[15.729999999999988,41.17],[12.669999999999987,59.34],[13.749999999999988,62.03],[16.559999999999988,62.25],[32.48999999999999,53.66],[48.41999999999999,62.25],[49.679999999999986,62.58],[51.26999999999999,62.059999999999995],[52.34999999999999,59.37],[49.289999999999985,41.199999999999996],[62.18999999999998,28.339999999999996],[62.86999999999998,25.539999999999996],[62.90999999999998,25.499999999999996]]}}},{"ty":"st","bm":0,"hd":false,"nm":"Stroke","lc":1,"lj":1,"ml":4,"o":{"a":0,"k":100},"w":{"a":0,"k":3.58},"c":{"a":0,"k":[0.9765,0.5373,0.2706]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":1}]}]}
|
|
@@ -35,7 +35,7 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
35
35
|
}}
|
|
36
36
|
/>
|
|
37
37
|
<div
|
|
38
|
-
className="hidden group-hover:block absolute left-[80px] -bottom-[160px] z-20 mt-2 w-[
|
|
38
|
+
className="hidden group-hover:block absolute left-[80px] -bottom-[160px] z-20 mt-2 w-[320px] rounded-lg shadow-service-2 bg-white overflow-hidden rounded-[14px] border-[2px]"
|
|
39
39
|
style={{
|
|
40
40
|
borderColor: isSoldOut ? "#c0c0c0" : colors.ratingBorderColor,
|
|
41
41
|
color: isSoldOut ? "#c0c0c0" : "",
|
|
@@ -59,28 +59,28 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
59
59
|
<div className="px-3 py-2 flex flex-col gap-[10px] font9">
|
|
60
60
|
<RatingItem
|
|
61
61
|
rating={
|
|
62
|
-
serviceItem.operator_details[
|
|
63
|
-
serviceItem.operator_details[
|
|
62
|
+
serviceItem.operator_details[7] &&
|
|
63
|
+
serviceItem.operator_details[7][
|
|
64
64
|
Object.keys(
|
|
65
|
-
serviceItem.operator_details[
|
|
66
|
-
serviceItem.operator_details[
|
|
65
|
+
serviceItem.operator_details[7] &&
|
|
66
|
+
serviceItem.operator_details[7],
|
|
67
67
|
)[0]
|
|
68
68
|
] &&
|
|
69
69
|
parseFloat(
|
|
70
|
-
serviceItem.operator_details[
|
|
70
|
+
serviceItem.operator_details[7][
|
|
71
71
|
Object.keys(
|
|
72
|
-
serviceItem.operator_details[
|
|
73
|
-
serviceItem.operator_details[
|
|
72
|
+
serviceItem.operator_details[7] &&
|
|
73
|
+
serviceItem.operator_details[7],
|
|
74
74
|
)[0]
|
|
75
|
-
]
|
|
75
|
+
],
|
|
76
76
|
).toFixed(1)
|
|
77
77
|
? +parseFloat(
|
|
78
|
-
serviceItem.operator_details[
|
|
78
|
+
serviceItem.operator_details[7][
|
|
79
79
|
Object.keys(
|
|
80
|
-
serviceItem.operator_details[
|
|
81
|
-
serviceItem.operator_details[
|
|
80
|
+
serviceItem.operator_details[7] &&
|
|
81
|
+
serviceItem.operator_details[7],
|
|
82
82
|
)[0]
|
|
83
|
-
]
|
|
83
|
+
],
|
|
84
84
|
).toFixed(1)
|
|
85
85
|
: 0
|
|
86
86
|
}
|
|
@@ -89,28 +89,28 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
89
89
|
/>
|
|
90
90
|
<RatingItem
|
|
91
91
|
rating={
|
|
92
|
-
serviceItem.operator_details[
|
|
93
|
-
serviceItem.operator_details[
|
|
92
|
+
serviceItem.operator_details[7] &&
|
|
93
|
+
serviceItem.operator_details[7][
|
|
94
94
|
Object.keys(
|
|
95
|
-
serviceItem.operator_details[
|
|
96
|
-
serviceItem.operator_details[
|
|
95
|
+
serviceItem.operator_details[7] &&
|
|
96
|
+
serviceItem.operator_details[7],
|
|
97
97
|
)[1]
|
|
98
98
|
] &&
|
|
99
99
|
parseFloat(
|
|
100
|
-
serviceItem.operator_details[
|
|
100
|
+
serviceItem.operator_details[7][
|
|
101
101
|
Object.keys(
|
|
102
|
-
serviceItem.operator_details[
|
|
103
|
-
serviceItem.operator_details[
|
|
102
|
+
serviceItem.operator_details[7] &&
|
|
103
|
+
serviceItem.operator_details[7],
|
|
104
104
|
)[1]
|
|
105
|
-
]
|
|
105
|
+
],
|
|
106
106
|
).toFixed(1)
|
|
107
107
|
? +parseFloat(
|
|
108
|
-
serviceItem.operator_details[
|
|
108
|
+
serviceItem.operator_details[7][
|
|
109
109
|
Object.keys(
|
|
110
|
-
serviceItem.operator_details[
|
|
111
|
-
serviceItem.operator_details[
|
|
110
|
+
serviceItem.operator_details[7] &&
|
|
111
|
+
serviceItem.operator_details[7],
|
|
112
112
|
)[1]
|
|
113
|
-
]
|
|
113
|
+
],
|
|
114
114
|
).toFixed(1)
|
|
115
115
|
: 0
|
|
116
116
|
}
|
|
@@ -119,28 +119,28 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
119
119
|
/>
|
|
120
120
|
<RatingItem
|
|
121
121
|
rating={
|
|
122
|
-
serviceItem.operator_details[
|
|
123
|
-
serviceItem.operator_details[
|
|
122
|
+
serviceItem.operator_details[7] &&
|
|
123
|
+
serviceItem.operator_details[7][
|
|
124
124
|
Object.keys(
|
|
125
|
-
serviceItem.operator_details[
|
|
126
|
-
serviceItem.operator_details[
|
|
125
|
+
serviceItem.operator_details[7] &&
|
|
126
|
+
serviceItem.operator_details[7],
|
|
127
127
|
)[2]
|
|
128
128
|
] &&
|
|
129
129
|
parseFloat(
|
|
130
|
-
serviceItem.operator_details[
|
|
130
|
+
serviceItem.operator_details[7][
|
|
131
131
|
Object.keys(
|
|
132
|
-
serviceItem.operator_details[
|
|
133
|
-
serviceItem.operator_details[
|
|
132
|
+
serviceItem.operator_details[7] &&
|
|
133
|
+
serviceItem.operator_details[7],
|
|
134
134
|
)[2]
|
|
135
|
-
]
|
|
135
|
+
],
|
|
136
136
|
).toFixed(1)
|
|
137
137
|
? +parseFloat(
|
|
138
|
-
serviceItem.operator_details[
|
|
138
|
+
serviceItem.operator_details[7][
|
|
139
139
|
Object.keys(
|
|
140
|
-
serviceItem.operator_details[
|
|
141
|
-
serviceItem.operator_details[
|
|
140
|
+
serviceItem.operator_details[7] &&
|
|
141
|
+
serviceItem.operator_details[7],
|
|
142
142
|
)[2]
|
|
143
|
-
]
|
|
143
|
+
],
|
|
144
144
|
).toFixed(1)
|
|
145
145
|
: 0
|
|
146
146
|
}
|
|
@@ -149,28 +149,28 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
149
149
|
/>
|
|
150
150
|
<RatingItem
|
|
151
151
|
rating={
|
|
152
|
-
serviceItem.operator_details[
|
|
153
|
-
serviceItem.operator_details[
|
|
152
|
+
serviceItem.operator_details[7] &&
|
|
153
|
+
serviceItem.operator_details[7][
|
|
154
154
|
Object.keys(
|
|
155
|
-
serviceItem.operator_details[
|
|
156
|
-
serviceItem.operator_details[
|
|
155
|
+
serviceItem.operator_details[7] &&
|
|
156
|
+
serviceItem.operator_details[7],
|
|
157
157
|
)[3]
|
|
158
158
|
] &&
|
|
159
159
|
parseFloat(
|
|
160
|
-
serviceItem.operator_details[
|
|
160
|
+
serviceItem.operator_details[7][
|
|
161
161
|
Object.keys(
|
|
162
|
-
serviceItem.operator_details[
|
|
163
|
-
serviceItem.operator_details[
|
|
162
|
+
serviceItem.operator_details[7] &&
|
|
163
|
+
serviceItem.operator_details[7],
|
|
164
164
|
)[3]
|
|
165
|
-
]
|
|
165
|
+
],
|
|
166
166
|
).toFixed(1)
|
|
167
167
|
? +parseFloat(
|
|
168
|
-
serviceItem.operator_details[
|
|
168
|
+
serviceItem.operator_details[7][
|
|
169
169
|
Object.keys(
|
|
170
|
-
serviceItem.operator_details[
|
|
171
|
-
serviceItem.operator_details[
|
|
170
|
+
serviceItem.operator_details[7] &&
|
|
171
|
+
serviceItem.operator_details[7],
|
|
172
172
|
)[3]
|
|
173
|
-
]
|
|
173
|
+
],
|
|
174
174
|
).toFixed(1)
|
|
175
175
|
: 0
|
|
176
176
|
}
|
|
@@ -181,14 +181,14 @@ const RatingHover: React.FC<RatingHoverProps> = ({
|
|
|
181
181
|
|
|
182
182
|
{/* Footer */}
|
|
183
183
|
<div
|
|
184
|
-
className="px-
|
|
184
|
+
className="px-3 py-2 text-center text-[12px] font9 text-wrap"
|
|
185
185
|
style={{
|
|
186
186
|
backgroundColor: isSoldOut ? "#f5f5f5" : colors.ratingBottomColor,
|
|
187
187
|
color: isSoldOut ? "#c0c0c1" : "#ff8f45",
|
|
188
188
|
}}
|
|
189
189
|
>
|
|
190
190
|
{`${translation?.ratingMouseOverCalculationText} ${
|
|
191
|
-
Object.values(serviceItem.operator_details)[
|
|
191
|
+
Object.values(serviceItem.operator_details)[6]
|
|
192
192
|
} ${translation?.ratingMouseOverCalculationUsers}`}
|
|
193
193
|
</div>
|
|
194
194
|
</div>
|