kupos-ui-components-lib 7.0.2 → 7.0.3

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 (6) hide show
  1. package/dist/components/ServiceItem/PeruServiceItemDesktop.js +1 -1
  2. package/dist/components/ServiceItem/ServiceItemMobile.js +11 -10
  3. package/dist/styles.css +3 -5
  4. package/package.json +1 -1
  5. package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +3 -3
  6. package/src/components/ServiceItem/ServiceItemMobile.tsx +12 -11
package/dist/components/ServiceItem/PeruServiceItemDesktop.js CHANGED
@@ -583,7 +583,7 @@ function PeruServiceItemDesktop({ serviceItem, onBookButtonPress, colors, metaDa
583
583
  serviceItem.available_seats,
584
584
  " ",
585
585
  "Asientos restantes")) : (React.createElement("div", { className: "flex items-center " },
586
- React.createElement("div", { className: `flex items-center ${isSoldOut ? "grayscale" : ""} ${showRating ? "cursor-pointer" : ""}`, style: { color: isSoldOut ? "#c0c0c0" : "" } },
586
+ React.createElement("div", { className: `flex items-center ${showRating ? "cursor-pointer" : ""}`, style: { color: isSoldOut ? "#c0c0c0" : "" } },
587
587
  showRating ? (React.createElement(RatingHover, { serviceItem: serviceItem, isSoldOut: isSoldOut, colors: colors, t: t, translation: translation })) : null,
588
588
  React.createElement("span", { className: "ml-[10px] text-[#464647] text-[13.33px]", style: { marginLeft: showRating ? "10px" : "0" } }, serviceItem.operator_details[2])))),
589
589
  serviceItem.duration && (React.createElement("div", { className: "flex items-baseline relative text-[#464647]" },
package/dist/components/ServiceItem/ServiceItemMobile.js CHANGED
@@ -43,11 +43,11 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
43
43
  return exceptions.includes(type.label) ? null : (React.createElement("div", { className: ((_a = serviceItem.seat_types) === null || _a === void 0 ? void 0 : _a.length) > 2
44
44
  ? "w-[100%] flex flex-row justify-between "
45
45
  : "w-[100%] flex flex-row justify-between items-center", key: i },
46
- React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] ", style: {
46
+ React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] ", style: {
47
47
  // marginLeft: "10px",
48
48
  color: isSoldOut ? "#bbb" : "#464647",
49
49
  } }, type.label),
50
- React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] bold-text", style: { color: isSoldOut ? "#bbb" : colors.seatPriceColor } }, commonService.currency(type.fare, currencySign))));
50
+ React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] bold-text", style: { color: isSoldOut ? "#bbb" : colors.seatPriceColor } }, commonService.currency(type.fare, currencySign))));
51
51
  });
52
52
  return seatTypes;
53
53
  };
@@ -225,7 +225,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
225
225
  else {
226
226
  cleanedDepTime = timePart;
227
227
  }
228
- return (React.createElement("div", { className: `relative ${serviceItem.offer_text ? "mb-[55px]" : "mb-[20px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
228
+ return (React.createElement("div", { className: `relative ${serviceItem.offer_text ? "mb-[55px]" : "mb-[14px]"} ${(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_direct_trip) ||
229
229
  isConexion ||
230
230
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.train_type_label) === "Tren Express (Nuevo)" ||
231
231
  showTopLabel
@@ -242,7 +242,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
242
242
  React.createElement("div", { className: "flex items-center w-[50%] justify-between" },
243
243
  React.createElement("div", { className: "w-[120px] overflow-y-hidden" },
244
244
  React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: `w-[100px] h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
245
- isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[11px] text-[11px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[11px] bold-text items-center" },
245
+ isCiva ? (React.createElement("div", { className: "black-text min-[420]:text-[12px] text-[12px]" }, serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.operator_details[2])) : showRating ? (React.createElement("div", { className: "flex min-[420]:text-[13px] text-[12px] bold-text items-center" },
246
246
  React.createElement("img", { src: serviceItem.icons.rating, alt: "origin", className: `w-[12px] h-[12px] mr-[4px] object-contain ${isSoldOut ? "grayscale" : ""}` }),
247
247
  React.createElement("span", { style: { lineHeight: "normal" } }, getServiceStars(serviceItem)))) : null),
248
248
  showLastSeats ? (React.createElement("div", { className: "flex justify-end -mt-[5px] -mb-[5px] items-center pt-[5px] pb-[5px] text-center " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
@@ -252,7 +252,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
252
252
  } }, "\u00A1 \u00DAltimos Asientos!")))) : null),
253
253
  React.createElement("div", { className: "flex justify-between gap-[5px] w-full", onClick: onBookButtonPress },
254
254
  React.createElement("div", { className: "min-h-[2.5rem] flex flex-col justify-between gap-[4px] w-[50%] ", style: { justifyContent: isCiva && "center" } },
255
- React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[11px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
255
+ React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[12px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
256
256
  React.createElement("div", { className: "flex items-center", style: { flex: 1 } },
257
257
  React.createElement("div", null,
258
258
  " ",
@@ -271,7 +271,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
271
271
  (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dep_time.includes("PM"))
272
272
  ? null
273
273
  : DateService.ampmOnly(serviceItem.dep_time)))) : (DateService.formatTime(serviceItem.dep_time)))))),
274
- isCiva ? null : (React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[11px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
274
+ isCiva ? null : (React.createElement("div", { className: `flex items-center min-[420]:text-[13px] text-[12px] justify-between ${isSoldOut ? "text-[#c0c0c0]" : ""}` },
275
275
  React.createElement("div", { className: "flex items-center", style: { flex: 1 } },
276
276
  React.createElement("div", null,
277
277
  " ",
@@ -300,16 +300,17 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
300
300
  ? seatTypesWithRemoveDuplicateSeats()
301
301
  : seatTypes(),
302
302
  isSoldOut ? (React.createElement("div", { className: "flex justify-end" },
303
- React.createElement("span", { className: "min-[420]:text-[13px] text-[11px] text-[#ccc]" }, "Agotado"))) : null))),
303
+ React.createElement("span", { className: "min-[420]:text-[13px] text-[12px] text-[#ccc]" }, "Agotado"))) : null))),
304
304
  React.createElement("div", { className: "bg-[#E6E6E6] -ml-[12px] -mr-[12px] mt-[10px] mb-[10px] h-[1px]" }),
305
305
  React.createElement("div", { className: `${"flex justify-between items-center items-center "}` },
306
306
  React.createElement("div", null,
307
307
  React.createElement("div", { className: "flex items-center " },
308
308
  React.createElement("div", { className: "flex items-center cursor-pointer ", style: { color: isSoldOut ? "#bbb" : "text-[#464647]" } },
309
- React.createElement("span", { className: "ml-[3px] min-[420]:text-[13px] text-[11px] bold-text" }, serviceItem.operator_details[2])))),
309
+ React.createElement("span", { className: "ml-[3px] min-[420]:text-[13px] text-[12px] bold-text" }, serviceItem.operator_details[2])))),
310
310
  React.createElement("div", { className: "flex relative ", style: { color: isSoldOut ? "#bbb" : "text-[#464647]" } },
311
311
  React.createElement("div", { className: `w-[12px] h-auto mr-[2px] ${isSoldOut ? "grayscale" : ""}` }, renderIcon("hours", "14px")),
312
- React.createElement("div", { className: `cursor-default group min-[420]:text-[13px] text-[11px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: { lineHeight: "normal" } },
312
+ "\u00A0",
313
+ React.createElement("div", { className: `cursor-default group min-[420]:text-[13px] text-[12px] ${isSoldOut ? "text-[#c0c0c0]" : ""}`, style: { lineHeight: "normal" } },
313
314
  serviceItem.duration,
314
315
  "hrs")),
315
316
  React.createElement("div", { style: { opacity: isSoldOut ? 0.5 : 1 } }, amenities()),
@@ -351,7 +352,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
351
352
  React.createElement("div", { className: isSoldOut ? "grayscale" : "" },
352
353
  React.createElement(LottiePlayer, { animationData: serviceItem.icons.priorityStageAnim, width: "18px", height: "18px" })),
353
354
  React.createElement("div", { className: isSoldOut ? "text-[#bbb]" : `text-[${colors.topLabelColor}]` }, showTopLabel))),
354
- isConexion && (React.createElement("div", { className: `flex items-center gap-[2px] py-[5px] text-white px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] z-20 ${isSoldOut ? "text-white" : `text-[${colors.topLabelColor}]`}`, style: {
355
+ isConexion && (React.createElement("div", { className: `flex items-center gap-[2px] py-[5px] text-white px-[10px] rounded-[38px] min-[420]:text-[12px] text-[11px] z-20 ${isSoldOut ? "text-white" : `text-[${colors.topLabelColor}]`}`, style: {
355
356
  backgroundColor: !isSoldOut && colors.ratingBottomColor,
356
357
  } },
357
358
  renderIcon("airportIcon", "14px"),
package/dist/styles.css CHANGED
@@ -222,6 +222,9 @@
222
222
  .mb-\[10px\] {
223
223
  margin-bottom: 10px;
224
224
  }
225
+ .mb-\[14px\] {
226
+ margin-bottom: 14px;
227
+ }
225
228
  .mb-\[15px\] {
226
229
  margin-bottom: 15px;
227
230
  }
@@ -872,11 +875,6 @@
872
875
  }
873
876
  }
874
877
  }
875
- .min-\[420\]\:text-\[11px\] {
876
- @media (width >= 420) {
877
- font-size: 11px;
878
- }
879
- }
880
878
  .min-\[420\]\:text-\[12px\] {
881
879
  @media (width >= 420) {
882
880
  font-size: 12px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "7.0.2",
3
+ "version": "7.0.3",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/PeruServiceItemDesktop.tsx CHANGED
@@ -1019,9 +1019,9 @@ function PeruServiceItemDesktop({
1019
1019
  ) : (
1020
1020
  <div className="flex items-center ">
1021
1021
  <div
1022
- className={`flex items-center ${
1023
- isSoldOut ? "grayscale" : ""
1024
- } ${showRating ? "cursor-pointer" : ""}`}
1022
+ className={`flex items-center ${
1023
+ showRating ? "cursor-pointer" : ""
1024
+ }`}
1025
1025
  style={{ color: isSoldOut ? "#c0c0c0" : "" }}
1026
1026
  >
1027
1027
  {showRating ? (
package/src/components/ServiceItem/ServiceItemMobile.tsx CHANGED
@@ -77,7 +77,7 @@ function ServiceItemMobile({
77
77
  key={i}
78
78
  >
79
79
  <span
80
- className="min-[420]:text-[13px] text-[11px] "
80
+ className="min-[420]:text-[13px] text-[12px] "
81
81
  style={{
82
82
  // marginLeft: "10px",
83
83
  color: isSoldOut ? "#bbb" : "#464647",
@@ -86,7 +86,7 @@ function ServiceItemMobile({
86
86
  {type.label}
87
87
  </span>
88
88
  <span
89
- className={"min-[420]:text-[13px] text-[11px] bold-text"}
89
+ className={"min-[420]:text-[13px] text-[12px] bold-text"}
90
90
  style={{ color: isSoldOut ? "#bbb" : colors.seatPriceColor }}
91
91
  >
92
92
  {commonService.currency(type.fare, currencySign)}
@@ -322,7 +322,7 @@ function ServiceItemMobile({
322
322
  return (
323
323
  <div
324
324
  className={`relative ${
325
- serviceItem.offer_text ? "mb-[55px]" : "mb-[20px]"
325
+ serviceItem.offer_text ? "mb-[55px]" : "mb-[14px]"
326
326
  } ${
327
327
  serviceItem?.is_direct_trip ||
328
328
  isConexion ||
@@ -360,11 +360,11 @@ function ServiceItemMobile({
360
360
  />
361
361
  </div>
362
362
  {isCiva ? (
363
- <div className="black-text min-[420]:text-[11px] text-[11px]">
363
+ <div className="black-text min-[420]:text-[12px] text-[12px]">
364
364
  {serviceItem?.operator_details[2]}
365
365
  </div>
366
366
  ) : showRating ? (
367
- <div className="flex min-[420]:text-[13px] text-[11px] bold-text items-center">
367
+ <div className="flex min-[420]:text-[13px] text-[12px] bold-text items-center">
368
368
  <img
369
369
  src={serviceItem.icons.rating}
370
370
  alt="origin"
@@ -406,7 +406,7 @@ function ServiceItemMobile({
406
406
  style={{ justifyContent: isCiva && "center" }}
407
407
  >
408
408
  <div
409
- className={`flex items-center min-[420]:text-[13px] text-[11px] justify-between ${
409
+ className={`flex items-center min-[420]:text-[13px] text-[12px] justify-between ${
410
410
  isSoldOut ? "text-[#c0c0c0]" : ""
411
411
  }`}
412
412
  >
@@ -459,7 +459,7 @@ function ServiceItemMobile({
459
459
  </div>
460
460
  {isCiva ? null : (
461
461
  <div
462
- className={`flex items-center min-[420]:text-[13px] text-[11px] justify-between ${
462
+ className={`flex items-center min-[420]:text-[13px] text-[12px] justify-between ${
463
463
  isSoldOut ? "text-[#c0c0c0]" : ""
464
464
  }`}
465
465
  >
@@ -531,7 +531,7 @@ function ServiceItemMobile({
531
531
  <div className="flex justify-end">
532
532
  <span
533
533
  className={
534
- "min-[420]:text-[13px] text-[11px] text-[#ccc]"
534
+ "min-[420]:text-[13px] text-[12px] text-[#ccc]"
535
535
  }
536
536
  >
537
537
  Agotado
@@ -552,7 +552,7 @@ function ServiceItemMobile({
552
552
  className="flex items-center cursor-pointer "
553
553
  style={{ color: isSoldOut ? "#bbb" : "text-[#464647]" }}
554
554
  >
555
- <span className="ml-[3px] min-[420]:text-[13px] text-[11px] bold-text">
555
+ <span className="ml-[3px] min-[420]:text-[13px] text-[12px] bold-text">
556
556
  {serviceItem.operator_details[2]}
557
557
  </span>
558
558
  </div>
@@ -570,8 +570,9 @@ function ServiceItemMobile({
570
570
  >
571
571
  {renderIcon("hours", "14px")}
572
572
  </div>
573
+ &nbsp;
573
574
  <div
574
- className={`cursor-default group min-[420]:text-[13px] text-[11px] ${
575
+ className={`cursor-default group min-[420]:text-[13px] text-[12px] ${
575
576
  isSoldOut ? "text-[#c0c0c0]" : ""
576
577
  }`}
577
578
  style={{ lineHeight: "normal" }}
@@ -704,7 +705,7 @@ function ServiceItemMobile({
704
705
 
705
706
  {isConexion && (
706
707
  <div
707
- className={`flex items-center gap-[2px] py-[5px] text-white px-[10px] rounded-[38px] min-[420]:text-[12px] text-[10px] z-20 ${
708
+ className={`flex items-center gap-[2px] py-[5px] text-white px-[10px] rounded-[38px] min-[420]:text-[12px] text-[11px] z-20 ${
708
709
  isSoldOut ? "text-white" : `text-[${colors.topLabelColor}]`
709
710
  }`}
710
711
  style={{