kupos-ui-components-lib 10.2.2 → 10.2.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 (15) hide show
  1. package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js +2 -2
  2. package/dist/components/PaymentSideBar/PaymentSideBarMobile.js +2 -2
  3. package/dist/components/ServiceItem/ServiceItemDesktop.js +1 -1
  4. package/dist/styles.css +3 -3
  5. package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +1 -3
  6. package/dist/ui/OfferBanner.d.ts +1 -0
  7. package/dist/ui/OfferBanner.js +2 -2
  8. package/dist/ui/mobileweb/ExpandedDropdownMobile.js +1 -3
  9. package/package.json +1 -1
  10. package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx +2 -0
  11. package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx +2 -0
  12. package/src/components/ServiceItem/ServiceItemDesktop.tsx +1 -0
  13. package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +5 -2
  14. package/src/ui/OfferBanner.tsx +3 -1
  15. package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +5 -2
package/dist/components/PaymentSideBar/PaymentSideBarDesktop.js CHANGED
@@ -421,7 +421,7 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
421
421
  width: "15px",
422
422
  } }),
423
423
  React.createElement("div", { className: "duration-mouseover font9", style: { lineHeight: "1.3" } },
424
- React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true })) : null,
424
+ React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true, currency: currency })) : null,
425
425
  metaData &&
426
426
  isOpsite &&
427
427
  metaData.opsite_whatsapp_delivery_charges &&
@@ -435,7 +435,7 @@ const PaymentSideBarDesktop = ({ serviceNameOnward, serviceNameReturn, metaData,
435
435
  width: "15px",
436
436
  } }),
437
437
  React.createElement("div", { className: "duration-mouseover font9", style: { lineHeight: "1.3" } },
438
- React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.opsite_whatsapp_delivery_charges, className: "font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true })) : null,
438
+ React.createElement("span", null, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.opsite_whatsapp_delivery_charges, className: "font10", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true, currency: currency })) : null,
439
439
  removeDiscountAtomValue && (React.createElement(PaymentItem, { label: "Cup\u00F3n", amount: CommonService.currency(netFare, currencySign), isNegative: true, currency: "", isBoldText: true })),
440
440
  React.createElement("div", { style: { margin: "6px 0" } }, renderDiscount(discountAmount)),
441
441
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCodeApplied) && (React.createElement(React.Fragment, null,
package/dist/components/PaymentSideBar/PaymentSideBarMobile.js CHANGED
@@ -206,7 +206,7 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
206
206
  lineHeight: "1.3",
207
207
  backgroundColor: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesBgColor,
208
208
  color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesTextColor,
209
- } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor } })) : null,
209
+ } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, currency: currency })) : null,
210
210
  metaData &&
211
211
  isOpsite &&
212
212
  metaData.opsite_whatsapp_delivery_charges &&
@@ -222,7 +222,7 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
222
222
  lineHeight: "1.3",
223
223
  backgroundColor: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesBgColor,
224
224
  color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesTextColor,
225
- } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.opsite_whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true })) : null,
225
+ } }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.opsite_whatsapp_delivery_charges, className: "text-[14px]", customStyle: { color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor }, isBoldText: true, currency: currency })) : null,
226
226
  (promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCodeApplied) && (React.createElement(React.Fragment, null,
227
227
  React.createElement(PaymentItem, { label: `${translation === null || translation === void 0 ? void 0 : translation.promotionalCode}:`, amount: CommonService.currency((promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount)
228
228
  ? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -298,7 +298,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
298
298
  showTopLabel
299
299
  ? "mt-[25px]"
300
300
  : "mt-[20px]"} ` },
301
- ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDpEnabled) && !isSoldOut && (React.createElement(OfferBanner, { offerGradient: offerGradient, isSoldOut: isSoldOut, serviceItem: serviceItem, renderIcon: renderIcon, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, viewersConfig: viewersConfig, getAnimationIcon: getAnimationIcon, showLoginOption: showLoginOption, isNewUiEnabled: isNewUiEnabled, colors: colors, isLinatal: isLinatal, coachKey: coachKey })),
301
+ ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || hasDpEnabled) && !isSoldOut && (React.createElement(OfferBanner, { offerGradient: offerGradient, isSoldOut: isSoldOut, serviceItem: serviceItem, renderIcon: renderIcon, isLoggedIn: isLoggedIn, showLoginModal: showLoginModal, viewersConfig: viewersConfig, getAnimationIcon: getAnimationIcon, showLoginOption: showLoginOption, isNewUiEnabled: isNewUiEnabled, colors: colors, isLinatal: isLinatal, coachKey: coachKey, isExpand: isExpand })),
302
302
  React.createElement("div", { id: `service-card-${serviceItem.id}`, className: `bg-white mx-auto relative ${((hasOfferText && isNewUiEnabled) || hasDpEnabled) && !isSoldOut
303
303
  ? "z-[3] rounded-[18px]"
304
304
  : "rounded-[10px] border border-[#ccc]"}`, style: serviceCardStyle },
package/dist/styles.css CHANGED
@@ -81,9 +81,6 @@
81
81
  .right-\[25px\] {
82
82
  right: 25px;
83
83
  }
84
- .-bottom-\[29px\] {
85
- bottom: calc(29px * -1);
86
- }
87
84
  .-bottom-\[30px\] {
88
85
  bottom: calc(30px * -1);
89
86
  }
@@ -96,6 +93,9 @@
96
93
  .-bottom-\[36px\] {
97
94
  bottom: calc(36px * -1);
98
95
  }
96
+ .-bottom-\[40px\] {
97
+ bottom: calc(40px * -1);
98
+ }
99
99
  .bottom-\[11px\] {
100
100
  bottom: 11px;
101
101
  }
package/dist/ui/ExpendedDropDown/ExpandedDropdown.js CHANGED
@@ -41,8 +41,6 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
41
41
  React.createElement("span", null, renderIcon("cancelTicketIcon", "16px")),
42
42
  React.createElement("span", null,
43
43
  React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n:"),
44
- " Tu pasaje puede ser anulado de forma online",
45
- React.createElement("span", { className: "bold-text" }, " hasta 4 horas antes"),
46
- " antes de la salida del bus.")))));
44
+ " Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")))));
47
45
  }
48
46
  export default ExpandedDropdown;
package/dist/ui/OfferBanner.d.ts CHANGED
@@ -18,6 +18,7 @@ interface OfferBannerProps {
18
18
  colors: OfferBannerColors;
19
19
  isLinatal?: boolean;
20
20
  coachKey?: number;
21
+ isExpand?: any;
21
22
  }
22
23
  declare const OfferBanner: React.FC<OfferBannerProps>;
23
24
  export default OfferBanner;
package/dist/ui/OfferBanner.js CHANGED
@@ -56,7 +56,7 @@ const ViewersCount = ({ serviceItem, viewersConfig, getAnimationIcon, }) => {
56
56
  "comprando")))));
57
57
  };
58
58
  // ─── Main Component ───────────────────────────────────────────────────────────
59
- const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, showLoginOption, isNewUiEnabled, colors, isLinatal, coachKey, }) => {
59
+ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, showLoginOption, isNewUiEnabled, colors, isLinatal, coachKey, isExpand, }) => {
60
60
  const isLegacyOffer = !!(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && !isNewUiEnabled && !(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled);
61
61
  const isDpEnabledWithoutDiscounts = (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) && !hasDpDiscounts(serviceItem);
62
62
  const showViewers = isNewUiEnabled || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled);
@@ -74,7 +74,7 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, isLoggedIn, showLo
74
74
  }
75
75
  return null;
76
76
  };
77
- return (React.createElement("div", { className: `text-white w-full absolute ${coachKey ? "-bottom-[29px]" : "-bottom-[32px]"} rounded-b-[14px] text-[14px] h-[58px] flex items-end pb-[7px]`, style: {
77
+ return (React.createElement("div", { className: `text-white w-full absolute ${coachKey ? "-bottom-[32px]" : isExpand ? "-bottom-[32px]" : "-bottom-[40px]"} rounded-b-[14px] text-[14px] h-[58px] flex items-end pb-[7px]`, style: {
78
78
  background,
79
79
  opacity: isSoldOut ? 0.5 : 1,
80
80
  zIndex: isLinatal ? "-1" : "0",
package/dist/ui/mobileweb/ExpandedDropdownMobile.js CHANGED
@@ -48,8 +48,6 @@ function ExpandedDropdownMobile({ serviceItem, isPeru, petSeatInfo, petFriendlyA
48
48
  React.createElement("span", { className: "mt-[3px]" }, renderIcon("cancelTicketIcon", "14px")),
49
49
  React.createElement("span", null,
50
50
  React.createElement("span", { className: "bold-text" }, "Pol\u00EDticas de anulaci\u00F3n:"),
51
- " Tu pasaje puede ser anulado de forma online",
52
- React.createElement("span", { className: "bold-text" }, " hasta 4 horas antes"),
53
- " antes de la salida del bus.")))));
51
+ " Tu pasaje no podr\u00E1 ser anulado por tener una tarifa preferencial.")))));
54
52
  }
55
53
  export default ExpandedDropdownMobile;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "10.2.2",
3
+ "version": "10.2.3",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/PaymentSideBar/PaymentSideBarDesktop.tsx CHANGED
@@ -727,6 +727,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
727
727
  className="font10"
728
728
  customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
729
729
  isBoldText={true}
730
+ currency={currency}
730
731
  />
731
732
  ) : null}
732
733
 
@@ -764,6 +765,7 @@ const PaymentSideBarDesktop: React.FC<PaymentSideBarProps> = ({
764
765
  className="font10"
765
766
  customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
766
767
  isBoldText={true}
768
+ currency={currency}
767
769
  />
768
770
  ) : null}
769
771
 
package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx CHANGED
@@ -506,6 +506,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
506
506
  amount={metaData.whatsapp_delivery_charges}
507
507
  className="text-[14px]"
508
508
  customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
509
+ currency={currency}
509
510
  />
510
511
  ) : null}
511
512
 
@@ -552,6 +553,7 @@ const PaymentSideBarMobile: React.FC<PaymentSideBarProps> = ({
552
553
  className="text-[14px]"
553
554
  customStyle={{ color: colors?.whatsappDeliveryChargesColor }}
554
555
  isBoldText={true}
556
+ currency={currency}
555
557
  />
556
558
  ) : null}
557
559
 
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -558,6 +558,7 @@ function ServiceItemPB({
558
558
  colors={colors}
559
559
  isLinatal={isLinatal}
560
560
  coachKey={coachKey}
561
+ isExpand={isExpand}
561
562
  />
562
563
  )}
563
564
  <div
package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx CHANGED
@@ -64,7 +64,8 @@ function ExpandedDropdown({
64
64
  <span className="bold-text">
65
65
  hasta {serviceItem?.change_ticket_hours || 6} horas antes
66
66
  </span>{" "}
67
- de la salida del bus. El monto será reembolsado a tu billetera&nbsp;
67
+ de la salida del bus. El monto será reembolsado a tu
68
+ billetera&nbsp;
68
69
  {operatorLabel || "kupospay"}.
69
70
  </span>
70
71
  </div>
@@ -107,9 +108,11 @@ function ExpandedDropdown({
107
108
  <span>{renderIcon("cancelTicketIcon", "16px")}</span>
108
109
  <span>
109
110
  <span className="bold-text">Políticas de anulación:</span> Tu pasaje
111
+ no podrá ser anulado por tener una tarifa preferencial.
112
+ {/* Tu pasaje
110
113
  puede ser anulado de forma online
111
114
  <span className="bold-text"> hasta 4 horas antes</span> antes de la
112
- salida del bus.
115
+ salida del bus. */}
113
116
  </span>
114
117
  </div>
115
118
  </div>
package/src/ui/OfferBanner.tsx CHANGED
@@ -31,6 +31,7 @@ interface OfferBannerProps {
31
31
  colors: OfferBannerColors;
32
32
  isLinatal?: boolean;
33
33
  coachKey?: number;
34
+ isExpand?: any;
34
35
  }
35
36
 
36
37
  // ─── Helpers ──────────────────────────────────────────────────────────────────
@@ -212,6 +213,7 @@ const OfferBanner: React.FC<OfferBannerProps> = ({
212
213
  colors,
213
214
  isLinatal,
214
215
  coachKey,
216
+ isExpand,
215
217
  }) => {
216
218
  const isLegacyOffer =
217
219
  !!serviceItem?.offer_text && !isNewUiEnabled && !serviceItem?.is_dp_enabled;
@@ -255,7 +257,7 @@ const OfferBanner: React.FC<OfferBannerProps> = ({
255
257
 
256
258
  return (
257
259
  <div
258
- className={`text-white w-full absolute ${coachKey ? "-bottom-[29px]" : "-bottom-[32px]"} rounded-b-[14px] text-[14px] h-[58px] flex items-end pb-[7px]`}
260
+ className={`text-white w-full absolute ${coachKey ? "-bottom-[32px]" : isExpand ? "-bottom-[32px]" : "-bottom-[40px]"} rounded-b-[14px] text-[14px] h-[58px] flex items-end pb-[7px]`}
259
261
  style={{
260
262
  background,
261
263
  opacity: isSoldOut ? 0.5 : 1,
package/src/ui/mobileweb/ExpandedDropdownMobile.tsx CHANGED
@@ -60,7 +60,8 @@ function ExpandedDropdownMobile({
60
60
  <span className="bold-text">
61
61
  hasta {serviceItem?.change_ticket_hours || 6} horas antes
62
62
  </span>{" "}
63
- de la salida del bus. El monto será reembolsado a tu billetera&nbsp;
63
+ de la salida del bus. El monto será reembolsado a tu
64
+ billetera&nbsp;
64
65
  {operatorLabel || "kupospay"}.
65
66
  </span>
66
67
  </div>
@@ -121,9 +122,11 @@ function ExpandedDropdownMobile({
121
122
  </span>
122
123
  <span>
123
124
  <span className="bold-text">Políticas de anulación:</span> Tu pasaje
125
+ no podrá ser anulado por tener una tarifa preferencial.
126
+ {/* Tu pasaje
124
127
  puede ser anulado de forma online
125
128
  <span className="bold-text"> hasta 4 horas antes</span> antes de la
126
- salida del bus.
129
+ salida del bus. */}
127
130
  </span>
128
131
  </div>
129
132
  </div>