kupos-ui-components-lib 10.4.17 → 10.4.18
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/dist/components/PaymentSideBar/PaymentSideBarMobile.js +16 -9
- package/dist/components/PaymentSideBar/types.d.ts +3 -0
- package/dist/index.d.ts +4 -1
- package/dist/index.js +5 -0
- package/dist/styles.css +297 -0
- package/dist/ui/BottomSheet/BottomSheet.d.ts +2 -1
- package/dist/ui/BottomSheet/BottomSheet.js +2 -1
- package/dist/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.js +0 -16
- package/dist/ui/FeatureServiceUI/FeatureServiceUi.js +0 -2
- package/dist/ui/PaymentCardMobile/PaymentCardMobile.js +2 -2
- package/package.json +2 -2
- package/patch.py +35 -0
- package/src/assets/images/filter/arrow-down.png +0 -0
- package/src/assets/images/filter/bus.svg +19 -0
- package/src/assets/images/filter/clock.svg +4 -0
- package/src/assets/images/filter/filter.svg +3 -0
- package/src/assets/images/filter/money.svg +12 -0
- package/src/assets/images/filter/night.svg +5 -0
- package/src/assets/images/filter/rapido.svg +14 -0
- package/src/assets/images/filter/rise.svg +20 -0
- package/src/assets/images/filter/search.svg +4 -0
- package/src/assets/images/filter/seat.svg +4 -0
- package/src/assets/images/filter/star.svg +10 -0
- package/src/assets/images/filter/sun.svg +20 -0
- package/src/assets/images/filter/sunset.svg +15 -0
- package/src/assets/images/filter/track.svg +4 -0
- package/src/components/FilterSortBar/FilterChip.tsx +109 -0
- package/src/components/FilterSortBar/FilterSortBarMobile.tsx +292 -0
- package/src/components/FilterSortBar/FiltersMasterSheet.tsx +124 -0
- package/src/components/FilterSortBar/OptionCheckboxList.tsx +76 -0
- package/src/components/FilterSortBar/PriceRangeSlider.tsx +143 -0
- package/src/components/FilterSortBar/SheetFooter.tsx +33 -0
- package/src/components/FilterSortBar/defaultIcons.ts +40 -0
- package/src/components/FilterSortBar/icons.tsx +273 -0
- package/src/components/FilterSortBar/index.ts +17 -0
- package/src/components/FilterSortBar/types.ts +115 -0
- package/src/components/PaymentSideBar/PaymentSideBarMobile.tsx +556 -526
- package/src/components/PaymentSideBar/types.ts +3 -0
- package/src/index.ts +20 -0
- package/src/ui/BottomSheet/BottomSheet.tsx +4 -1
- package/src/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.tsx +0 -16
- package/src/ui/FeatureServiceUI/FeatureServiceUi.tsx +0 -2
- package/src/ui/PaymentCardMobile/PaymentCardMobile.tsx +1027 -0
- package/src/ui/PaymentCardMobile/index.ts +1 -0
- package/src/ui/SlidingModal/SlidingModal.tsx +145 -0
- package/src/ui/SlidingModal/index.ts +2 -0
|
@@ -73,9 +73,11 @@ const renderSummaryDetailsCard = ({ serviceName, date, source, dest, boardingSta
|
|
|
73
73
|
? `${getRoundedHour(duration)}hrs aprox`
|
|
74
74
|
: `${DateService.formatDuration(duration)} horas`)))))));
|
|
75
75
|
};
|
|
76
|
-
|
|
76
|
+
import { PaymentCardMobile } from "../../ui/PaymentCardMobile";
|
|
77
|
+
const PaymentSideBarMobile = (props) => {
|
|
77
78
|
var _a, _b, _c, _d, _e;
|
|
78
|
-
|
|
79
|
+
const { serviceNameOnward, serviceNameReturn, metaData, currencySign, dateOnward, dateReturn, sourceOnward, sourceReturn, destinationOnward, destinationReturn, boardingStageOnward, boardingStageReturn, droppingStageOnward, droppingStageReturn, boardingTimeOnward, boardingTimeReturn, droppingTimeOnward, droppingTimeReturn, durationOnward, durationReturn, selectSeatOnward, selectSeatReturn, journeyTypeActive, setJourneyTypeActive, translation, trainTypeOnward, trainTypeReturn, colors, trainType, icons, selectedOnward, selectedReturn, conexionChecked, conexionPassengers, returnConexionFare, conexionFare, loginData, checkWhatsappEligibility, removeDiscountAtomValue, netFare, promoCode, onPromoRemove, isAgency, agencyFee, walletMoney, virtualMoney, virtualLimit, showUsd, netFareInUsd, renderDiscount, discountAmount, currency, showWhatsappChargesInfo, setShowWhatsappChargesInfo, t, countdown, walletLabel, creditosLabel, isTacna, isLinatal, insuranceData, isPeru, setShowServicefeeModal, serviceFeeDataStateValue, isOpsite, isNewUi = false, showDetails = false, setShowDetails, } = props;
|
|
80
|
+
return (React.createElement(React.Fragment, null, isNewUi ? (React.createElement(PaymentCardMobile, Object.assign({}, props))) : (React.createElement("div", { className: "pb-[15px]" },
|
|
79
81
|
React.createElement("div", { className: "border border-[#ccc] rounded-[20px] relative", style: { margin: "0px 20px 20px" } },
|
|
80
82
|
React.createElement("div", { style: {
|
|
81
83
|
position: "absolute",
|
|
@@ -183,7 +185,9 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
183
185
|
: val.fare * selectedReturn[1][key], currencySign))));
|
|
184
186
|
})
|
|
185
187
|
: null),
|
|
186
|
-
(insuranceData === null || insuranceData === void 0 ? void 0 : insuranceData.insurance_enabled) ? (React.createElement("div", { className: "flex justify-between items-center w-[100%] text-[13.33px]", style: {
|
|
188
|
+
(insuranceData === null || insuranceData === void 0 ? void 0 : insuranceData.insurance_enabled) ? (React.createElement("div", { className: "flex justify-between items-center w-[100%] text-[13.33px]", style: {
|
|
189
|
+
margin: checkWhatsappEligibility ? "0" : "6px 0",
|
|
190
|
+
} },
|
|
187
191
|
React.createElement("div", null,
|
|
188
192
|
React.createElement("span", null, ((_b = (_a = selectedOnward === null || selectedOnward === void 0 ? void 0 : selectedOnward[1]) === null || _a === void 0 ? void 0 : _a.reduce((acc, qty) => acc + qty, 0)) !== null && _b !== void 0 ? _b : 0) +
|
|
189
193
|
((_d = (_c = selectedReturn === null || selectedReturn === void 0 ? void 0 : selectedReturn[1]) === null || _c === void 0 ? void 0 : _c.reduce((acc, qty) => acc + qty, 0)) !== null && _d !== void 0 ? _d : 0)),
|
|
@@ -206,7 +210,9 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
206
210
|
lineHeight: "1.3",
|
|
207
211
|
backgroundColor: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesBgColor,
|
|
208
212
|
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: {
|
|
213
|
+
} }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.whatsapp_delivery_charges, className: "text-[14px]", customStyle: {
|
|
214
|
+
color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor,
|
|
215
|
+
}, currency: currency })) : null,
|
|
210
216
|
metaData &&
|
|
211
217
|
isOpsite &&
|
|
212
218
|
metaData.opsite_whatsapp_delivery_charges &&
|
|
@@ -222,7 +228,9 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
222
228
|
lineHeight: "1.3",
|
|
223
229
|
backgroundColor: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesBgColor,
|
|
224
230
|
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: {
|
|
231
|
+
} }, translation === null || translation === void 0 ? void 0 : translation.whatsappInfoIcon)))), amount: metaData.opsite_whatsapp_delivery_charges, className: "text-[14px]", customStyle: {
|
|
232
|
+
color: colors === null || colors === void 0 ? void 0 : colors.whatsappDeliveryChargesColor,
|
|
233
|
+
}, isBoldText: true, currency: currency })) : null,
|
|
226
234
|
(promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCodeApplied) && (React.createElement(React.Fragment, null,
|
|
227
235
|
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
236
|
? promoCode === null || promoCode === void 0 ? void 0 : promoCode.promoCouponAmount
|
|
@@ -246,7 +254,7 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
246
254
|
walletMoney ? (React.createElement(PaymentItem, { label: walletLabel, amount: isPeru
|
|
247
255
|
? CommonService.currencyFixed(walletMoney, currencySign)
|
|
248
256
|
: CommonService.currency(walletMoney, currencySign), className: "text-[14px]", customStyle: { color: "var(--secondary-color)" }, currency: "", isBoldText: true })) : null,
|
|
249
|
-
virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text", style: { color: "var(--secondary-color)" } }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(virtualMoney, currencySign), customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]", currency: "", isBoldText: true })) : null,
|
|
257
|
+
virtualMoney ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "secondary-text", style: { color: "var(--secondary-color)" } }, `${creditosLabel}(${virtualLimit}%)`), amount: CommonService.currency(((virtualLimit !== null && virtualLimit !== void 0 ? virtualLimit : 0) / 100) * Number(virtualMoney !== null && virtualMoney !== void 0 ? virtualMoney : 0), currencySign), customStyle: { color: "var(--secondary-color)" }, className: "text-[14px]", currency: "", isBoldText: true })) : null,
|
|
250
258
|
showUsd ? (React.createElement(PaymentItem, { label: React.createElement("span", { className: "primary-text" }, translation === null || translation === void 0 ? void 0 : translation.showUsd), amount: CommonService.currency(isAgency ? netFareInUsd + agencyFee : netFareInUsd, currencySign), currency: "USD", customStyle: { color: "var(--primary-color)" }, className: "text-[14px]", isBoldText: true })) : null)),
|
|
251
259
|
React.createElement("div", { className: ` text-[#fff] p-[10px_15px] text-left w-full flex items-center absolute -bottom-[35px] pt-[50px] rounded-b-[14px] text-[14px]`, style: { backgroundColor: colors === null || colors === void 0 ? void 0 : colors.bottomStripColor } },
|
|
252
260
|
React.createElement("div", { className: "flex justify-between items-center w-full text-[#fff]" },
|
|
@@ -259,10 +267,9 @@ const PaymentSideBarMobile = ({ serviceNameOnward, serviceNameReturn, metaData,
|
|
|
259
267
|
currency ? currency : "",
|
|
260
268
|
" ",
|
|
261
269
|
CommonService.currency(isPeru
|
|
262
|
-
? Math.round((removeDiscountAtomValue ? 0 : netFare) * 100) /
|
|
263
|
-
100
|
|
270
|
+
? Math.round((removeDiscountAtomValue ? 0 : netFare) * 100) / 100
|
|
264
271
|
: removeDiscountAtomValue
|
|
265
272
|
? 0
|
|
266
|
-
: netFare, currencySign)))))));
|
|
273
|
+
: netFare, currencySign)))))))));
|
|
267
274
|
};
|
|
268
275
|
export default PaymentSideBarMobile;
|
package/dist/index.d.ts
CHANGED
|
@@ -6,13 +6,16 @@ import KuposUIComponent from "./KuposUIComponent";
|
|
|
6
6
|
import { PaymentSideBarDesktop, PaymentSideBarMobile, ResponsivePaymentSideBar } from "./components/PaymentSideBar";
|
|
7
7
|
import { ServiceListDesktop, ServiceListMobile, ResponsiveServiceList } from "./components/ServiceList";
|
|
8
8
|
import { FilterBarDesktop, FilterBarMobile, ResponsiveFilterBar } from "./components/FilterBar";
|
|
9
|
+
import { FilterSortBarMobile } from "./components/FilterSortBar";
|
|
9
10
|
import { SurveyDesktop, SurveyMobile, ResponsiveSurvey } from "./components/Survey";
|
|
10
11
|
import { Modal, ModalHeader } from "./ui/Modal";
|
|
11
|
-
export { ServiceItemDesktop, ServiceItemMobile, ResponsiveServiceItem, ServiceItemPBMobile, KuposUIComponent, PaymentSideBarDesktop, PaymentSideBarMobile, ResponsivePaymentSideBar, ServiceListDesktop, ServiceListMobile, ResponsiveServiceList, FilterBarDesktop, FilterBarMobile, ResponsiveFilterBar, SurveyDesktop, SurveyMobile, ResponsiveSurvey, Modal, ModalHeader, };
|
|
12
|
+
export { ServiceItemDesktop, ServiceItemMobile, ResponsiveServiceItem, ServiceItemPBMobile, KuposUIComponent, PaymentSideBarDesktop, PaymentSideBarMobile, ResponsivePaymentSideBar, ServiceListDesktop, ServiceListMobile, ResponsiveServiceList, FilterBarDesktop, FilterBarMobile, ResponsiveFilterBar, FilterSortBarMobile, SurveyDesktop, SurveyMobile, ResponsiveSurvey, Modal, ModalHeader, };
|
|
12
13
|
export type { ServiceItemProps } from "./types";
|
|
13
14
|
export type { MobileServiceItemProps } from "./components/ServiceItem/mobileTypes";
|
|
14
15
|
export type { PaymentSideBarProps } from "./components/PaymentSideBar/types";
|
|
15
16
|
export type { ServiceListProps } from "./components/ServiceList/types";
|
|
16
17
|
export type { FilterBarProps } from "./components/FilterBar/tyoes";
|
|
18
|
+
export type { FilterCategory, FilterCategoryKey, FilterCategoryKind, FilterOptionItem, PriceRangeValue, FilterSortBarColors, FilterSortBarIcons, FilterSortBarMobileProps, TimeOfDayVariant, SortDirection, SortOption, } from "./components/FilterSortBar";
|
|
19
|
+
export { DEFAULT_CATEGORY_LABELS } from "./components/FilterSortBar";
|
|
17
20
|
export type { SurveyProps } from "./components/Survey/types";
|
|
18
21
|
export type { ModalProps, ModalVariant, ModalSize, ModalHeaderProps } from "./ui/Modal";
|
package/dist/index.js
CHANGED
|
@@ -9,6 +9,8 @@ import { PaymentSideBarDesktop, PaymentSideBarMobile, ResponsivePaymentSideBar,
|
|
|
9
9
|
import { ServiceListDesktop, ServiceListMobile, ResponsiveServiceList, } from "./components/ServiceList";
|
|
10
10
|
// Import FilterBar components
|
|
11
11
|
import { FilterBarDesktop, FilterBarMobile, ResponsiveFilterBar, } from "./components/FilterBar";
|
|
12
|
+
// Import FilterSortBar components
|
|
13
|
+
import { FilterSortBarMobile } from "./components/FilterSortBar";
|
|
12
14
|
// Import Survey components
|
|
13
15
|
import { SurveyDesktop, SurveyMobile, ResponsiveSurvey, } from "./components/Survey";
|
|
14
16
|
// Import Modal components
|
|
@@ -20,7 +22,10 @@ PaymentSideBarDesktop, PaymentSideBarMobile, ResponsivePaymentSideBar,
|
|
|
20
22
|
ServiceListDesktop, ServiceListMobile, ResponsiveServiceList,
|
|
21
23
|
// FilterBar components
|
|
22
24
|
FilterBarDesktop, FilterBarMobile, ResponsiveFilterBar,
|
|
25
|
+
// FilterSortBar components
|
|
26
|
+
FilterSortBarMobile,
|
|
23
27
|
//Survey components
|
|
24
28
|
SurveyDesktop, SurveyMobile, ResponsiveSurvey,
|
|
25
29
|
// Modal components
|
|
26
30
|
Modal, ModalHeader, };
|
|
31
|
+
export { DEFAULT_CATEGORY_LABELS } from "./components/FilterSortBar";
|