kupos-ui-components-lib 9.3.7 → 9.3.9

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.
Files changed (12) hide show
  1. package/dist/components/ServiceItem/ServiceItemDesktop.js +1 -1
  2. package/dist/components/ServiceItem/ServiceItemMobile.js +4 -4
  3. package/dist/styles.css +5 -5
  4. package/dist/ui/SeatSection/SeatSection.js +2 -2
  5. package/dist/ui/mobileweb/SeatSectionMobile.js +3 -3
  6. package/dist/ui/mobileweb/ServiceBadgesMobile.js +1 -1
  7. package/package.json +1 -1
  8. package/src/components/ServiceItem/ServiceItemDesktop.tsx +1 -1
  9. package/src/components/ServiceItem/ServiceItemMobile.tsx +4 -4
  10. package/src/ui/SeatSection/SeatSection.tsx +2 -2
  11. package/src/ui/mobileweb/SeatSectionMobile.tsx +3 -3
  12. package/src/ui/mobileweb/ServiceBadgesMobile.tsx +1 -1
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -318,7 +318,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
318
318
  " |",
319
319
  " ",
320
320
  React.createElement("span", { className: "" },
321
- "Quedan pocos.",
321
+ "Quedan pocos \u2022",
322
322
  " ",
323
323
  React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
324
324
  " ",
package/dist/components/ServiceItem/ServiceItemMobile.js CHANGED
@@ -34,7 +34,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
34
34
  ? {
35
35
  borderColor: "transparent",
36
36
  borderStyle: "solid",
37
- borderWidth: "6px 6px 0 6px",
37
+ borderWidth: "3px 3px 0 3px",
38
38
  borderRadius: "18px",
39
39
  background: `linear-gradient(#fff, #fff) padding-box, ${offerGradient} border-box`,
40
40
  }
@@ -112,7 +112,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
112
112
  showLastSeats ? (React.createElement("div", { className: "flex justify-end " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
113
113
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[10px] text-[#464647] text-center" }, "\u00A1 \u00DAltimos Asientos!")))) : null),
114
114
  React.createElement(DateTimeSectionMobile, { onBookButtonPress: onBookButtonPress, isCiva: isCiva, isSoldOut: isSoldOut, isLinatal: isLinatal, isPeru: isPeru, orignLabel: orignLabel, destinationLabel: destinationLabel, originIcon: (_c = serviceItem.icons) === null || _c === void 0 ? void 0 : _c.origin, destinationIcon: (_d = serviceItem.icons) === null || _d === void 0 ? void 0 : _d.destination, travelDate: serviceItem.travel_date, arrivalDate: serviceItem.arrival_date, depTime: serviceItem.dep_time, arrTime: serviceItem.arr_time, seatTypes: serviceItem.seat_types, seatPriceColor: colors.seatPriceColor, tooltipBgColor: colors.tooltipBgColor, currencySign: currencySign, availableSeats: serviceItem.available_seats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem }),
115
- React.createElement("div", { className: "bg-[#E6E6E6] mt-[10px] mb-[10px] h-[1px]" }),
115
+ React.createElement("div", { className: "bg-[#E6E6E6] mt-[10px] mb-[8px] h-[1px]" }),
116
116
  React.createElement(BottomAmenitiesMobile, { isSoldOut: isSoldOut, amenitiesNodes: amenities(), hoursIcon: renderIcon("hours", "14px"), duration: (_e = serviceItem.duration) === null || _e === void 0 ? void 0 : _e.toString(), isDirectTrip: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip, directoColor: colors.directoColor, directoAnim: serviceItem.icons.directoAnim, isChangeTicket: serviceItem.is_change_ticket, isPetSeat: isPetSeat, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, flexibleAnim: serviceItem.icons.flexibleAnim, isTrackingEnabled: serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled, locationAnim: serviceItem.icons.locationAnim, downArrowIcon: serviceItem.icons.downArrow, showDropdown: isItemExpanded, setShowDropdown: () => setIsExpanded(isItemExpanded ? null : serviceItem.id), onDropdownToggle: () => {
117
117
  setIsExpanded(isItemExpanded ? null : serviceItem.id);
118
118
  }, isPeru: isPeru })),
@@ -124,7 +124,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
124
124
  zIndex: -1,
125
125
  } },
126
126
  React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
127
- React.createElement("div", { className: "flex justify-between items-start" },
127
+ React.createElement("div", { className: "flex justify-between items-center" },
128
128
  React.createElement("div", { className: `flex ${((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 10 ? "items-start" : "items-center"}` },
129
129
  React.createElement("div", { className: isLongOfferText ? "mt-[2px]" : "" },
130
130
  React.createElement(LottiePlayer, { animationData: serviceItem.icons.bombAnim, width: "14px", height: "14px" })),
@@ -155,7 +155,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
155
155
  "viendo"))),
156
156
  React.createElement("div", { className: "flex items-center" },
157
157
  React.createElement("span", { className: "whitespace-nowrap" },
158
- "Quedan pocos.",
158
+ "Quedan pocos \u2022",
159
159
  " ",
160
160
  React.createElement("span", { className: "bold-text", ref: (node) => commonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
161
161
  " ",
package/dist/styles.css CHANGED
@@ -213,6 +213,9 @@
213
213
  .mb-\[5px\] {
214
214
  margin-bottom: 5px;
215
215
  }
216
+ .mb-\[8px\] {
217
+ margin-bottom: 8px;
218
+ }
216
219
  .mb-\[10px\] {
217
220
  margin-bottom: 10px;
218
221
  }
@@ -490,9 +493,6 @@
490
493
  .justify-end {
491
494
  justify-content: flex-end;
492
495
  }
493
- .justify-start {
494
- justify-content: flex-start;
495
- }
496
496
  .gap-\[1px\] {
497
497
  gap: 1px;
498
498
  }
@@ -778,8 +778,8 @@
778
778
  .pr-\[15px\] {
779
779
  padding-right: 15px;
780
780
  }
781
- .pr-\[20px\] {
782
- padding-right: 20px;
781
+ .pr-\[17px\] {
782
+ padding-right: 17px;
783
783
  }
784
784
  .pr-\[22px\] {
785
785
  padding-right: 22px;
package/dist/ui/SeatSection/SeatSection.js CHANGED
@@ -122,7 +122,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
122
122
  React.createElement("span", { className: "text-[13.33px] font-normal leading-[22px] text-[#c2c2c2]" }, "Antes")),
123
123
  React.createElement("div", { className: "col-start-1 row-start-3 flex h-[30px] items-end" },
124
124
  React.createElement("span", { className: "text-[13.33px] font-normal leading-[24px] text-[#464647]" }, "Desde")),
125
- React.createElement("div", { className: "col-start-2 row-start-1 flex items-center justify-center absolute", style: { top: "-22px", right: "30px" } }, discountValue != null && (React.createElement("span", { className: "rounded-[100px] bg-[#ff5964] px-[6px] text-[12px] bold-text leading-[20px] text-white", style: {
125
+ React.createElement("div", { className: "col-start-2 row-start-1 flex items-center justify-center absolute", style: { top: "-22px", right: "25%" } }, discountValue != null && (React.createElement("span", { className: "rounded-[100px] bg-[#ff5964] px-[6px] text-[12px] bold-text leading-[20px] text-white", style: {
126
126
  animation: "pulse-zoom 2s ease-in-out infinite",
127
127
  } },
128
128
  discountValue,
@@ -142,7 +142,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
142
142
  transform: "rotate(-10deg)",
143
143
  transformOrigin: "center",
144
144
  } }))),
145
- React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-start" },
145
+ React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center" },
146
146
  React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : "#ff5964" } },
147
147
  renderIcon("fireIcon", "16px"),
148
148
  availableSeats <= 0
package/dist/ui/mobileweb/SeatSectionMobile.js CHANGED
@@ -120,12 +120,12 @@ function SeatSectionMobile({ seatTypes: seatTypesData, isSoldOut, isPeru, seatPr
120
120
  commonService.currency(discountSeat.originalPrice, currencySign),
121
121
  React.createElement("span", { style: {
122
122
  position: "absolute",
123
- top: "50%",
124
- left: "25%",
123
+ top: "35%",
124
+ left: "50%",
125
125
  width: "80%",
126
126
  height: "1px",
127
127
  background: "#9f9f9f",
128
- transform: "rotate(-15deg)",
128
+ transform: "rotate(-12deg)",
129
129
  transformOrigin: "center",
130
130
  } })),
131
131
  React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] leading-[24px]", style: { color: isSoldOut ? "#bbb" : "#464647" } }, "Desde"),
package/dist/ui/mobileweb/ServiceBadgesMobile.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  const ServiceBadgesMobile = ({ showTopLabel, isSoldOut, colors, renderIcon, serviceItem, isConexion, }) => {
3
- return (React.createElement("div", { className: "absolute -top-[9px] left-0 w-full flex items-center justify-end gap-[12px] pr-[20px] z-10" },
3
+ return (React.createElement("div", { className: "absolute -top-[9px] left-0 w-full flex items-center justify-end gap-[12px] pr-[17px] z-10" },
4
4
  showTopLabel && (React.createElement("div", { className: `flex items-center gap-[2px] py-[4px] px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] z-20`, style: {
5
5
  backgroundColor: "#fff",
6
6
  border: `1px solid ${colors.topLabelColor}`,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "9.3.7",
3
+ "version": "9.3.9",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -653,7 +653,7 @@ function ServiceItemPB({
653
653
  {" "}
654
654
  {viewersConfig?.label || " viendo"} |{" "}
655
655
  <span className="">
656
- Quedan pocos.{" "}
656
+ Quedan pocos •{" "}
657
657
  <span
658
658
  className="bold-text"
659
659
  ref={(node) =>
package/src/components/ServiceItem/ServiceItemMobile.tsx CHANGED
@@ -74,7 +74,7 @@ function ServiceItemMobile({
74
74
  ? {
75
75
  borderColor: "transparent",
76
76
  borderStyle: "solid",
77
- borderWidth: "6px 6px 0 6px",
77
+ borderWidth: "3px 3px 0 3px",
78
78
  borderRadius: "18px",
79
79
  background: `linear-gradient(#fff, #fff) padding-box, ${offerGradient} border-box`,
80
80
  }
@@ -256,7 +256,7 @@ function ServiceItemMobile({
256
256
  serviceItem={serviceItem}
257
257
  />
258
258
  {/* <div className="bg-[#E6E6E6] -ml-[12px] -mr-[12px] mt-[10px] mb-[10px] h-[1px]"></div> */}
259
- <div className="bg-[#E6E6E6] mt-[10px] mb-[10px] h-[1px]"></div>
259
+ <div className="bg-[#E6E6E6] mt-[10px] mb-[8px] h-[1px]"></div>
260
260
 
261
261
  <BottomAmenitiesMobile
262
262
  isSoldOut={isSoldOut}
@@ -310,7 +310,7 @@ function ServiceItemMobile({
310
310
  className="flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]"
311
311
  style={{ lineHeight: 1.6 }}
312
312
  >
313
- <div className="flex justify-between items-start">
313
+ <div className="flex justify-between items-center">
314
314
  <div
315
315
  className={`flex ${(serviceItem?.offer_text || "").length > 10 ? "items-start" : "items-center"}`}
316
316
  >
@@ -380,7 +380,7 @@ function ServiceItemMobile({
380
380
  </div>
381
381
  <div className="flex items-center">
382
382
  <span className="whitespace-nowrap">
383
- Quedan pocos.{" "}
383
+ Quedan pocos •{" "}
384
384
  <span
385
385
  className="bold-text"
386
386
  ref={(node) =>
package/src/ui/SeatSection/SeatSection.tsx CHANGED
@@ -237,7 +237,7 @@ function SeatSection({
237
237
 
238
238
  <div
239
239
  className="col-start-2 row-start-1 flex items-center justify-center absolute"
240
- style={{ top: "-22px", right: "30px" }}
240
+ style={{ top: "-22px", right: "25%" }}
241
241
  >
242
242
  {discountValue != null && (
243
243
  <span
@@ -277,7 +277,7 @@ function SeatSection({
277
277
  </span>
278
278
  </div>
279
279
 
280
- <div className="col-start-2 row-start-3 flex h-[30px] items-end justify-start">
280
+ <div className="col-start-2 row-start-3 flex h-[30px] items-end justify-center">
281
281
  <span
282
282
  className="flex items-center gap-[6px] text-[22px] bold-text leading-[30px]"
283
283
  style={{ color: isSoldOut ? "#c0c0c0" : "#ff5964" }}
package/src/ui/mobileweb/SeatSectionMobile.tsx CHANGED
@@ -297,12 +297,12 @@ function SeatSectionMobile({
297
297
  <span
298
298
  style={{
299
299
  position: "absolute",
300
- top: "50%",
301
- left: "25%",
300
+ top: "35%",
301
+ left: "50%",
302
302
  width: "80%",
303
303
  height: "1px",
304
304
  background: "#9f9f9f",
305
- transform: "rotate(-15deg)",
305
+ transform: "rotate(-12deg)",
306
306
  transformOrigin: "center",
307
307
  }}
308
308
  />
package/src/ui/mobileweb/ServiceBadgesMobile.tsx CHANGED
@@ -24,7 +24,7 @@ const ServiceBadgesMobile: React.FC<ServiceBadgesMobileProps> = ({
24
24
  isConexion,
25
25
  }) => {
26
26
  return (
27
- <div className="absolute -top-[9px] left-0 w-full flex items-center justify-end gap-[12px] pr-[20px] z-10">
27
+ <div className="absolute -top-[9px] left-0 w-full flex items-center justify-end gap-[12px] pr-[17px] z-10">
28
28
  {showTopLabel && (
29
29
  <div
30
30
  className={`flex items-center gap-[2px] py-[4px] px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] z-20`}