kupos-ui-components-lib 9.6.2 → 9.6.4
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/assets/images/anims/service_list/female_anim.json +1 -0
- package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +7 -3
- package/dist/components/ServiceItem/ServiceItemMobile.js +9 -6
- package/dist/components/ServiceItem/mobileTypes.d.ts +5 -0
- package/dist/components/ServiceItem/types.d.ts +7 -3
- package/dist/styles.css +2 -2
- package/dist/types.d.ts +1 -0
- package/dist/ui/BottomAmenities/BottomAmenities.d.ts +2 -0
- package/dist/ui/BottomAmenities/BottomAmenities.js +4 -0
- package/dist/ui/FemaleBlock.d.ts +9 -0
- package/dist/ui/FemaleBlock.js +19 -0
- package/dist/ui/OfferBanner.d.ts +2 -1
- package/dist/ui/OfferBanner.js +17 -6
- package/dist/ui/SeatSection/SeatSection.d.ts +2 -1
- package/dist/ui/SeatSection/SeatSection.js +33 -15
- package/dist/ui/mobileweb/BottomAmenitiesMobile.d.ts +4 -1
- package/dist/ui/mobileweb/BottomAmenitiesMobile.js +8 -1
- package/dist/ui/mobileweb/DateTimeSectionMobile.d.ts +2 -1
- package/dist/ui/mobileweb/DateTimeSectionMobile.js +2 -2
- package/dist/ui/mobileweb/ExpandedDropdownMobile.d.ts +3 -1
- package/dist/ui/mobileweb/ExpandedDropdownMobile.js +8 -1
- package/dist/ui/mobileweb/SeatSectionMobile.d.ts +2 -1
- package/dist/ui/mobileweb/SeatSectionMobile.js +30 -18
- package/dist/utils/CommonService.js +4 -2
- package/package.json +1 -1
- package/src/assets/images/anims/service_list/female_anim.json +1 -0
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +7 -0
- package/src/components/ServiceItem/ServiceItemMobile.tsx +11 -71
- package/src/components/ServiceItem/mobileTypes.ts +5 -0
- package/src/components/ServiceItem/types.ts +7 -3
- package/src/types.ts +1 -0
- package/src/ui/BottomAmenities/BottomAmenities.tsx +14 -0
- package/src/ui/FemaleBlock.tsx +45 -0
- package/src/ui/OfferBanner.tsx +24 -6
- package/src/ui/SeatSection/SeatSection.tsx +38 -14
- package/src/ui/mobileweb/BottomAmenitiesMobile.tsx +27 -0
- package/src/ui/mobileweb/DateTimeSectionMobile.tsx +3 -0
- package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +15 -0
- package/src/ui/mobileweb/SeatSectionMobile.tsx +41 -31
- package/src/utils/CommonService.ts +7 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"nm":"Main Scene","h":389.908,"w":378.169,"meta":{"g":"@lottiefiles/creator@1.90.1"},"layers":[{"ty":0,"nm":"Precomp Layer Main Scene_1","sr":1,"st":0,"op":180,"ip":0,"tt":1,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[189,195]},"s":{"a":0,"k":[104.157,104.157]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[189.084,236.954]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"w":378,"h":390,"refId":"precomp_Main Scene_jM9TeYrW1Y_3d99d97a-abbe-4c5f-99bc-d6c3a9ec0397_6ced1adb-81c6-4f2a-81fe-41ec223cce28","ind":1,"tp":2},{"ty":4,"nm":"Ellipse 2","sr":1,"st":0,"op":180,"ip":0,"hasMask":false,"td":1,"ao":0,"ks":{"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[106.977,106.977]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[189.084,194.954]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"el","nm":"Ellipse Shape 1","d":1,"p":{"a":0,"k":[0,0]},"s":{"a":0,"k":[348.546,348.546]}},{"ty":"fl","nm":"Fill","c":{"a":0,"k":[1,0.937,0.937]},"r":1,"o":{"a":0,"k":100}}],"ind":2},{"ty":4,"nm":"Ellipse 1","sr":1,"st":0,"op":180,"ip":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[106.977,106.977]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[189.084,194.954]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"el","nm":"Ellipse Shape 1","d":1,"p":{"a":0,"k":[0,0]},"s":{"a":0,"k":[348.546,348.546]}},{"ty":"fl","nm":"Fill","c":{"a":0,"k":[1,0.937,0.937]},"r":1,"o":{"a":0,"k":100}}],"ind":3},{"ty":0,"nm":"Nested Scene 2","sr":1,"st":0,"op":0,"ip":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"w":378,"h":390,"refId":"precomp_newScene_pAg4ss2wXg_138db0d9-ba9c-43eb-990d-ed6033f0b644_471ef448-e667-4911-b181-2b927ec28255","ind":4}],"v":"5.7.0","fr":60,"op":180,"ip":0,"assets":[{"nm":"Nested Scene 1","id":"precomp_newScene_eEKvnUyRwM_1e5c472e-e670-4951-b2be-c78f3b3c23a8_936e2ff8-1715-4d83-ac9b-e003a62870fb","fr":60,"layers":[]},{"nm":"Nested Scene 2","id":"precomp_newScene_pAg4ss2wXg_138db0d9-ba9c-43eb-990d-ed6033f0b644_471ef448-e667-4911-b181-2b927ec28255","fr":60,"layers":[]},{"nm":"Main Scene_1","id":"precomp_Main Scene_jM9TeYrW1Y_3d99d97a-abbe-4c5f-99bc-d6c3a9ec0397_6ced1adb-81c6-4f2a-81fe-41ec223cce28","fr":60,"layers":[{"ty":3,"nm":"Main Stroke width - Color Ctrl","sr":1,"st":0,"op":180,"ip":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[50,50,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":0}},"ef":[{"ty":5,"nm":"Stroke width","en":1,"ef":[{"ty":0,"nm":"Slider","v":{"a":0,"k":16}}]},{"ty":5,"nm":"Highlight width","en":1,"ef":[{"ty":0,"nm":"Slider","v":{"a":0,"k":18}}]},{"ty":5,"nm":"Base Color","en":1,"ef":[{"ty":2,"nm":"Color","v":{"a":0,"k":[1,0.361,0.377]}}]},{"ty":5,"nm":"Highlight","en":1,"ef":[{"ty":2,"nm":"Color","v":{"a":0,"k":[1,0.361,0.377]}}]}],"ind":1,"parent":8},{"ty":4,"nm":"bubble","sr":1,"st":0,"op":10798.799,"ip":0,"hd":true,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[272.075,245.691,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[272.207,146.933],"t":0},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[307.207,110.933],"t":57.018,"ti":[0,0,0],"to":[0,0,0]},{"s":[272.207,146.933],"t":123.158}]},"r":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.489,"y":1},"s":[0],"t":6.842},{"o":{"x":0.494,"y":0},"i":{"x":0.519,"y":1},"s":[-16.557],"t":41.93},{"o":{"x":0.547,"y":0},"i":{"x":0.551,"y":1},"s":[8.915],"t":77.018},{"o":{"x":0.385,"y":0},"i":{"x":0.43,"y":1.633},"s":[-3.821],"t":103.334},{"s":[0],"t":130}]},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Group 1","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[44.97,0],[0,-44.97],[-12.308,-14.265],[0,0],[0,0],[-10.847,0],[0,44.969]],"o":[[-44.97,0],[0,20.319],[0,0],[0,0],[9.464,3.85],[44.97,0],[0,-44.97]],"v":[[0,-83.691],[-81.425,-2.266],[-61.672,50.898],[-68.116,83.691],[-30.66,73.182],[0,79.158],[81.425,-2.266]]}}},{"ty":"st","nm":"Stroke 1","lc":1,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":14},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[340.075,162.191]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"gr","nm":"Group 2","it":[{"ty":"gr","nm":"Group 2","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":false,"i":[[0,0],[0,0]],"o":[[0,0],[0,0]],"v":[[328.207,192.589],[351.944,192.589]]}}},{"ty":"st","nm":"Stroke 1","lc":2,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":14},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"gr","nm":"Group 3","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":false,"i":[[0,0],[0,0]],"o":[[0,0],[0,0]],"v":[[340.075,169.05],[340.075,206.849]]}}},{"ty":"st","nm":"Stroke 1","lc":2,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":14},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"gr","nm":"Group 4","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,-15.567],[15.641,0],[0,15.567],[-15.641,0]],"o":[[0,15.567],[-15.641,0],[0,-15.567],[15.641,0]],"v":[[28.321,0],[0,28.187],[-28.321,0],[0,-28.187]]}}},{"ty":"st","nm":"Stroke 1","lc":2,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":14},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[340.075,140.863]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"tr","a":{"a":0,"k":[340.075,141.762]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[340.075,141.762]},"r":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.489,"y":1},"s":[0],"t":11},{"o":{"x":0.494,"y":0},"i":{"x":0.519,"y":1},"s":[-16.557],"t":46.088},{"o":{"x":0.547,"y":0},"i":{"x":0.551,"y":1},"s":[8.915],"t":81.176},{"o":{"x":0.385,"y":0},"i":{"x":0.43,"y":1.633},"s":[-3.821],"t":107.492},{"s":[0],"t":134.158}]},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":2},{"ty":4,"nm":"Head","sr":1,"st":0,"op":10798.799,"ip":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[191.364,297.865,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,200.095],"t":0},{"o":{"x":0.333,"y":0},"i":{"x":0.189,"y":1},"s":[191.514,212.095],"t":30,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.651,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,194.095],"t":60,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,212.095],"t":90,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[191.514,199.095],"t":114,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[191.514,199.095],"t":138.42},{"s":[191.514,202.095],"t":155}]},"r":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.475,"y":1},"s":[0],"t":4.838},{"o":{"x":0.426,"y":0},"i":{"x":0.339,"y":1},"s":[-8],"t":34},{"o":{"x":0.582,"y":0},"i":{"x":0.525,"y":1},"s":[5],"t":64},{"o":{"x":0.603,"y":0},"i":{"x":0.601,"y":1},"s":[-5],"t":94},{"o":{"x":0.422,"y":0},"i":{"x":0.681,"y":1.31},"s":[3],"t":118.193},{"s":[0],"t":142.58}]},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Group 1","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[4.662,4.662]],"o":[[-4.662,4.662],[0,0]],"v":[[8.441,-2.331],[-8.441,-2.331]]}],"t":0},{"o":{"x":0.167,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[2.38,1.849]],"o":[[-2.38,1.849],[0,0]],"v":[[4.308,-0.924],[-4.308,-0.924]]}],"t":60},{"s":[{"c":false,"i":[[0,0],[4.662,4.662]],"o":[[-4.662,4.662],[0,0]],"v":[[8.441,-2.331],[-8.441,-2.331]]}],"t":120}]}},{"ty":"st","nm":"Stroke 1","lc":2,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":11},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,260.977]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"gr","nm":"Group 2","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[2.157,16.6],[25.37,0],[0,0],[-27.113,0],[0,27.113]],"o":[[-17.187,0],[-15.163,17.991],[0,0],[0,27.113],[27.114,0],[0,0]],"v":[[49.092,-24.529],[14.136,-53.952],[-49.092,-24.529],[-49.092,4.859],[-0.001,53.952],[49.092,4.859]]}}},{"ty":"st","nm":"Stroke 1","lc":1,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":11},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,243.365]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":3},{"ty":4,"nm":"Head 2","sr":1,"st":0,"op":10798.799,"ip":0,"hasMask":false,"td":1,"ao":0,"ks":{"a":{"a":0,"k":[191.364,297.865,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,199.095],"t":0},{"o":{"x":0.333,"y":0},"i":{"x":0.189,"y":1},"s":[191.514,212.095],"t":30,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.651,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,194.095],"t":60,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[191.514,212.095],"t":90,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[191.514,199.095],"t":114,"ti":[0,0,0],"to":[0,0,0]},{"o":{"x":0.167,"y":0.167},"i":{"x":0.833,"y":0.833},"s":[191.514,199.095],"t":138.42},{"s":[191.514,202.095],"t":155}]},"r":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.475,"y":1},"s":[0],"t":4.838},{"o":{"x":0.426,"y":0},"i":{"x":0.339,"y":1},"s":[-8],"t":34},{"o":{"x":0.582,"y":0},"i":{"x":0.525,"y":1},"s":[5],"t":64},{"o":{"x":0.603,"y":0},"i":{"x":0.601,"y":1},"s":[-5],"t":94},{"o":{"x":0.422,"y":0},"i":{"x":0.681,"y":1.31},"s":[3],"t":118.193},{"s":[0],"t":142.58}]},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Group 2","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[2.157,16.6],[25.37,0],[0,0],[-27.113,0],[0,27.113]],"o":[[-17.187,0],[-15.163,17.991],[0,0],[0,27.113],[27.114,0],[0,0]],"v":[[49.092,-24.529],[14.136,-53.952],[-49.092,-24.529],[-49.092,4.859],[-0.001,53.952],[49.092,4.859]]}}},{"ty":"fl","nm":"Fill 1","c":{"a":0,"k":[1,0.361,0.377]},"r":1,"o":{"a":0,"k":100}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,243.365]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":4},{"ty":4,"nm":"Body","sr":1,"st":0,"op":10798.799,"ip":0,"tt":2,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[191.364,352.25,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,257.295]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Group 1","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":false,"i":[[0,0],[0,0],[-12.718,0],[0,12.719],[0,0]],"o":[[0,0],[0,12.719],[12.719,0],[0,0],[0,0]],"v":[[-23.029,-26.591],[-23.029,3.561],[-0.001,26.591],[23.029,3.561],[23.029,-26.591]]}}},{"ty":"st","nm":"Stroke 1","lc":1,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":11},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,309.591]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"gr","nm":"Group 2","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.788,-37.88],[-112.864,0.172],[-113.136,75.974],[114.717,76.586],[112.864,0.172],[82.789,-37.88],[22.669,-52.154]]}}},{"ty":"st","nm":"Stroke 1","lc":1,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":11},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,369.345]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":5,"tp":4},{"ty":4,"nm":"Mask","sr":1,"st":0,"op":10798.799,"ip":0,"hasMask":false,"td":1,"ao":0,"ks":{"a":{"a":0,"k":[250.066,250.098,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[250.066,154.143]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Body 2","it":[{"ty":"gr","nm":"Group 2","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.788,-37.88],[-112.864,0.172],[-112.864,52.155],[112.864,52.155],[112.864,0.172],[82.789,-37.88],[22.669,-52.154]]}],"t":0},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.652,-46.38],[-112.728,-8.328],[-112.864,52.155],[112.864,52.155],[113,-8.328],[82.925,-46.38],[22.669,-52.154]]}],"t":30},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.788,-37.88],[-112.864,0.172],[-112.864,52.155],[112.864,52.155],[112.864,0.172],[82.789,-37.88],[22.669,-52.154]]}],"t":60},{"o":{"x":0.333,"y":0},"i":{"x":0.667,"y":1},"s":[{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.652,-46.38],[-112.728,-8.328],[-112.864,52.155],[112.864,52.155],[113,-8.328],[82.925,-46.38],[22.669,-52.154]]}],"t":90},{"s":[{"c":false,"i":[[0,0],[0,0],[0,-18.119],[0,0],[0,0],[0,0],[17.629,4.186],[0,0]],"o":[[0,0],[-17.63,4.186],[0,0],[0,0],[0,0],[0,-18.119],[0,0],[0,0]],"v":[[-22.669,-52.154],[-82.788,-37.88],[-112.864,0.172],[-112.864,52.155],[112.864,52.155],[112.864,0.172],[82.789,-37.88],[22.669,-52.154]]}],"t":120}]}},{"ty":"fl","nm":"Fill 1","c":{"a":0,"k":[1,0.361,0.377]},"r":1,"o":{"a":0,"k":100}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,369.345]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]},{"ty":"tr","a":{"a":0,"k":[191.364,352.25]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,352.25]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":6},{"ty":4,"nm":"Hair","sr":1,"st":0,"op":10798.799,"ip":0,"tt":2,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[191.364,175.258,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,179.258]},"r":{"a":1,"k":[{"o":{"x":0.333,"y":0},"i":{"x":0.475,"y":1},"s":[0],"t":16},{"o":{"x":0.426,"y":0},"i":{"x":0.339,"y":1},"s":[-8],"t":45.162},{"o":{"x":0.582,"y":0},"i":{"x":0.525,"y":1},"s":[5],"t":75.162},{"o":{"x":0.603,"y":0},"i":{"x":0.601,"y":1},"s":[-5],"t":105.162},{"o":{"x":0.422,"y":0},"i":{"x":0.681,"y":1.31},"s":[3],"t":129.355},{"s":[0],"t":153.742}]},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"gr","nm":"Group 1","it":[{"ty":"sh","nm":"Path 1","d":1,"ks":{"a":0,"k":{"c":true,"i":[[60.022,27.729],[0,13.706],[-3.82,6.033],[0,0],[0,20.738],[-47.742,0],[0,-47.741],[-11.095,-17.52],[0,0],[0,-7.141],[10.939,-6.599]],"o":[[-10.939,-6.599],[0,-7.141],[0,0],[11.095,-17.52],[0,-47.741],[47.741,0],[0,20.738],[0,0],[3.821,6.033],[0,13.706],[-60.022,27.729]],"v":[[-94.604,87.706],[-112.864,55.413],[-107.015,35.244],[-103.428,29.579],[-86.443,-28.992],[0.001,-115.436],[86.444,-28.992],[103.428,29.579],[107.016,35.244],[112.865,55.413],[94.604,87.706]]}}},{"ty":"st","nm":"Stroke 1","lc":1,"lj":2,"ml":1,"o":{"a":0,"k":100},"w":{"a":0,"k":11},"c":{"a":0,"k":[1,0.361,0.377]}},{"ty":"tr","a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[191.364,248.725]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}}]}],"ind":7,"parent":3,"tp":6},{"ty":3,"nm":"Zero | troke width - Color Ctrl","sr":1,"st":0,"op":180,"ip":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[0,0,0]},"s":{"a":0,"k":[100,100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[250,151.045]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":0}},"ind":8}]}]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { ServiceItemProps } from "./types";
|
|
3
|
-
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, }: ServiceItemProps & {
|
|
3
|
+
declare function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption }: ServiceItemProps & {
|
|
4
4
|
currencySign?: string;
|
|
5
5
|
}): React.ReactElement;
|
|
6
6
|
export default ServiceItemPB;
|
|
@@ -22,6 +22,7 @@ import opsitesPriorityStageAnimation from "../../assets/images/anims/service_lis
|
|
|
22
22
|
import bombAnimation from "../../assets/images/anims/service_list/bomb.json";
|
|
23
23
|
import dotAnimation from "../../assets/images/anims/service_list/dot_animation.json";
|
|
24
24
|
import starAnimation from "../../assets/images/anims/service_list/star_anim.json";
|
|
25
|
+
import femaleAnimation from "../../assets/images/anims/service_list/female_anim.json";
|
|
25
26
|
import RatingBlock from "../../ui/RatingBlock";
|
|
26
27
|
import DurationBlock from "../../ui/DurationBlock";
|
|
27
28
|
import PetBlock from "../../ui/PetBlock";
|
|
@@ -69,8 +70,11 @@ const ANIMATION_MAP = {
|
|
|
69
70
|
starAnimation: {
|
|
70
71
|
kupos: starAnimation,
|
|
71
72
|
},
|
|
73
|
+
femaaleAnimation: {
|
|
74
|
+
kupos: femaleAnimation,
|
|
75
|
+
},
|
|
72
76
|
};
|
|
73
|
-
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, }) {
|
|
77
|
+
function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, children, busStage, serviceDetailsLoading, cityOrigin, cityDestination, translation, orignLabel, destinationLabel, currencySign, isCiva, showRating, showLastSeats, removeArrivalTime, removeDuplicateSeats, isPeruSites, showAvailableSeats, isSeatIcon, isLinatal, isPeru, t = (key) => key, siteType, isAllinBus, isExpand, setIsExpand, coachKey, viewersConfig, showLoginModal, isLoggedIn, showLoginOption }) {
|
|
74
78
|
var _a;
|
|
75
79
|
const getAnimationIcon = (icon) => {
|
|
76
80
|
var _a;
|
|
@@ -244,7 +248,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
244
248
|
showTopLabel
|
|
245
249
|
? "mt-[24px]"
|
|
246
250
|
: "mt-[20px]"} ` },
|
|
247
|
-
((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 })),
|
|
251
|
+
((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 })),
|
|
248
252
|
React.createElement("div", { id: `service-card-${serviceItem.id}`, className: `bg-white mx-auto relative ${(hasOfferText || hasDpEnabled) && !isSoldOut
|
|
249
253
|
? "z-[3] rounded-[18px]"
|
|
250
254
|
: "rounded-[10px] border border-[#ccc]"}`, style: serviceCardStyle },
|
|
@@ -271,7 +275,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
|
|
|
271
275
|
backgroundColor: "#ccc",
|
|
272
276
|
} }),
|
|
273
277
|
React.createElement("div", { className: "content-center" },
|
|
274
|
-
React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon })),
|
|
278
|
+
React.createElement(SeatSection, { seatTypes: serviceItem.seat_types, serviceItem: serviceItem, availableSeats: serviceItem.available_seats, isSoldOut: isSoldOut, priceColor: colors.priceColor, dpSeatColor: colors.seatPriceColor, currencySign: currencySign, removeDuplicateSeats: removeDuplicateSeats, isPeru: isPeru, renderIcon: renderIcon, discountSeatPriceColor: colors.discountSeatPriceColor })),
|
|
275
279
|
React.createElement("div", { className: "relative" },
|
|
276
280
|
React.createElement(KuposButton, { isSoldOut: isSoldOut, isLoading: serviceDetailsLoading, buttonColor: colors.kuposButtonColor, buyLabel: translation === null || translation === void 0 ? void 0 : translation.buyButton, soldOutLabel: translation === null || translation === void 0 ? void 0 : translation.soldOutButton, soldOutIcon: renderIcon("soldOutIcon", "14px"), onClick: checkMidnight }),
|
|
277
281
|
showLastSeats ? (React.createElement("div", { className: "flex justify-center mr-[11px] w-[100%] right-[0px] absolute left-[0] top-[40px]" }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
|
|
@@ -18,7 +18,7 @@ const exceptions = [
|
|
|
18
18
|
"asiento_mascota",
|
|
19
19
|
];
|
|
20
20
|
function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, orignLabel, destinationLabel, amenitiesData, setShowDropdown, showDropdown, isExpanded, setIsExpanded, setAmenetiesAtomValue, isCiva, currencySign, isPeru, showRating, showLastSeats, removeDuplicateSeats, isLinatal, viewersConfig, }) {
|
|
21
|
-
var _a, _b, _c, _d, _e;
|
|
21
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
22
22
|
const isItemExpanded = serviceItem.id === isExpanded;
|
|
23
23
|
const isPetSeat = (Object.keys(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.pet_seat_info) || []).length > 0;
|
|
24
24
|
let isSoldOut = serviceItem.available_seats <= 0;
|
|
@@ -110,16 +110,16 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
110
110
|
React.createElement("span", { style: { lineHeight: "normal" } }, getServiceStars(serviceItem))),
|
|
111
111
|
React.createElement("div", { className: "flex items-center cursor-pointer ", style: { color: isSoldOut ? "#bbb" : "text-[#464647]" } },
|
|
112
112
|
React.createElement("span", { className: "ml-[3px] min-[420]:text-[13px] text-[12px] text-ellipsis overflow-hidden whitespace-nowrap max-w-[120px]" }, serviceItem.operator_details[2]))))) : null)),
|
|
113
|
-
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, showLastSeats: showLastSeats }),
|
|
113
|
+
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, showLastSeats: showLastSeats, discountSeatPriceColor: colors.discountSeatPriceColor }),
|
|
114
114
|
hasDiscount && (React.createElement("div", { className: "flex justify-end" }, isSoldOut ? (React.createElement("span", { className: "col-span-2 min-[420]:text-[13px] text-right text-[12px] text-[#ccc]" }, "Agotado")) : null)),
|
|
115
115
|
showLastSeats ? (React.createElement("div", { className: "flex justify-end " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) < 10 &&
|
|
116
116
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.available_seats) > 0 && (React.createElement("div", { className: "text-[10px] text-center", style: {
|
|
117
117
|
color: colors.tooltipBgColor,
|
|
118
|
-
} }, "\u00A1
|
|
118
|
+
} }, "\u00A1\u00DAltimos Asientos!")))) : null,
|
|
119
119
|
React.createElement("div", { className: "bg-[#E6E6E6] mt-[10px] mb-[8px] h-[1px]" }),
|
|
120
120
|
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: () => {
|
|
121
121
|
setIsExpanded(isItemExpanded ? null : serviceItem.id);
|
|
122
|
-
}, isPeru: isPeru })),
|
|
122
|
+
}, isPeru: isPeru, femaleAnim: serviceItem.icons.femaleAnim, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })),
|
|
123
123
|
React.createElement(ServiceBadgesMobile, { showTopLabel: showTopLabel, isSoldOut: isSoldOut, colors: colors, renderIcon: renderIcon, serviceItem: serviceItem, isConexion: isConexion })),
|
|
124
124
|
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) &&
|
|
125
125
|
!isSoldOut && (React.createElement("div", { className: "px-[12px] pt-[22px] pb-[8px] relative -z-9 -mt-[15px]", style: {
|
|
@@ -130,7 +130,10 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
130
130
|
} },
|
|
131
131
|
React.createElement("div", { className: "flex flex-col gap-[8px] text-[12px] min-[420px]:text-[12px] text-[#464647]", style: { lineHeight: 1.6 } },
|
|
132
132
|
React.createElement("div", { className: "flex justify-between items-center" },
|
|
133
|
-
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
|
|
133
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
|
|
134
|
+
Object.keys((_f = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _f !== void 0 ? _f : {}).length ===
|
|
135
|
+
0 &&
|
|
136
|
+
((_g = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _g !== void 0 ? _g : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[6px]" },
|
|
134
137
|
React.createElement(LottiePlayer, { animationData: serviceItem.icons.starAnimation, width: "14px", height: "14px" }),
|
|
135
138
|
React.createElement("span", { className: "text-[#fff]" }, "M\u00E1s elegido"))) : (React.createElement("div", { className: `flex ${((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 10 ? "items-start" : "items-center"}` },
|
|
136
139
|
React.createElement("div", { className: isLongOfferText ? "mt-[2px]" : "" },
|
|
@@ -177,6 +180,6 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
|
|
|
177
180
|
zIndex: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? -3 : undefined,
|
|
178
181
|
marginTop: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "-15px" : "-10px",
|
|
179
182
|
} },
|
|
180
|
-
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true })))));
|
|
183
|
+
React.createElement(ExpandedDropdownMobile, { serviceItem: serviceItem, isPeru: isPeru, petSeatInfo: serviceItem.pet_seat_info, petFriendlyAnim: serviceItem.icons.petFriendlyAnim, isSoldOut: isSoldOut, isChangeTicket: serviceItem.is_change_ticket === true, ladiesBookedSeats: serviceItem.ladies_booked_seats, isDpEnabled: serviceItem.is_dp_enabled })))));
|
|
181
184
|
}
|
|
182
185
|
export default ServiceItemMobile;
|
|
@@ -34,11 +34,14 @@ export interface MobileServiceItemProps {
|
|
|
34
34
|
change_ticket_hours?: number;
|
|
35
35
|
duration?: number;
|
|
36
36
|
train_type_label?: string;
|
|
37
|
+
ladies_booked_seats?: string;
|
|
37
38
|
is_dp_enabled?: boolean;
|
|
38
39
|
offer_text?: string;
|
|
39
40
|
is_direct_trip?: boolean;
|
|
40
41
|
is_train_type?: boolean;
|
|
41
42
|
operator_service_name?: string;
|
|
43
|
+
dp_discount_percents?: Record<string, number>;
|
|
44
|
+
dp_discounted_seats?: string[];
|
|
42
45
|
dep_validation_text?: string;
|
|
43
46
|
metaData?: {};
|
|
44
47
|
is_tracking_enabled?: boolean;
|
|
@@ -120,6 +123,7 @@ export interface MobileServiceItemProps {
|
|
|
120
123
|
fireIcon?: string;
|
|
121
124
|
directoIcon?: string;
|
|
122
125
|
whiteFireIcon?: string;
|
|
126
|
+
femaleAnim?: string;
|
|
123
127
|
[key: string]: string | Record<string, string | undefined> | undefined;
|
|
124
128
|
};
|
|
125
129
|
useLottieFor?: string[];
|
|
@@ -160,6 +164,7 @@ export interface MobileServiceItemProps {
|
|
|
160
164
|
seatPriceColor?: string;
|
|
161
165
|
rightGradiantColor?: string;
|
|
162
166
|
leftGradiantColor?: string;
|
|
167
|
+
discountSeatPriceColor?: string;
|
|
163
168
|
};
|
|
164
169
|
isCiva?: boolean;
|
|
165
170
|
currencySign?: string;
|
|
@@ -39,15 +39,16 @@ export interface ServiceItemProps {
|
|
|
39
39
|
offer_text?: string;
|
|
40
40
|
is_direct_trip?: boolean;
|
|
41
41
|
is_dp_enabled?: boolean;
|
|
42
|
-
dp_discount_percents?:
|
|
43
|
-
dp_discounted_seats?:
|
|
44
|
-
original_dp_price?:
|
|
42
|
+
dp_discount_percents?: any;
|
|
43
|
+
dp_discounted_seats?: any;
|
|
44
|
+
original_dp_price?: any;
|
|
45
45
|
discount_type?: string;
|
|
46
46
|
discount_value?: number;
|
|
47
47
|
max_discount?: number;
|
|
48
48
|
is_transpordo?: boolean;
|
|
49
49
|
is_train_type?: boolean;
|
|
50
50
|
operator_service_name?: string;
|
|
51
|
+
ladies_booked_seats?: string;
|
|
51
52
|
dep_validation_text?: string;
|
|
52
53
|
metaData?: {};
|
|
53
54
|
is_tracking_enabled?: boolean;
|
|
@@ -127,6 +128,7 @@ export interface ServiceItemProps {
|
|
|
127
128
|
downArrow?: string;
|
|
128
129
|
personIcon?: string;
|
|
129
130
|
whiteFireIcon?: string;
|
|
131
|
+
fireIcon?: string;
|
|
130
132
|
[key: string]: string | Record<string, string | undefined> | undefined;
|
|
131
133
|
};
|
|
132
134
|
useLottieFor?: string[];
|
|
@@ -156,6 +158,7 @@ export interface ServiceItemProps {
|
|
|
156
158
|
seatPriceColor?: string;
|
|
157
159
|
rightGradiantColor?: string;
|
|
158
160
|
leftGradiantColor?: string;
|
|
161
|
+
discountSeatPriceColor?: string;
|
|
159
162
|
};
|
|
160
163
|
cityOrigin?: {
|
|
161
164
|
value: number;
|
|
@@ -220,4 +223,5 @@ export interface ServiceItemProps {
|
|
|
220
223
|
};
|
|
221
224
|
showLoginModal?: any;
|
|
222
225
|
isLoggedIn?: any;
|
|
226
|
+
showLoginOption?: boolean;
|
|
223
227
|
}
|
package/dist/styles.css
CHANGED
package/dist/types.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import React from "react";
|
|
|
2
2
|
import LottiePlayer from "../../assets/LottiePlayer";
|
|
3
3
|
import FlexibleBlock from "../FlexibleBlock";
|
|
4
4
|
import PetBlock from "../PetBlock";
|
|
5
|
+
import FemaleBlock from "../FemaleBlock";
|
|
5
6
|
function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, isItemExpanded, colors, translation, getAnimationIcon, downArrowIcon, onToggleExpand, isPeru, }) {
|
|
6
7
|
const hasPetInfo = serviceItem.pet_seat_info &&
|
|
7
8
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
@@ -17,6 +18,9 @@ function BottomAmenities({ otherItems, serviceItem, grayscaleClass, isSoldOut, i
|
|
|
17
18
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_tracking_enabled) && (React.createElement("div", { className: grayscaleClass + " mr-[10px]" },
|
|
18
19
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("locationAnim"), width: "20px", height: "20px" }))),
|
|
19
20
|
serviceItem.is_change_ticket && (React.createElement(FlexibleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
21
|
+
serviceItem.ladies_booked_seats &&
|
|
22
|
+
String(serviceItem.ladies_booked_seats).trim() !== "" &&
|
|
23
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) === true && (React.createElement(FemaleBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, serviceItem: serviceItem, isSoldOut: isSoldOut })),
|
|
20
24
|
hasPetInfo && (React.createElement(PetBlock, { translation: translation, getAnimationIcon: getAnimationIcon, colors: colors, isSoldOut: isSoldOut })),
|
|
21
25
|
isPeru ? null : (React.createElement("div", { className: `flex items-center cursor-pointer ml-[4px] transition-transform duration-300 w-[14px] h-[14px] ${isItemExpanded ? "rotate-180" : ""}`, onClick: onToggleExpand }, downArrowIcon)))));
|
|
22
26
|
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const FemaleBlock: ({ translation, getAnimationIcon, colors, serviceItem, isSoldOut, }: {
|
|
3
|
+
translation: any;
|
|
4
|
+
getAnimationIcon: any;
|
|
5
|
+
colors: any;
|
|
6
|
+
serviceItem: any;
|
|
7
|
+
isSoldOut: any;
|
|
8
|
+
}) => React.JSX.Element;
|
|
9
|
+
export default FemaleBlock;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import LottiePlayer from "../assets/LottiePlayer";
|
|
3
|
+
const FemaleBlock = ({ translation, getAnimationIcon, colors, serviceItem, isSoldOut, }) => (React.createElement("div", { className: "flex items-center" },
|
|
4
|
+
React.createElement("div", { className: "relative group cursor-pointer" },
|
|
5
|
+
React.createElement("div", { className: "flex items-center" },
|
|
6
|
+
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
7
|
+
React.createElement(LottiePlayer
|
|
8
|
+
// animationData={serviceItem.icons.flexibleAnim}
|
|
9
|
+
, {
|
|
10
|
+
// animationData={serviceItem.icons.flexibleAnim}
|
|
11
|
+
animationData: getAnimationIcon("femaaleAnimation"), width: "20px", height: "20px" }))),
|
|
12
|
+
React.createElement("div", { className: "hidden group-hover:block absolute top-[24px] left-1/2 -translate-x-1/2 text-white p-3 rounded-[14px] whitespace-normal z-10 mt-2.5 w-[230px] text-center break-normal shadow-service text-[12px]", style: {
|
|
13
|
+
backgroundColor: colors.bottomStripColor,
|
|
14
|
+
lineHeight: "1.5",
|
|
15
|
+
zIndex: "1000",
|
|
16
|
+
} },
|
|
17
|
+
React.createElement("div", { className: "tooltip-arrow absolute -top-[7px] left-1/2 -translate-x-1/2 w-0 h-0 border-l-8 border-r-8 border-b-8 border-l-transparent border-r-transparent ", style: { borderBottomColor: colors.bottomStripColor } }),
|
|
18
|
+
"Esta empresa cuenta con asientos recomendados para mujeres."))));
|
|
19
|
+
export default FemaleBlock;
|
package/dist/ui/OfferBanner.d.ts
CHANGED
|
@@ -3,12 +3,13 @@ import { ServiceItemProps } from "../components/ServiceItem/types";
|
|
|
3
3
|
interface OfferBannerProps {
|
|
4
4
|
offerGradient: string;
|
|
5
5
|
isSoldOut: boolean;
|
|
6
|
-
serviceItem: Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text">;
|
|
6
|
+
serviceItem: Pick<ServiceItemProps["serviceItem"], "is_dp_enabled" | "offer_text" | "dp_discount_percents" | "dp_discounted_seats">;
|
|
7
7
|
renderIcon: (name: string, size: string) => React.ReactNode;
|
|
8
8
|
isLoggedIn: any;
|
|
9
9
|
showLoginModal: any;
|
|
10
10
|
viewersConfig: ServiceItemProps["viewersConfig"];
|
|
11
11
|
getAnimationIcon: (name: string) => any;
|
|
12
|
+
showLoginOption?: boolean;
|
|
12
13
|
}
|
|
13
14
|
declare const OfferBanner: React.FC<OfferBannerProps>;
|
|
14
15
|
export default OfferBanner;
|
package/dist/ui/OfferBanner.js
CHANGED
|
@@ -1,28 +1,34 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import LottiePlayer from "../assets/LottiePlayer";
|
|
3
3
|
import CommonService from "../utils/CommonService";
|
|
4
|
-
const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, }) => {
|
|
4
|
+
const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, showLoginOption }) => {
|
|
5
|
+
var _a, _b, _c, _d;
|
|
5
6
|
return (React.createElement("div", { className: "text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[36px] pt-[50px] rounded-b-[14px] text-[14px]", style: {
|
|
6
7
|
background: offerGradient,
|
|
7
8
|
opacity: isSoldOut ? 0.5 : 1,
|
|
8
9
|
// zIndex: 0,
|
|
9
10
|
} },
|
|
10
11
|
React.createElement("div", { className: "flex justify-between items-center w-full" },
|
|
11
|
-
React.createElement("div", { className: "flex items-center " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
|
|
12
|
+
React.createElement("div", { className: "flex items-center " }, (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
|
|
13
|
+
Object.keys((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _a !== void 0 ? _a : {}).length === 0 &&
|
|
14
|
+
((_b = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _b !== void 0 ? _b : []).length === 0 ? (React.createElement("div", { className: "flex items-center gap-[5px]" },
|
|
12
15
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("starAnimation"), width: "18px", height: "18px" }),
|
|
13
16
|
React.createElement("span", null, "Servicio popular entre los usuarios"))) : (React.createElement("div", { className: "flex items-center" },
|
|
14
17
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("bombAnimation"), width: "18px", height: "18px" }),
|
|
15
18
|
React.createElement("div", { className: "flex items-center mt-[2px]" },
|
|
16
|
-
React.createElement("span", { className: "bold-text
|
|
19
|
+
React.createElement("span", { className: "bold-text", style: {
|
|
20
|
+
marginLeft: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "6px" : "3px",
|
|
21
|
+
} },
|
|
17
22
|
((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").length > 30
|
|
18
23
|
? ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").slice(0, 30) + "..."
|
|
19
24
|
: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "",
|
|
20
25
|
" ",
|
|
21
|
-
isLoggedIn ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
|
|
26
|
+
isLoggedIn && showLoginOption ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
|
|
22
27
|
" ",
|
|
23
28
|
"\u00A0"),
|
|
24
29
|
" ",
|
|
25
|
-
"|
|
|
30
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "|" : "",
|
|
31
|
+
"Termina en\u00A0",
|
|
26
32
|
React.createElement("span", { className: "bold-text text-end", ref: (node) => CommonService.startCountdown(node, 599), style: {
|
|
27
33
|
fontVariantNumeric: "tabular-nums",
|
|
28
34
|
display: "inline-block",
|
|
@@ -38,7 +44,12 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLogg
|
|
|
38
44
|
" |",
|
|
39
45
|
" ",
|
|
40
46
|
React.createElement("span", { className: "" },
|
|
41
|
-
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)
|
|
47
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
|
|
48
|
+
Object.keys((_c = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _c !== void 0 ? _c : {}).length ===
|
|
49
|
+
0 &&
|
|
50
|
+
((_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _d !== void 0 ? _d : []).length === 0
|
|
51
|
+
? null
|
|
52
|
+
: "Quedan pocos • ",
|
|
42
53
|
React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
|
|
43
54
|
" ",
|
|
44
55
|
"comprando")))))));
|
|
@@ -15,6 +15,7 @@ interface SeatSectionProps {
|
|
|
15
15
|
isPeru?: boolean;
|
|
16
16
|
serviceItem?: any;
|
|
17
17
|
renderIcon?: (iconKey: string, size?: string) => React.ReactNode;
|
|
18
|
+
discountSeatPriceColor?: string;
|
|
18
19
|
}
|
|
19
|
-
declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, }: SeatSectionProps): React.ReactElement;
|
|
20
|
+
declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, }: SeatSectionProps): React.ReactElement;
|
|
20
21
|
export default SeatSection;
|
|
@@ -54,8 +54,8 @@ function getUniqueSeats(seatTypes) {
|
|
|
54
54
|
function getNumberOfSeats(seatTypes) {
|
|
55
55
|
return seatTypes.filter((val) => !SEAT_EXCEPTIONS.includes(val.label)).length;
|
|
56
56
|
}
|
|
57
|
-
function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, }) {
|
|
58
|
-
var _a
|
|
57
|
+
function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, }) {
|
|
58
|
+
var _a;
|
|
59
59
|
const uniqueSeats = getUniqueSeats(seatTypes);
|
|
60
60
|
const sortedSeatTypes = getSortedSeatTypes(seatTypes);
|
|
61
61
|
const numberOfSeats = getNumberOfSeats(seatTypes);
|
|
@@ -101,10 +101,19 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
101
101
|
const discountSeat = discountedSeats
|
|
102
102
|
.filter((seat) => !SEAT_EXCEPTIONS.includes(seat.label))
|
|
103
103
|
.sort((a, b) => a.discountedPrice - b.discountedPrice)[0];
|
|
104
|
-
const discountValue = (
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
104
|
+
const discountValue = (() => {
|
|
105
|
+
if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "percentage" &&
|
|
106
|
+
typeof (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_value) === "number") {
|
|
107
|
+
return Math.round(serviceItem.discount_value);
|
|
108
|
+
}
|
|
109
|
+
if ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.discount_type) === "fixed" && discountSeat) {
|
|
110
|
+
const { originalPrice, discountedPrice } = discountSeat;
|
|
111
|
+
if (originalPrice > 0 && originalPrice !== discountedPrice) {
|
|
112
|
+
return Math.round(((originalPrice - discountedPrice) / originalPrice) * 100);
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
return null;
|
|
116
|
+
})();
|
|
108
117
|
const renderLabels = () => {
|
|
109
118
|
if (isPeru) {
|
|
110
119
|
return (React.createElement(React.Fragment, null,
|
|
@@ -120,12 +129,16 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
120
129
|
// const dpDiscountEntry = Object.entries(
|
|
121
130
|
// serviceItem?.dp_discount_percents || {},
|
|
122
131
|
// ).find(([, percent]) => Number(percent));
|
|
123
|
-
const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {})[0];
|
|
132
|
+
const dpDiscountEntry = Object.entries((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) || {}).sort(([, a], [, b]) => Number(a) - Number(b))[0];
|
|
124
133
|
const dpDiscountPercent = dpDiscountEntry === null || dpDiscountEntry === void 0 ? void 0 : dpDiscountEntry[1];
|
|
125
|
-
const
|
|
134
|
+
const getLowestDpValue = (source) => {
|
|
126
135
|
if (!source)
|
|
127
136
|
return undefined;
|
|
128
|
-
|
|
137
|
+
const values = Array.isArray(source)
|
|
138
|
+
? source
|
|
139
|
+
: Object.values(source);
|
|
140
|
+
const nums = values.map(Number).filter((n) => !isNaN(n) && n > 0);
|
|
141
|
+
return nums.length > 0 ? Math.min(...nums) : undefined;
|
|
129
142
|
};
|
|
130
143
|
const renderDpDiscountUi = (originalDpPrice, seatTypeFare) => {
|
|
131
144
|
return (React.createElement("div", { className: "grid grid-cols-2 items-center text-[13.33px] relative" },
|
|
@@ -155,7 +168,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
155
168
|
} }))),
|
|
156
169
|
React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
|
|
157
170
|
React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : "#ff5964" } },
|
|
158
|
-
React.createElement("div", { className: "absolute", style: { left: isPeru ? "-1px" : "-
|
|
171
|
+
React.createElement("div", { className: "absolute", style: { left: isPeru ? "-1px" : "-19px", bottom: "1px" } }, renderIcon("fireIcon", "16px")),
|
|
159
172
|
availableSeats <= 0
|
|
160
173
|
? CommonService.currency(0, currencySign)
|
|
161
174
|
: CommonService.discountedCurrency(Number(seatTypeFare), currencySign)))));
|
|
@@ -171,7 +184,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
171
184
|
React.createElement("span", { className: "text-[13.33px] font-normal leading-[24px] text-[#464647]" }, "Desde")),
|
|
172
185
|
React.createElement("div", null,
|
|
173
186
|
React.createElement("div", { className: "relative" },
|
|
174
|
-
React.createElement("div", { className: "absolute -left-[20px] top-1/
|
|
187
|
+
React.createElement("div", { className: "absolute -left-[20px] top-1/3 transform -translate-y-1/2" }, renderIcon("fireIcon", "16px")),
|
|
175
188
|
React.createElement("div", { className: "absolute bottom-[35px] left-1/2 -translate-x-1/2 ", style: {
|
|
176
189
|
animation: "pulse-zoom 2s ease-in-out infinite",
|
|
177
190
|
whiteSpace: "nowrap",
|
|
@@ -186,8 +199,11 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
186
199
|
: CommonService.discountedCurrency(lowestFare, currencySign))))));
|
|
187
200
|
}
|
|
188
201
|
if (dpDiscountEntry) {
|
|
189
|
-
const originalDpPrice =
|
|
190
|
-
const
|
|
202
|
+
const originalDpPrice = getLowestDpValue(serviceItem.original_dp_price);
|
|
203
|
+
const allFares = ((_a = serviceItem.seat_types) !== null && _a !== void 0 ? _a : [])
|
|
204
|
+
.map((st) => st.fare)
|
|
205
|
+
.filter((f) => f != null && !isNaN(Number(f)));
|
|
206
|
+
const seatTypeFare = allFares.length > 0 ? Math.min(...allFares) : originalDpPrice;
|
|
191
207
|
if (originalDpPrice && seatTypeFare) {
|
|
192
208
|
return renderDpDiscountUi(originalDpPrice, seatTypeFare);
|
|
193
209
|
}
|
|
@@ -201,6 +217,7 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
201
217
|
React.createElement("div", { className: "col-start-2 row-start-1 flex items-center justify-center absolute", style: { top: "-22px", left: "50%", transform: "translateX(-50%)" } }, discountValue != null && (React.createElement("span", { className: "rounded-[100px] bg-[#ff5964] px-[6px] text-[12px] bold-text leading-[20px] text-white", style: {
|
|
202
218
|
animation: "pulse-zoom 2s ease-in-out infinite",
|
|
203
219
|
whiteSpace: "nowrap",
|
|
220
|
+
backgroundColor: discountSeatPriceColor,
|
|
204
221
|
} },
|
|
205
222
|
discountValue,
|
|
206
223
|
"% OFF"))),
|
|
@@ -220,9 +237,10 @@ function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currenc
|
|
|
220
237
|
transformOrigin: "center",
|
|
221
238
|
} }))),
|
|
222
239
|
React.createElement("div", { className: "col-start-2 row-start-3 flex h-[30px] items-end justify-center relative" },
|
|
223
|
-
React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" :
|
|
240
|
+
React.createElement("span", { className: "flex items-center gap-[6px] text-[22px] bold-text leading-[30px]", style: { color: isSoldOut ? "#c0c0c0" : discountSeatPriceColor } },
|
|
224
241
|
React.createElement("div", { className: "absolute", style: {
|
|
225
|
-
left: isPeru ? "-1px" : "-
|
|
242
|
+
left: isPeru ? "-1px" : "-18px",
|
|
243
|
+
bottom: "1px"
|
|
226
244
|
} }, renderIcon("fireIcon", "16px")),
|
|
227
245
|
availableSeats <= 0
|
|
228
246
|
? CommonService.currency(0, currencySign)
|
|
@@ -20,6 +20,9 @@ interface BottomAmenitiesMobileProps {
|
|
|
20
20
|
onDropdownToggle: () => void;
|
|
21
21
|
isItemExpanded?: boolean;
|
|
22
22
|
isPeru?: boolean;
|
|
23
|
+
femaleAnim?: any;
|
|
24
|
+
ladiesBookedSeats?: string;
|
|
25
|
+
isDpEnabled?: boolean;
|
|
23
26
|
}
|
|
24
|
-
declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, }: BottomAmenitiesMobileProps): React.ReactElement;
|
|
27
|
+
declare function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, }: BottomAmenitiesMobileProps): React.ReactElement;
|
|
25
28
|
export default BottomAmenitiesMobile;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import LottiePlayer from "../../assets/LottiePlayer";
|
|
3
|
-
function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, }) {
|
|
3
|
+
function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration, isDirectTrip, directoColor, directoAnim, isChangeTicket, isPetSeat, petSeatInfo, petFriendlyAnim, flexibleAnim, isTrackingEnabled, locationAnim, downArrowIcon, showDropdown, setShowDropdown, onDropdownToggle, isItemExpanded, isPeru, femaleAnim, ladiesBookedSeats, isDpEnabled, }) {
|
|
4
4
|
return (React.createElement("div", { className: `${"flex justify-between items-center items-center "}` },
|
|
5
5
|
React.createElement("div", { className: "w-[55%] flex justify-between items-center" },
|
|
6
6
|
React.createElement("div", { style: { opacity: isSoldOut ? 0.5 : 1 } }, amenitiesNodes),
|
|
@@ -22,6 +22,13 @@ function BottomAmenitiesMobile({ isSoldOut, amenitiesNodes, hoursIcon, duration,
|
|
|
22
22
|
React.createElement("div", { className: "flex items-center" },
|
|
23
23
|
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
24
24
|
React.createElement(LottiePlayer, { animationData: flexibleAnim, width: "16px", height: "16px" })))))),
|
|
25
|
+
ladiesBookedSeats &&
|
|
26
|
+
String(ladiesBookedSeats).trim() !== "" &&
|
|
27
|
+
isDpEnabled === true && (React.createElement("div", { className: "flex items-center" },
|
|
28
|
+
React.createElement("div", { className: "relative group cursor-default" },
|
|
29
|
+
React.createElement("div", { className: "flex items-center" },
|
|
30
|
+
React.createElement("div", { className: `mr-[5px] ${isSoldOut ? "grayscale" : ""}` },
|
|
31
|
+
React.createElement(LottiePlayer, { animationData: femaleAnim, width: "16px", height: "16px" })))))),
|
|
25
32
|
isTrackingEnabled && (React.createElement("div", { className: "flex items-center mr-[10px]" },
|
|
26
33
|
React.createElement("div", { className: `h-auto mr-[4px] min-[420]:text-[13px] text-[11px] text-[#464647] ${isSoldOut ? "grayscale" : ""}` },
|
|
27
34
|
React.createElement(LottiePlayer, { animationData: locationAnim, width: "16px", height: "16px" }))))))),
|
|
@@ -21,6 +21,7 @@ interface DateTimeSectionMobileProps {
|
|
|
21
21
|
serviceItem?: any;
|
|
22
22
|
tooltipBgColor?: string;
|
|
23
23
|
showLastSeats?: boolean;
|
|
24
|
+
discountSeatPriceColor?: string;
|
|
24
25
|
}
|
|
25
|
-
declare function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }: DateTimeSectionMobileProps): React.ReactElement;
|
|
26
|
+
declare function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }: DateTimeSectionMobileProps): React.ReactElement;
|
|
26
27
|
export default DateTimeSectionMobile;
|
|
@@ -31,7 +31,7 @@ const TimeRow = ({ label, icon, alt, date, timeContent, isSoldOut, }) => (React.
|
|
|
31
31
|
React.createElement("span", { className: "cursor-pointer black-text" }, DateService.getServiceItemDate(date)),
|
|
32
32
|
React.createElement("div", { className: "absolute left-[50%]" }, "\u2022"),
|
|
33
33
|
React.createElement("div", { className: "font-[900] relative black-text" }, timeContent)))));
|
|
34
|
-
function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, }) {
|
|
34
|
+
function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal, isPeru, orignLabel, destinationLabel, originIcon, destinationIcon, travelDate, arrivalDate, depTime, arrTime, seatTypes, seatPriceColor, currencySign, availableSeats, removeDuplicateSeats, serviceItem, tooltipBgColor, showLastSeats, discountSeatPriceColor, }) {
|
|
35
35
|
const { cleaned: cleanedDepTime, hasAM, hasPM } = getCleanedDepTime(depTime);
|
|
36
36
|
const depTimeContent = isLinatal ? (React.createElement("div", null,
|
|
37
37
|
React.createElement("span", null,
|
|
@@ -52,6 +52,6 @@ function DateTimeSectionMobile({ onBookButtonPress, isCiva, isSoldOut, isLinatal
|
|
|
52
52
|
backgroundColor: "#ccc",
|
|
53
53
|
margin: "auto",
|
|
54
54
|
} }),
|
|
55
|
-
React.createElement(SeatSectionMobile, { seatTypes: seatTypes, isSoldOut: isSoldOut, isPeru: isPeru, seatPriceColor: seatPriceColor, currencySign: currencySign, availableSeats: availableSeats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, tooltipBgColor: tooltipBgColor, showLastSeats: showLastSeats })));
|
|
55
|
+
React.createElement(SeatSectionMobile, { seatTypes: seatTypes, isSoldOut: isSoldOut, isPeru: isPeru, seatPriceColor: seatPriceColor, currencySign: currencySign, availableSeats: availableSeats, removeDuplicateSeats: removeDuplicateSeats, serviceItem: serviceItem, tooltipBgColor: tooltipBgColor, showLastSeats: showLastSeats, discountSeatPriceColor: discountSeatPriceColor })));
|
|
56
56
|
}
|
|
57
57
|
export default DateTimeSectionMobile;
|