kupos-ui-components-lib 9.5.7 → 9.5.10

package/dist/assets/images/anims/service_list/succes_anim.json

@@ -0,0 +1 @@
+{"v":"5.7.6","fr":30,"ip":0,"op":60,"w":512,"h":512,"nm":"Checkmark-final","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Capa de formas 6","sr":1,"ks":{"o":{"a":0,"k":67,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[173.75,411.25,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":25,"s":[0,0,100]},{"t":39,"s":[3.598,3.598,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[187.68,187.68],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"gf","o":{"a":0,"k":67,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.969,0.576,0.118,0.5,0.957,0.465,0.129,1,0.945,0.353,0.141],"ix":9}},"s":{"a":0,"k":[0,0],"ix":5},"e":{"a":0,"k":[100,0],"ix":6},"t":2,"h":{"a":0,"k":0,"ix":7},"a":{"a":0,"k":0,"ix":8},"nm":"Relleno de degradado 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[1.988,-0.426],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[131.424,131.424],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Capa de formas 5","sr":1,"ks":{"o":{"a":0,"k":67,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[423.5,238.5,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":36,"s":[0,0,100]},{"t":50,"s":[4.406,4.406,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[187.68,187.68],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"gf","o":{"a":0,"k":67,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.969,0.576,0.118,0.5,0.957,0.465,0.129,1,0.945,0.353,0.141],"ix":9}},"s":{"a":0,"k":[0,0],"ix":5},"e":{"a":0,"k":[100,0],"ix":6},"t":2,"h":{"a":0,"k":0,"ix":7},"a":{"a":0,"k":0,"ix":8},"nm":"Relleno de degradado 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[1.988,-0.426],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[131.424,131.424],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Capa de formas 4","sr":1,"ks":{"o":{"a":0,"k":67,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[100,140,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":46,"s":[0,0,100]},{"t":60,"s":[5.219,5.219,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[187.68,187.68],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"gf","o":{"a":0,"k":67,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.969,0.576,0.118,0.5,0.957,0.465,0.129,1,0.945,0.353,0.141],"ix":9}},"s":{"a":0,"k":[0,0],"ix":5},"e":{"a":0,"k":[100,0],"ix":6},"t":2,"h":{"a":0,"k":0,"ix":7},"a":{"a":0,"k":0,"ix":8},"nm":"Relleno de degradado 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[1.988,-0.426],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[131.424,131.424],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Capa 1/Check-Mark-Animation2 contornos","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[256,256,0],"ix":2,"l":2},"a":{"a":0,"k":[256,256,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[-54.205,3.498],[-19.88,36.986],[54.205,-36.986]],"c":false},"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":14.2,"ix":5},"lc":2,"lj":1,"ml":10,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"tr","p":{"a":0,"k":[262.249,261.506],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Grupo 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"tm","s":{"a":0,"k":0,"ix":1},"e":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":21,"s":[0]},{"t":40,"s":[100]}],"ix":2},"o":{"a":0,"k":0,"ix":3},"m":1,"ix":2,"nm":"Recortar trazados 1","mn":"ADBE Vector Filter - Trim","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"CirculoNaranja","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[254,256,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":7,"s":[0,0,100]},{"t":25,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[187.68,187.68],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,1,0.655,0.212,0.5,1,0.608,0.241,1,1,0.561,0.271],"ix":9}},"s":{"a":0,"k":[-29,-62],"ix":5},"e":{"a":0,"k":[100,0],"ix":6},"t":2,"h":{"a":0,"k":21,"ix":7},"a":{"a":0,"k":0,"ix":8},"nm":"Relleno de degradado 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[1.988,-0.426],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[131.424,131.424],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"CirculoBlanco","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[254,256,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":7,"s":[0,0,100]},{"t":25,"s":[109,109,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[187.68,187.68],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Trazado elíptico 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[1.988,-0.426],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[131.424,131.424],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Elipse 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"CirculoAnaranjadoFondo","sr":1,"ks":{"o":{"a":0,"k":14,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[256,256,0],"ix":2,"l":2},"a":{"a":0,"k":[256,256,0],"ix":1,"l":2},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[0,0,100]},{"t":20,"s":[100,100,100]}],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-141.385,0],[0,-141.385],[141.385,0],[0,141.385]],"o":[[141.385,0],[0,141.385],[-141.385,0],[0,-141.385]],"v":[[0,-256],[256,0],[0,256],[-256,0]],"c":true},"ix":2},"nm":"Trazado 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0.944999964097,0.352999997606,0.141000007181,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 2","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[256,256],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Grupo 1","np":5,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0},{"ddd":0,"ind":8,"ty":4,"nm":"Capa de formas 7","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,252,0],"ix":2,"l":2},"a":{"a":0,"k":[0,0,0],"ix":1,"l":2},"s":{"a":0,"k":[100,100,100],"ix":6,"l":2}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[518.633,518.633],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Trazado de rectángulo 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"st","c":{"a":0,"k":[1,1,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":0,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Trazo 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Relleno 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[3.316,3.316],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectángulo 1","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":60,"st":0,"bm":0}],"markers":[]}

package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js

@@ -351,7 +351,6 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
                 React.createElement("div", { className: "mt-3 text-[13.33px]", style: { margin: checkWhatsappEligibility ? "0" : "6px 0" } },
                     selectSeatOnward && selectedOnward && selectedOnward[0]
                         ? selectedOnward[0].map((val, key) => {
-                            console.log("🚀 ~ PaymentSideBarDesktop ~ val:", val);
                             return (React.createElement("div", { key: key, className: "flex justify-between items-center w-[100%]" },
                                 React.createElement("div", null,
                                     React.createElement("span", null,

package/dist/components/ServiceItem/PeruServiceItemDesktop.js

@@ -369,14 +369,14 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
                         React.createElement("div", { className: "flex flex-col gap-[10px]" },
                             React.createElement(StageTooltip, { stageData: serviceItem.boarding_stages, direction: 1, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
                                 React.createElement("span", { className: "cursor-pointer bold-text capitalize" }, DateService.getServiceItemDate(serviceItem.travel_date))),
-                            !isCiva && (React.createElement(StageTooltip, { stageData: serviceItem.boarding_stages, direction: 1, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
+                            !isCiva && (React.createElement(StageTooltip, { stageData: serviceItem.dropoff_stages, direction: 2, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
                                 React.createElement("span", { className: "cursor-pointer bold-text capitalize" }, DateService.getServiceItemDate(serviceItem.arrival_date))))),
                         React.createElement("div", { className: "flex flex-col gap-[10px] items-center" },
                             React.createElement("div", { className: "h-[20px] flex items-center justify-center" },
                                 React.createElement("div", null, "\u2022")),
                             !isCiva && (React.createElement("div", { className: "h-[20px] flex items-center justify-center" }, removeArrivalTime ? null : serviceItem.arr_time ? (React.createElement("div", null, "\u2022")) : null))),
                         React.createElement("div", { className: "flex flex-col gap-[10px]" },
-                            React.createElement(StageTooltip, { stageData: serviceItem.dropoff_stages, direction: 2, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
+                            React.createElement(StageTooltip, { stageData: serviceItem.boarding_stages, direction: 1, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
                                 React.createElement("div", { className: "font-[900] bold-text" }, DateService.formatTime(serviceItem.dep_time))),
                             !isCiva && (React.createElement(StageTooltip, { stageData: serviceItem.dropoff_stages, direction: 2, terminals: busStage, serviceItem: serviceItem, metaData: metaData, colors: colors },
                                 React.createElement("div", { className: "font-[900] bold-text" }, removeArrivalTime
@@ -402,10 +402,11 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
                                     left: "68%",
                                     right: 0,
                                     justifyContent: getNumberOfSeats() < 2 ? "center" : "center",
+                                    gap: "5px",
                                 } },
                                 React.createElement("span", { style: {
                                         position: "absolute",
-                                        top: -5,
+                                        top: getNumberOfSeats() > 1 ? -10 : -5,
                                         fontWeight: "initial",
                                         fontSize: "12px",
                                         left: 0,

package/dist/components/Survey/ResponsiveSurvey.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { SurveyProps } from "./types";
+export default function ResponsiveSurvey(props: SurveyProps): React.JSX.Element;

package/dist/components/Survey/ResponsiveSurvey.js

@@ -0,0 +1,10 @@
+import React from "react";
+import SurveyDesktop from "./SurveyDesktop";
+import SurveyMobile from "./SurveyMobile";
+export default function ResponsiveSurvey(props) {
+    const { variant } = props;
+    if (variant === "mobile") {
+        return React.createElement(SurveyMobile, Object.assign({}, props));
+    }
+    return React.createElement(SurveyDesktop, Object.assign({}, props));
+}

package/dist/components/Survey/SurveyDesktop.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { SurveyProps } from "./types";
+declare const SurveyDesktop: ({ isOpen, isSubmitted, selectedScore, onScoreChange, feedback, onFeedbackChange, onClose, onSkip, onSubmit, colors, }: SurveyProps) => React.JSX.Element;
+export default SurveyDesktop;

package/dist/components/Survey/SurveyDesktop.js

@@ -0,0 +1,36 @@
+import React from "react";
+import { Modal } from "../../ui/Modal";
+import { ThankYouCard, SurveyHeader, ScoreButtons, FeedbackBanner, FeedbackTextarea, SurveyFooter, getFeedbackConfig, } from "../../ui/Survey";
+const SurveyDesktop = ({ isOpen, isSubmitted, selectedScore, onScoreChange, feedback = "", onFeedbackChange, onClose, onSkip, onSubmit, colors, }) => {
+    if (!isOpen)
+        return null;
+    const config = getFeedbackConfig(selectedScore);
+    const handleSubmit = () => {
+        if (selectedScore != null) {
+            onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(selectedScore, feedback);
+        }
+    };
+    return (React.createElement(Modal, { isOpen: isOpen, onClose: onClose, variant: "center", size: "lg", maxWidth: 640, padding: isSubmitted ? 0 : "32px 36px 28px", borderRadius: 24, closeOnBackdrop: false }, isSubmitted ? (React.createElement(ThankYouCard, { onClose: onClose })) : (React.createElement(React.Fragment, null,
+        React.createElement(SurveyHeader, { onClose: onClose }),
+        React.createElement("h2", { style: {
+                fontSize: "22px",
+                lineHeight: 1.25,
+                color: colors === null || colors === void 0 ? void 0 : colors.primaryColor,
+            } },
+            "\u00BFQu\u00E9 tan probable es que",
+            " ",
+            React.createElement("em", { style: {
+                    color: colors === null || colors === void 0 ? void 0 : colors.secondaryColor,
+                } }, "recomiendes"),
+            " ",
+            "a un amigo?"),
+        React.createElement("p", { className: "text-[13.33px]", style: {
+                color: colors === null || colors === void 0 ? void 0 : colors.primaryColor,
+                marginBottom: 20,
+            } }, "Pulsa un n\u00FAmero: 1 significa en absoluto, 10 significa absolutamente."),
+        React.createElement(ScoreButtons, { selectedScore: selectedScore, onScoreChange: onScoreChange, buttonHeight: 54, fontSize: 15 }),
+        React.createElement(FeedbackBanner, { config: config }),
+        React.createElement(FeedbackTextarea, { config: config, feedback: feedback, onFeedbackChange: onFeedbackChange }),
+        React.createElement(SurveyFooter, { selectedScore: selectedScore, onSkip: onSkip, onSubmit: handleSubmit, colors: colors })))));
+};
+export default SurveyDesktop;

package/dist/components/Survey/SurveyMobile.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { SurveyProps } from "./types";
+declare const SurveyMobile: ({ isOpen, isSubmitted, selectedScore, onScoreChange, feedback, onFeedbackChange, onClose, onSkip, onSubmit, colors, }: SurveyProps) => React.JSX.Element;
+export default SurveyMobile;

package/dist/components/Survey/SurveyMobile.js

@@ -0,0 +1,39 @@
+import React from "react";
+import { BottomSheet } from "../../ui/BottomSheet";
+import { ThankYouCard, SurveyHeader, ScoreButtons, FeedbackBanner, FeedbackTextarea, SurveyFooter, getFeedbackConfig, } from "../../ui/Survey";
+const SurveyMobile = ({ isOpen, isSubmitted, selectedScore, onScoreChange, feedback = "", onFeedbackChange, onClose, onSkip, onSubmit, colors, }) => {
+    if (!isOpen)
+        return null;
+    const config = getFeedbackConfig(selectedScore);
+    const handleSubmit = () => {
+        if (selectedScore != null) {
+            onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(selectedScore, feedback);
+        }
+    };
+    return (React.createElement(BottomSheet, { isOpen: isOpen !== null && isOpen !== void 0 ? isOpen : false, onClose: onClose, showHandle: true, showBackdrop: false, blurBackground: true, blurAmount: "2px", padding: isSubmitted ? 0 : "0 20px 32px" }, isSubmitted ? (React.createElement(ThankYouCard, { onClose: onClose, titleFontSize: "1.35rem" })) : (React.createElement(React.Fragment, null,
+        React.createElement(SurveyHeader, { onClose: onClose }),
+        React.createElement("h2", { style: {
+                fontSize: "1.35rem",
+                fontWeight: 800,
+                lineHeight: 1.3,
+                color: colors === null || colors === void 0 ? void 0 : colors.primaryColor,
+                marginBottom: 12,
+            } },
+            "\u00BFQu\u00E9 tan probable es que",
+            " ",
+            React.createElement("em", { style: {
+                    color: colors === null || colors === void 0 ? void 0 : colors.secondaryColor,
+                } }, "recomiendes"),
+            " ",
+            "a un amigo?"),
+        React.createElement("p", { style: {
+                fontSize: "13.33px",
+                color: colors === null || colors === void 0 ? void 0 : colors.primaryColor,
+                marginBottom: 16,
+            } }, "Pulsa un n\u00FAmero: 1 significa en absoluto, 10 significa absolutamente."),
+        React.createElement(ScoreButtons, { selectedScore: selectedScore, onScoreChange: onScoreChange, buttonHeight: 44, fontSize: 13, gap: 6 }),
+        React.createElement(FeedbackBanner, { config: config }),
+        React.createElement(FeedbackTextarea, { config: config, feedback: feedback, onFeedbackChange: onFeedbackChange }),
+        React.createElement(SurveyFooter, { selectedScore: selectedScore, onSkip: onSkip, onSubmit: handleSubmit, colors: colors, layout: "stacked" })))));
+};
+export default SurveyMobile;

package/dist/components/Survey/index.d.ts

@@ -0,0 +1,5 @@
+import SurveyDesktop from "./SurveyDesktop";
+import SurveyMobile from "./SurveyMobile";
+import ResponsiveSurvey from "./ResponsiveSurvey";
+export { SurveyDesktop, SurveyMobile, ResponsiveSurvey };
+export type { SurveyProps } from "./types";

package/dist/components/Survey/index.js

@@ -0,0 +1,4 @@
+import SurveyDesktop from "./SurveyDesktop";
+import SurveyMobile from "./SurveyMobile";
+import ResponsiveSurvey from "./ResponsiveSurvey";
+export { SurveyDesktop, SurveyMobile, ResponsiveSurvey };

package/dist/components/Survey/types.d.ts

@@ -0,0 +1,18 @@
+export interface SurveyProps {
+    variant?: "mobile" | "desktop";
+    isOpen?: boolean;
+    selectedScore?: number | null;
+    onScoreChange?: (score: number) => void;
+    feedback?: string;
+    onFeedbackChange?: (text: string) => void;
+    onClose?: () => void;
+    onSkip?: () => void;
+    onSubmit?: (score: number, feedback: string) => void;
+    isSubmitted?: boolean;
+    isLoading?: boolean;
+    colors?: {
+        secondaryColor?: string;
+        tertiaryColor?: string;
+        primaryColor?: string;
+    };
+}

package/dist/components/Survey/types.js

@@ -0,0 +1 @@
+export {};

package/dist/ui/BottomSheet/BottomSheet.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+export interface BottomSheetProps {
+    isOpen: boolean;
+    onClose?: () => void;
+    children: React.ReactNode;
+    showHandle?: boolean;
+    showBackdrop?: boolean;
+    backdropColor?: string;
+    blurBackground?: boolean;
+    blurAmount?: string;
+    closeOnBackdrop?: boolean;
+    padding?: string | number;
+    maxHeight?: string;
+    borderRadius?: string;
+}
+declare const BottomSheet: ({ isOpen, onClose, children, showHandle, showBackdrop, backdropColor, blurBackground, blurAmount, closeOnBackdrop, padding, maxHeight, borderRadius, }: BottomSheetProps) => React.JSX.Element;
+export default BottomSheet;

package/dist/ui/BottomSheet/BottomSheet.js

@@ -0,0 +1,77 @@
+import React from "react";
+import ReactDOM from "react-dom";
+const STYLE_ID = "__kupos_bottom_sheet_style__";
+const injectStyle = () => {
+    if (typeof document === "undefined")
+        return;
+    if (document.getElementById(STYLE_ID))
+        return;
+    const style = document.createElement("style");
+    style.id = STYLE_ID;
+    style.textContent = `
+    @keyframes __ks_slideUp {
+      from { transform: translateY(100%); }
+      to   { transform: translateY(0); }
+    }
+    @keyframes __ks_fadeIn {
+      from { opacity: 0; }
+      to   { opacity: 1; }
+    }
+    .__ks_sheet {
+      animation: __ks_slideUp 0.38s cubic-bezier(0.32, 0.72, 0, 1) both;
+    }
+    .__ks_backdrop {
+      animation: __ks_fadeIn 0.3s ease both;
+    }
+  `;
+    document.head.appendChild(style);
+};
+const BottomSheet = ({ isOpen, onClose, children, showHandle = true, showBackdrop = false, backdropColor = "rgba(0,0,0,0.45)", blurBackground = false, blurAmount = "6px", closeOnBackdrop = true, padding = "20px 20px 32px", maxHeight = "92vh", borderRadius = "24px 24px 0 0", }) => {
+    if (!isOpen)
+        return null;
+    injectStyle();
+    const sheet = (React.createElement(React.Fragment, null,
+        (showBackdrop || blurBackground) && (React.createElement("div", { className: "__ks_backdrop", onClick: closeOnBackdrop ? onClose : undefined, style: {
+                position: "fixed",
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                zIndex: 9998,
+                backgroundColor: showBackdrop ? backdropColor : "rgba(0,0,0,0.4)",
+                backdropFilter: blurBackground ? `blur(${blurAmount})` : undefined,
+                WebkitBackdropFilter: blurBackground
+                    ? `blur(${blurAmount})`
+                    : undefined,
+            } })),
+        React.createElement("div", { className: "__ks_sheet", style: {
+                position: "fixed",
+                left: 0,
+                right: 0,
+                bottom: 0,
+                zIndex: 9999,
+                background: "#FFFFFF",
+                maxHeight,
+                borderRadius,
+                overflowY: "auto",
+                boxSizing: "border-box",
+                boxShadow: "0 -8px 40px rgba(0,0,0,0.15)",
+            } },
+            showHandle && (React.createElement("div", { style: {
+                    display: "flex",
+                    justifyContent: "center",
+                    padding: "12px 0 4px",
+                } },
+                React.createElement("div", { style: {
+                        width: 40,
+                        height: 4,
+                        borderRadius: 999,
+                        backgroundColor: "#E5E7EB",
+                    } }))),
+            React.createElement("div", { style: { padding } }, children))));
+    if (typeof document !== "undefined") {
+        return ReactDOM.createPortal(sheet, document.body);
+    }
+    return sheet;
+};
+export default BottomSheet;

package/dist/ui/BottomSheet/index.d.ts

@@ -0,0 +1,2 @@
+export { default as BottomSheet } from "./BottomSheet";
+export type { BottomSheetProps } from "./BottomSheet";

package/dist/ui/BottomSheet/index.js

@@ -0,0 +1 @@
+export { default as BottomSheet } from "./BottomSheet";

package/dist/ui/Modal/Modal.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+export type ModalVariant = "center" | "bottom-sheet";
+export type ModalSize = "sm" | "md" | "lg" | "xl" | "full";
+export interface ModalProps {
+    isOpen: boolean;
+    onClose?: () => void;
+    children: React.ReactNode;
+    variant?: ModalVariant;
+    size?: ModalSize;
+    closeOnBackdrop?: boolean;
+    padding?: string | number;
+    borderRadius?: string | number;
+    backdropColor?: string;
+    maxWidth?: number | string;
+}
+declare const Modal: ({ isOpen, onClose, children, variant, size, closeOnBackdrop, padding, borderRadius, backdropColor, maxWidth, }: ModalProps) => React.JSX.Element;
+export default Modal;

package/dist/ui/Modal/Modal.js

@@ -0,0 +1,46 @@
+import React from "react";
+import ReactDOM from "react-dom";
+const SIZE_MAP = {
+    sm: 400,
+    md: 520,
+    lg: 640,
+    xl: 800,
+    full: "100%",
+};
+const Modal = ({ isOpen, onClose, children, variant = "center", size = "md", closeOnBackdrop = true, padding = "28px 32px 24px", borderRadius, backdropColor = "rgba(0,0,0,0.45)", maxWidth, }) => {
+    if (!isOpen)
+        return null;
+    const resolvedMaxWidth = maxWidth !== null && maxWidth !== void 0 ? maxWidth : SIZE_MAP[size];
+    const resolvedRadius = borderRadius !== null && borderRadius !== void 0 ? borderRadius : (variant === "bottom-sheet" ? "24px 24px 0 0" : 24);
+    const overlayStyle = {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        zIndex: 9999,
+        display: "flex",
+        alignItems: variant === "bottom-sheet" ? "flex-end" : "center",
+        justifyContent: "center",
+        padding: variant === "bottom-sheet" ? 0 : 16,
+        backgroundColor: backdropColor,
+    };
+    const cardStyle = {
+        background: "#FFFFFF",
+        width: "100%",
+        maxWidth: resolvedMaxWidth,
+        maxHeight: variant === "bottom-sheet" ? "92vh" : undefined,
+        borderRadius: resolvedRadius,
+        padding,
+        position: "relative",
+        boxSizing: "border-box",
+        overflowY: variant === "bottom-sheet" ? "auto" : undefined,
+    };
+    const modal = (React.createElement("div", { style: overlayStyle, onClick: closeOnBackdrop ? onClose : undefined },
+        React.createElement("div", { style: cardStyle, onClick: (e) => e.stopPropagation() }, children)));
+    if (typeof document !== "undefined") {
+        return ReactDOM.createPortal(modal, document.body);
+    }
+    return modal;
+};
+export default Modal;

package/dist/ui/Modal/ModalHeader.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+export interface ModalHeaderProps {
+    title?: React.ReactNode;
+    onClose?: () => void;
+    children?: React.ReactNode;
+}
+declare const ModalHeader: ({ title, onClose, children }: ModalHeaderProps) => React.JSX.Element;
+export default ModalHeader;

package/dist/ui/Modal/ModalHeader.js

@@ -0,0 +1,30 @@
+import React from "react";
+const ModalHeader = ({ title, onClose, children }) => (React.createElement("div", { style: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        marginBottom: 20,
+    } },
+    React.createElement("div", { style: { flex: 1 } },
+        title && (React.createElement("span", { style: {
+                fontSize: "1rem",
+                fontWeight: 700,
+                color: "#111827",
+            } }, title)),
+        children),
+    onClose && (React.createElement("button", { onClick: onClose, style: {
+            width: 36,
+            height: 36,
+            borderRadius: "50%",
+            background: "#F3F4F6",
+            border: "none",
+            cursor: "pointer",
+            fontSize: 14,
+            color: "#6B7280",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            flexShrink: 0,
+            marginLeft: 12,
+        } }, "\u2715"))));
+export default ModalHeader;

package/dist/ui/Modal/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Modal } from "./Modal";
+export { default as ModalHeader } from "./ModalHeader";
+export type { ModalProps, ModalVariant, ModalSize } from "./Modal";
+export type { ModalHeaderProps } from "./ModalHeader";

package/dist/ui/Modal/index.js

@@ -0,0 +1,2 @@
+export { default as Modal } from "./Modal";
+export { default as ModalHeader } from "./ModalHeader";

package/dist/ui/SeatSection/SeatSection.js

@@ -55,6 +55,7 @@ function getNumberOfSeats(seatTypes) {
     return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
 }
 function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, }) {
+    var _a, _b;
     const uniqueSeats = getUniqueSeats(seatTypes);
     const sortedSeatTypes = getSortedSeatTypes(seatTypes);
     const numberOfSeats = getNumberOfSeats(seatTypes);
@@ -116,7 +117,13 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
         }
         return renderSeatNames();
     };
-    if (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) {
+    const _dpSeatsFirstVal = Array.isArray(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats)
+        ? serviceItem.dp_discounted_seats[0]
+        : Object.values((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) || {})[0];
+    const _dpPercentsFirstVal = Array.isArray(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents)
+        ? serviceItem.dp_discount_percents[0]
+        : Object.values((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {})[0];
+    if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !_dpSeatsFirstVal && !_dpPercentsFirstVal) {
         const dpSeats = (removeDuplicateSeats ? uniqueSeats : sortedSeatTypes).filter((s) => !SEAT_EXCEPTIONS.includes(s.label));
         const lowestFare = dpSeats.length > 0 ? Math.min(...dpSeats.map((s) => Number(s.price))) : 0;
         return (React.createElement("div", { className: "flex items-center justify-between text-[13.33px] ", style: {
@@ -141,6 +148,48 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
                         ? CommonService.currency(0, currencySign)
                         : CommonService.discountedCurrency(lowestFare, currencySign))))));
     }
+    if (_dpSeatsFirstVal && _dpPercentsFirstVal) {
+        const originalDpPrice = Array.isArray(serviceItem.original_dp_price)
+            ? serviceItem.original_dp_price[0]
+            : Object.values(serviceItem.original_dp_price || {})[0];
+        const dpDiscountPercent = Array.isArray(serviceItem.dp_discount_percents)
+            ? serviceItem.dp_discount_percents[0]
+            : Object.values(serviceItem.dp_discount_percents || {})[0];
+        const seatTypeFare = (_b = (_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.fare;
+        if (originalDpPrice && seatTypeFare) {
+            return (React.createElement("div", { className: "grid grid-cols-2 items-center text-[13.33px] relative" },
+                React.createElement("div", { className: "col-start-1 row-start-2 flex items-center" },
+                    React.createElement("span", { className: "text-[13.33px] font-normal leading-[22px] text-[#ccc]" }, "Antes")),
+                React.createElement("div", { className: "col-start-1 row-start-3 flex h-[20px] items-end" },
+                    React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#464647]" }, "Desde")),
+                React.createElement("div", { className: "col-start-2 row-start-1 flex items-center justify-center absolute", style: { top: "-22px", left: "50%", transform: "translateX(-50%)" } }, !isNaN(Number(dpDiscountPercent)) &&
+                    Number(dpDiscountPercent) > 0 && (React.createElement("span", { className: "rounded-[100px] bg-[#ff5964] px-[6px] text-[12px] bold-text leading-[20px] text-white", style: {
+                        animation: "pulse-zoom 2s ease-in-out infinite",
+                        whiteSpace: "nowrap",
+                    } },
+                    Math.round(Number(dpDiscountPercent)),
+                    "% OFF"))),
+                React.createElement("div", { className: "col-start-2 row-start-2 flex items-center justify-center", style: { textAlign: "center" } },
+                    React.createElement("span", { className: "text-[13.33px] font-normal leading-[20px] text-[#9f9f9f] relative", style: { position: "relative" } },
+                        formatPrice(Number(originalDpPrice)),
+                        React.createElement("span", { style: {
+                                position: "absolute",
+                                left: "-2px",
+                                top: "50%",
+                                width: "calc(100% + 4px)",
+                                height: "1px",
+                                backgroundColor: "#9f9f9f",
+                                transform: "rotate(-10deg)",
+                                transformOrigin: "center",
+                            } }))),
+                React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
+                    React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : "#ff5964" } },
+                        React.createElement("div", { className: "absolute", style: { left: isPeru ? "-1px" : "-8px" } }, renderIcon("fireIcon", "16px")),
+                        availableSeats <= 0
+                            ? CommonService.currency(0, currencySign)
+                            : CommonService.discountedCurrency(Number(seatTypeFare), currencySign)))));
+        }
+    }
     if (hasDiscount && discountSeat) {
         return (React.createElement("div", { className: "grid grid-cols-2 items-center text-[13.33px] relative" },
             React.createElement("div", { className: "col-start-1 row-start-2 flex items-center" },

package/dist/ui/Survey/FeedbackBanner.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { FeedbackConfig } from "./constants";
+interface FeedbackBannerProps {
+    config: FeedbackConfig | null;
+}
+declare const FeedbackBanner: ({ config }: FeedbackBannerProps) => React.JSX.Element;
+export default FeedbackBanner;

package/dist/ui/Survey/FeedbackBanner.js

@@ -0,0 +1,21 @@
+import React from "react";
+const FeedbackBanner = ({ config }) => {
+    if (!config)
+        return null;
+    return (React.createElement("div", { style: {
+            display: "flex",
+            alignItems: "center",
+            gap: 12,
+            borderRadius: 20,
+            padding: "12px 16px",
+            marginTop: 16,
+            backgroundColor: config.bannerBg,
+        } },
+        React.createElement("span", { style: { fontSize: 22 } }, config.emoji),
+        React.createElement("span", { style: {
+                fontWeight: 600,
+                fontSize: "13.33px",
+                color: config.bannerText,
+            } }, config.message)));
+};
+export default FeedbackBanner;

package/dist/ui/Survey/FeedbackTextarea.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FeedbackConfig } from "./constants";
+interface FeedbackTextareaProps {
+    config: FeedbackConfig | null;
+    feedback: string;
+    onFeedbackChange?: (text: string) => void;
+}
+declare const FeedbackTextarea: ({ config, feedback, onFeedbackChange, }: FeedbackTextareaProps) => React.JSX.Element;
+export default FeedbackTextarea;

package/dist/ui/Survey/FeedbackTextarea.js

@@ -0,0 +1,53 @@
+import React from "react";
+import { MAX_CHARS } from "./constants";
+const FeedbackTextarea = ({ config, feedback, onFeedbackChange, }) => {
+    if (!config)
+        return null;
+    return (React.createElement("div", { style: { marginTop: 16 } },
+        React.createElement("div", { style: {
+                display: "flex",
+                alignItems: "center",
+                gap: 8,
+                marginBottom: 8,
+            } },
+            React.createElement("span", { style: { fontWeight: 700, color: "#111827", fontSize: "13.33px" } }, config.question),
+            React.createElement("span", { style: {
+                    fontSize: 12,
+                    color: "#6B7280",
+                    background: "#F3F4F6",
+                    borderRadius: 6,
+                    padding: "2px 8px",
+                } }, "Opcional")),
+        React.createElement("div", { style: {
+                border: "1.5px solid #E5E7EB",
+                borderRadius: 14,
+                overflow: "hidden",
+                position: "relative",
+            } },
+            React.createElement("textarea", { value: feedback, onChange: (e) => {
+                    if (e.target.value.length <= MAX_CHARS)
+                        onFeedbackChange === null || onFeedbackChange === void 0 ? void 0 : onFeedbackChange(e.target.value);
+                }, placeholder: config.placeholder, rows: 4, style: {
+                    width: "100%",
+                    padding: "12px 12px 28px",
+                    background: "transparent",
+                    color: "#374151",
+                    fontSize: "13.33px",
+                    resize: "none",
+                    outline: "none",
+                    border: "none",
+                    boxSizing: "border-box",
+                    fontFamily: "inherit",
+                } }),
+            React.createElement("div", { style: {
+                    position: "absolute",
+                    bottom: 8,
+                    right: 12,
+                    fontSize: 12,
+                    color: "#9CA3AF",
+                } },
+                feedback.length,
+                " / ",
+                MAX_CHARS))));
+};
+export default FeedbackTextarea;

package/dist/ui/Survey/HeartIcon.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const HeartIcon: () => React.JSX.Element;
+export default HeartIcon;