kupos-ui-components-lib 9.9.2 → 9.9.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/KuposUIComponent.d.ts +0 -3
- package/dist/components/ServiceItem/PeruServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/PeruServiceItemDesktop.js +2 -2
- package/dist/components/ServiceItem/ServiceItemDesktop.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemDesktop.js +31 -30
- package/dist/components/ServiceItem/ServiceItemMobile.d.ts +1 -1
- package/dist/components/ServiceItem/ServiceItemMobile.js +17 -43
- package/dist/components/ServiceItem/mobileTypes.d.ts +2 -48
- package/dist/components/ServiceItem/types.d.ts +9 -27
- package/dist/styles.css +6 -215
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.d.ts +2 -1
- package/dist/ui/ExpendedDropDown/ExpandedDropdown.js +5 -3
- package/dist/ui/OfferBanner.d.ts +0 -2
- package/dist/ui/OfferBanner.js +14 -19
- package/dist/ui/SeatSection/SeatSection.d.ts +7 -1
- package/dist/ui/SeatSection/SeatSection.js +41 -12
- package/dist/ui/mobileweb/DateTimeSectionMobile.d.ts +2 -1
- package/dist/ui/mobileweb/DateTimeSectionMobile.js +7 -5
- package/dist/ui/mobileweb/ExpandedDropdownMobile.js +1 -1
- package/dist/ui/mobileweb/SeatSectionMobile.d.ts +2 -1
- package/dist/ui/mobileweb/SeatSectionMobile.js +15 -10
- package/dist/utils/CommonService.d.ts +1 -4
- package/dist/utils/CommonService.js +6 -19
- package/package.json +1 -1
- package/src/KuposUIComponent.tsx +0 -3
- package/src/components/ServiceItem/PeruServiceItemDesktop.tsx +24 -35
- package/src/components/ServiceItem/ServiceItemDesktop.tsx +53 -65
- package/src/components/ServiceItem/ServiceItemMobile.tsx +290 -387
- package/src/components/ServiceItem/mobileTypes.ts +8 -50
- package/src/components/ServiceItem/types.ts +25 -39
- package/src/styles.css +0 -15
- package/src/ui/ExpendedDropDown/ExpandedDropdown.tsx +5 -3
- package/src/ui/OfferBanner.tsx +10 -31
- package/src/ui/SeatSection/SeatSection.tsx +86 -21
- package/src/ui/mobileweb/DateTimeSectionMobile.tsx +38 -33
- package/src/ui/mobileweb/ExpandedDropdownMobile.tsx +1 -1
- package/src/ui/mobileweb/SeatSectionMobile.tsx +12 -7
- package/src/utils/CommonService.ts +8 -27
- package/src/assets/images/anims/service_list/flame_anim.json +0 -1
- package/src/assets/images/anims/service_list/thunder_icon.json +0 -1
- package/src/assets/images/anims/service_list/users_anim.json +0 -1
- package/src/ui/FeaturServiceUiMobile/FeatureServiceUiMobile.tsx +0 -575
- package/src/ui/FeatureServiceUI/FeatureServiceUi.tsx +0 -610
package/dist/styles.css
CHANGED
|
@@ -33,9 +33,6 @@
|
|
|
33
33
|
.-top-\[11px\] {
|
|
34
34
|
top: calc(11px * -1);
|
|
35
35
|
}
|
|
36
|
-
.-top-\[13px\] {
|
|
37
|
-
top: calc(13px * -1);
|
|
38
|
-
}
|
|
39
36
|
.-top-\[18px\] {
|
|
40
37
|
top: calc(18px * -1);
|
|
41
38
|
}
|
|
@@ -63,15 +60,9 @@
|
|
|
63
60
|
.top-\[88\%\] {
|
|
64
61
|
top: 88%;
|
|
65
62
|
}
|
|
66
|
-
.top-\[calc\(100\%\+10px\)\] {
|
|
67
|
-
top: calc(100% + 10px);
|
|
68
|
-
}
|
|
69
63
|
.right-\[0px\] {
|
|
70
64
|
right: 0px;
|
|
71
65
|
}
|
|
72
|
-
.right-\[18px\] {
|
|
73
|
-
right: 18px;
|
|
74
|
-
}
|
|
75
66
|
.-bottom-\[9\%\] {
|
|
76
67
|
bottom: calc(9% * -1);
|
|
77
68
|
}
|
|
@@ -84,12 +75,6 @@
|
|
|
84
75
|
.-bottom-\[36px\] {
|
|
85
76
|
bottom: calc(36px * -1);
|
|
86
77
|
}
|
|
87
|
-
.-bottom-\[44px\] {
|
|
88
|
-
bottom: calc(44px * -1);
|
|
89
|
-
}
|
|
90
|
-
.bottom-\[11px\] {
|
|
91
|
-
bottom: 11px;
|
|
92
|
-
}
|
|
93
78
|
.bottom-\[35px\] {
|
|
94
79
|
bottom: 35px;
|
|
95
80
|
}
|
|
@@ -183,15 +168,9 @@
|
|
|
183
168
|
.m-\[auto\] {
|
|
184
169
|
margin: auto;
|
|
185
170
|
}
|
|
186
|
-
.mx-\[6px\] {
|
|
187
|
-
margin-inline: 6px;
|
|
188
|
-
}
|
|
189
171
|
.mx-auto {
|
|
190
172
|
margin-inline: auto;
|
|
191
173
|
}
|
|
192
|
-
.my-\[8px\] {
|
|
193
|
-
margin-block: 8px;
|
|
194
|
-
}
|
|
195
174
|
.-mt-\[15px\] {
|
|
196
175
|
margin-top: calc(15px * -1);
|
|
197
176
|
}
|
|
@@ -210,27 +189,15 @@
|
|
|
210
189
|
.mt-\[5px\] {
|
|
211
190
|
margin-top: 5px;
|
|
212
191
|
}
|
|
213
|
-
.mt-\[6px\] {
|
|
214
|
-
margin-top: 6px;
|
|
215
|
-
}
|
|
216
192
|
.mt-\[10px\] {
|
|
217
193
|
margin-top: 10px;
|
|
218
194
|
}
|
|
219
|
-
.mt-\[12px\] {
|
|
220
|
-
margin-top: 12px;
|
|
221
|
-
}
|
|
222
195
|
.mt-\[13px\] {
|
|
223
196
|
margin-top: 13px;
|
|
224
197
|
}
|
|
225
|
-
.mt-\[14px\] {
|
|
226
|
-
margin-top: 14px;
|
|
227
|
-
}
|
|
228
198
|
.mt-\[15px\] {
|
|
229
199
|
margin-top: 15px;
|
|
230
200
|
}
|
|
231
|
-
.mt-\[16px\] {
|
|
232
|
-
margin-top: 16px;
|
|
233
|
-
}
|
|
234
201
|
.mt-\[20px\] {
|
|
235
202
|
margin-top: 20px;
|
|
236
203
|
}
|
|
@@ -357,9 +324,6 @@
|
|
|
357
324
|
.h-\[12px\] {
|
|
358
325
|
height: 12px;
|
|
359
326
|
}
|
|
360
|
-
.h-\[13px\] {
|
|
361
|
-
height: 13px;
|
|
362
|
-
}
|
|
363
327
|
.h-\[14px\] {
|
|
364
328
|
height: 14px;
|
|
365
329
|
}
|
|
@@ -378,9 +342,6 @@
|
|
|
378
342
|
.h-\[24px\] {
|
|
379
343
|
height: 24px;
|
|
380
344
|
}
|
|
381
|
-
.h-\[26px\] {
|
|
382
|
-
height: 26px;
|
|
383
|
-
}
|
|
384
345
|
.h-\[30px\] {
|
|
385
346
|
height: 30px;
|
|
386
347
|
}
|
|
@@ -408,9 +369,6 @@
|
|
|
408
369
|
.w-\[12px\] {
|
|
409
370
|
width: 12px;
|
|
410
371
|
}
|
|
411
|
-
.w-\[13px\] {
|
|
412
|
-
width: 13px;
|
|
413
|
-
}
|
|
414
372
|
.w-\[14px\] {
|
|
415
373
|
width: 14px;
|
|
416
374
|
}
|
|
@@ -423,9 +381,6 @@
|
|
|
423
381
|
.w-\[20px\] {
|
|
424
382
|
width: 20px;
|
|
425
383
|
}
|
|
426
|
-
.w-\[26px\] {
|
|
427
|
-
width: 26px;
|
|
428
|
-
}
|
|
429
384
|
.w-\[50\%\] {
|
|
430
385
|
width: 50%;
|
|
431
386
|
}
|
|
@@ -441,6 +396,9 @@
|
|
|
441
396
|
.w-\[65\%\%\] {
|
|
442
397
|
width: 65%%;
|
|
443
398
|
}
|
|
399
|
+
.w-\[80\%\] {
|
|
400
|
+
width: 80%;
|
|
401
|
+
}
|
|
444
402
|
.w-\[100\%\] {
|
|
445
403
|
width: 100%;
|
|
446
404
|
}
|
|
@@ -494,12 +452,6 @@
|
|
|
494
452
|
.max-w-\[165px\] {
|
|
495
453
|
max-width: 165px;
|
|
496
454
|
}
|
|
497
|
-
.max-w-\[220px\] {
|
|
498
|
-
max-width: 220px;
|
|
499
|
-
}
|
|
500
|
-
.max-w-full {
|
|
501
|
-
max-width: 100%;
|
|
502
|
-
}
|
|
503
455
|
.min-w-\[75px\] {
|
|
504
456
|
min-width: 75px;
|
|
505
457
|
}
|
|
@@ -521,9 +473,6 @@
|
|
|
521
473
|
--tw-translate-y: -10px;
|
|
522
474
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
523
475
|
}
|
|
524
|
-
.rotate-0 {
|
|
525
|
-
rotate: 0deg;
|
|
526
|
-
}
|
|
527
476
|
.rotate-180 {
|
|
528
477
|
rotate: 180deg;
|
|
529
478
|
}
|
|
@@ -533,9 +482,6 @@
|
|
|
533
482
|
.cursor-default {
|
|
534
483
|
cursor: default;
|
|
535
484
|
}
|
|
536
|
-
.cursor-not-allowed {
|
|
537
|
-
cursor: not-allowed;
|
|
538
|
-
}
|
|
539
485
|
.cursor-pointer {
|
|
540
486
|
cursor: pointer;
|
|
541
487
|
}
|
|
@@ -548,21 +494,12 @@
|
|
|
548
494
|
.grid-cols-2 {
|
|
549
495
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
550
496
|
}
|
|
551
|
-
.grid-cols-3 {
|
|
552
|
-
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
553
|
-
}
|
|
554
|
-
.grid-cols-4 {
|
|
555
|
-
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
556
|
-
}
|
|
557
497
|
.grid-cols-\[0\.8fr_auto_26\%_1fr\] {
|
|
558
498
|
grid-template-columns: 0.8fr auto 26% 1fr;
|
|
559
499
|
}
|
|
560
500
|
.grid-cols-\[1\.5fr_1fr_auto\] {
|
|
561
501
|
grid-template-columns: 1.5fr 1fr auto;
|
|
562
502
|
}
|
|
563
|
-
.grid-cols-\[25\%_48\%_27\%\] {
|
|
564
|
-
grid-template-columns: 25% 48% 27%;
|
|
565
|
-
}
|
|
566
503
|
.grid-cols-\[26px_auto_26\%_1fr\] {
|
|
567
504
|
grid-template-columns: 26px auto 26% 1fr;
|
|
568
505
|
}
|
|
@@ -590,9 +527,6 @@
|
|
|
590
527
|
.items-start {
|
|
591
528
|
align-items: flex-start;
|
|
592
529
|
}
|
|
593
|
-
.items-stretch {
|
|
594
|
-
align-items: stretch;
|
|
595
|
-
}
|
|
596
530
|
.justify-between {
|
|
597
531
|
justify-content: space-between;
|
|
598
532
|
}
|
|
@@ -635,12 +569,6 @@
|
|
|
635
569
|
.gap-\[14px\] {
|
|
636
570
|
gap: 14px;
|
|
637
571
|
}
|
|
638
|
-
.gap-\[16px\] {
|
|
639
|
-
gap: 16px;
|
|
640
|
-
}
|
|
641
|
-
.gap-\[20px\] {
|
|
642
|
-
gap: 20px;
|
|
643
|
-
}
|
|
644
572
|
.gap-x-\[2\%\] {
|
|
645
573
|
-moz-column-gap: 2%;
|
|
646
574
|
column-gap: 2%;
|
|
@@ -649,20 +577,12 @@
|
|
|
649
577
|
-moz-column-gap: 8px;
|
|
650
578
|
column-gap: 8px;
|
|
651
579
|
}
|
|
652
|
-
.truncate {
|
|
653
|
-
overflow: hidden;
|
|
654
|
-
text-overflow: ellipsis;
|
|
655
|
-
white-space: nowrap;
|
|
656
|
-
}
|
|
657
580
|
.overflow-hidden {
|
|
658
581
|
overflow: hidden;
|
|
659
582
|
}
|
|
660
583
|
.overflow-y-hidden {
|
|
661
584
|
overflow-y: hidden;
|
|
662
585
|
}
|
|
663
|
-
.rounded-\[4px\] {
|
|
664
|
-
border-radius: 4px;
|
|
665
|
-
}
|
|
666
586
|
.rounded-\[8px\] {
|
|
667
587
|
border-radius: 8px;
|
|
668
588
|
}
|
|
@@ -675,9 +595,6 @@
|
|
|
675
595
|
.rounded-\[15px\] {
|
|
676
596
|
border-radius: 15px;
|
|
677
597
|
}
|
|
678
|
-
.rounded-\[16px\] {
|
|
679
|
-
border-radius: 16px;
|
|
680
|
-
}
|
|
681
598
|
.rounded-\[18px\] {
|
|
682
599
|
border-radius: 18px;
|
|
683
600
|
}
|
|
@@ -721,10 +638,6 @@
|
|
|
721
638
|
border-top-style: var(--tw-border-style);
|
|
722
639
|
border-top-width: 8px;
|
|
723
640
|
}
|
|
724
|
-
.border-r {
|
|
725
|
-
border-right-style: var(--tw-border-style);
|
|
726
|
-
border-right-width: 1px;
|
|
727
|
-
}
|
|
728
641
|
.border-r-8 {
|
|
729
642
|
border-right-style: var(--tw-border-style);
|
|
730
643
|
border-right-width: 8px;
|
|
@@ -753,10 +666,6 @@
|
|
|
753
666
|
border-bottom-style: var(--tw-border-style);
|
|
754
667
|
border-bottom-width: 8px;
|
|
755
668
|
}
|
|
756
|
-
.border-l {
|
|
757
|
-
border-left-style: var(--tw-border-style);
|
|
758
|
-
border-left-width: 1px;
|
|
759
|
-
}
|
|
760
669
|
.border-l-8 {
|
|
761
670
|
border-left-style: var(--tw-border-style);
|
|
762
671
|
border-left-width: 8px;
|
|
@@ -773,9 +682,6 @@
|
|
|
773
682
|
--tw-border-style: none;
|
|
774
683
|
border-style: none;
|
|
775
684
|
}
|
|
776
|
-
.border-\[\#363c48\] {
|
|
777
|
-
border-color: #363c48;
|
|
778
|
-
}
|
|
779
685
|
.border-\[\#ccc\] {
|
|
780
686
|
border-color: #ccc;
|
|
781
687
|
}
|
|
@@ -794,24 +700,9 @@
|
|
|
794
700
|
.border-l-transparent {
|
|
795
701
|
border-left-color: transparent;
|
|
796
702
|
}
|
|
797
|
-
.bg-\[\#0C1421\] {
|
|
798
|
-
background-color: #0C1421;
|
|
799
|
-
}
|
|
800
|
-
.bg-\[\#2d374d\] {
|
|
801
|
-
background-color: #2d374d;
|
|
802
|
-
}
|
|
803
|
-
.bg-\[\#222b3d\] {
|
|
804
|
-
background-color: #222b3d;
|
|
805
|
-
}
|
|
806
703
|
.bg-\[\#E6E6E6\] {
|
|
807
704
|
background-color: #E6E6E6;
|
|
808
705
|
}
|
|
809
|
-
.bg-\[\#FF5C60\] {
|
|
810
|
-
background-color: #FF5C60;
|
|
811
|
-
}
|
|
812
|
-
.bg-\[\#FF8F45\] {
|
|
813
|
-
background-color: #FF8F45;
|
|
814
|
-
}
|
|
815
706
|
.bg-\[\#FFF2F2\] {
|
|
816
707
|
background-color: #FFF2F2;
|
|
817
708
|
}
|
|
@@ -830,9 +721,6 @@
|
|
|
830
721
|
.bg-\[lightgray\] {
|
|
831
722
|
background-color: lightgray;
|
|
832
723
|
}
|
|
833
|
-
.bg-transparent {
|
|
834
|
-
background-color: transparent;
|
|
835
|
-
}
|
|
836
724
|
.bg-\[length\:200\%_200\%\] {
|
|
837
725
|
background-size: 200% 200%;
|
|
838
726
|
}
|
|
@@ -855,9 +743,6 @@
|
|
|
855
743
|
.p-\[10px_15px\] {
|
|
856
744
|
padding: 10px 15px;
|
|
857
745
|
}
|
|
858
|
-
.p-\[14px\] {
|
|
859
|
-
padding: 14px;
|
|
860
|
-
}
|
|
861
746
|
.p-\[15px\] {
|
|
862
747
|
padding: 15px;
|
|
863
748
|
}
|
|
@@ -891,18 +776,9 @@
|
|
|
891
776
|
.px-\[15px\] {
|
|
892
777
|
padding-inline: 15px;
|
|
893
778
|
}
|
|
894
|
-
.px-\[16px\] {
|
|
895
|
-
padding-inline: 16px;
|
|
896
|
-
}
|
|
897
779
|
.px-\[20px\] {
|
|
898
780
|
padding-inline: 20px;
|
|
899
781
|
}
|
|
900
|
-
.px-\[22px\] {
|
|
901
|
-
padding-inline: 22px;
|
|
902
|
-
}
|
|
903
|
-
.py-\[2px\] {
|
|
904
|
-
padding-block: 2px;
|
|
905
|
-
}
|
|
906
782
|
.py-\[4px\] {
|
|
907
783
|
padding-block: 4px;
|
|
908
784
|
}
|
|
@@ -915,9 +791,6 @@
|
|
|
915
791
|
.py-\[8px\] {
|
|
916
792
|
padding-block: 8px;
|
|
917
793
|
}
|
|
918
|
-
.py-\[9px\] {
|
|
919
|
-
padding-block: 9px;
|
|
920
|
-
}
|
|
921
794
|
.py-\[10px\] {
|
|
922
795
|
padding-block: 10px;
|
|
923
796
|
}
|
|
@@ -933,9 +806,6 @@
|
|
|
933
806
|
.pt-\[10px\] {
|
|
934
807
|
padding-top: 10px;
|
|
935
808
|
}
|
|
936
|
-
.pt-\[14px\] {
|
|
937
|
-
padding-top: 14px;
|
|
938
|
-
}
|
|
939
809
|
.pt-\[20px\] {
|
|
940
810
|
padding-top: 20px;
|
|
941
811
|
}
|
|
@@ -951,9 +821,6 @@
|
|
|
951
821
|
.pt-\[50px\] {
|
|
952
822
|
padding-top: 50px;
|
|
953
823
|
}
|
|
954
|
-
.pr-\[10px\] {
|
|
955
|
-
padding-right: 10px;
|
|
956
|
-
}
|
|
957
824
|
.pr-\[15px\] {
|
|
958
825
|
padding-right: 15px;
|
|
959
826
|
}
|
|
@@ -963,9 +830,6 @@
|
|
|
963
830
|
.pr-\[22px\] {
|
|
964
831
|
padding-right: 22px;
|
|
965
832
|
}
|
|
966
|
-
.pb-\[6px\] {
|
|
967
|
-
padding-bottom: 6px;
|
|
968
|
-
}
|
|
969
833
|
.pb-\[7px\] {
|
|
970
834
|
padding-bottom: 7px;
|
|
971
835
|
}
|
|
@@ -984,9 +848,6 @@
|
|
|
984
848
|
.pl-\[6px\] {
|
|
985
849
|
padding-left: 6px;
|
|
986
850
|
}
|
|
987
|
-
.pl-\[22px\] {
|
|
988
|
-
padding-left: 22px;
|
|
989
|
-
}
|
|
990
851
|
.text-center {
|
|
991
852
|
text-align: center;
|
|
992
853
|
}
|
|
@@ -1002,6 +863,9 @@
|
|
|
1002
863
|
.text-right {
|
|
1003
864
|
text-align: right;
|
|
1004
865
|
}
|
|
866
|
+
.text-\[9px\] {
|
|
867
|
+
font-size: 9px;
|
|
868
|
+
}
|
|
1005
869
|
.text-\[10px\] {
|
|
1006
870
|
font-size: 10px;
|
|
1007
871
|
}
|
|
@@ -1023,9 +887,6 @@
|
|
|
1023
887
|
.text-\[14px\] {
|
|
1024
888
|
font-size: 14px;
|
|
1025
889
|
}
|
|
1026
|
-
.text-\[16px\] {
|
|
1027
|
-
font-size: 16px;
|
|
1028
|
-
}
|
|
1029
890
|
.text-\[17\.33px\] {
|
|
1030
891
|
font-size: 17.33px;
|
|
1031
892
|
}
|
|
@@ -1038,15 +899,6 @@
|
|
|
1038
899
|
.text-\[22px\] {
|
|
1039
900
|
font-size: 22px;
|
|
1040
901
|
}
|
|
1041
|
-
.text-\[24px\] {
|
|
1042
|
-
font-size: 24px;
|
|
1043
|
-
}
|
|
1044
|
-
.text-\[26px\] {
|
|
1045
|
-
font-size: 26px;
|
|
1046
|
-
}
|
|
1047
|
-
.text-\[28px\] {
|
|
1048
|
-
font-size: 28px;
|
|
1049
|
-
}
|
|
1050
902
|
.text-\[42px\] {
|
|
1051
903
|
font-size: 42px;
|
|
1052
904
|
}
|
|
@@ -1054,10 +906,6 @@
|
|
|
1054
906
|
--tw-leading: 1.3;
|
|
1055
907
|
line-height: 1.3;
|
|
1056
908
|
}
|
|
1057
|
-
.leading-\[14px\] {
|
|
1058
|
-
--tw-leading: 14px;
|
|
1059
|
-
line-height: 14px;
|
|
1060
|
-
}
|
|
1061
909
|
.leading-\[20px\] {
|
|
1062
910
|
--tw-leading: 20px;
|
|
1063
911
|
line-height: 20px;
|
|
@@ -1078,10 +926,6 @@
|
|
|
1078
926
|
--tw-leading: 1;
|
|
1079
927
|
line-height: 1;
|
|
1080
928
|
}
|
|
1081
|
-
.font-\[9px\] {
|
|
1082
|
-
--tw-font-weight: 9px;
|
|
1083
|
-
font-weight: 9px;
|
|
1084
|
-
}
|
|
1085
929
|
.font-\[14px\] {
|
|
1086
930
|
--tw-font-weight: 14px;
|
|
1087
931
|
font-weight: 14px;
|
|
@@ -1103,27 +947,12 @@
|
|
|
1103
947
|
.whitespace-nowrap {
|
|
1104
948
|
white-space: nowrap;
|
|
1105
949
|
}
|
|
1106
|
-
.text-\[\#1a1a1a\] {
|
|
1107
|
-
color: #1a1a1a;
|
|
1108
|
-
}
|
|
1109
|
-
.text-\[\#4a4a4a\] {
|
|
1110
|
-
color: #4a4a4a;
|
|
1111
|
-
}
|
|
1112
950
|
.text-\[\#9f9f9f\] {
|
|
1113
951
|
color: #9f9f9f;
|
|
1114
952
|
}
|
|
1115
|
-
.text-\[\#666\] {
|
|
1116
|
-
color: #666;
|
|
1117
|
-
}
|
|
1118
|
-
.text-\[\#272727\] {
|
|
1119
|
-
color: #272727;
|
|
1120
|
-
}
|
|
1121
953
|
.text-\[\#464647\] {
|
|
1122
954
|
color: #464647;
|
|
1123
955
|
}
|
|
1124
|
-
.text-\[\#FF8F45\] {
|
|
1125
|
-
color: #FF8F45;
|
|
1126
|
-
}
|
|
1127
956
|
.text-\[\#c0c0c0\] {
|
|
1128
957
|
color: #c0c0c0;
|
|
1129
958
|
}
|
|
@@ -1142,9 +971,6 @@
|
|
|
1142
971
|
.text-\[red\] {
|
|
1143
972
|
color: red;
|
|
1144
973
|
}
|
|
1145
|
-
.text-\[white\] {
|
|
1146
|
-
color: white;
|
|
1147
|
-
}
|
|
1148
974
|
.capitalize {
|
|
1149
975
|
text-transform: capitalize;
|
|
1150
976
|
}
|
|
@@ -1164,16 +990,9 @@
|
|
|
1164
990
|
.opacity-0 {
|
|
1165
991
|
opacity: 0%;
|
|
1166
992
|
}
|
|
1167
|
-
.opacity-50 {
|
|
1168
|
-
opacity: 50%;
|
|
1169
|
-
}
|
|
1170
993
|
.opacity-100 {
|
|
1171
994
|
opacity: 100%;
|
|
1172
995
|
}
|
|
1173
|
-
.outline {
|
|
1174
|
-
outline-style: var(--tw-outline-style);
|
|
1175
|
-
outline-width: 1px;
|
|
1176
|
-
}
|
|
1177
996
|
.grayscale {
|
|
1178
997
|
--tw-grayscale: grayscale(100%);
|
|
1179
998
|
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
|
@@ -1201,10 +1020,6 @@
|
|
|
1201
1020
|
transition-timing-function: var(--tw-ease, ease);
|
|
1202
1021
|
transition-duration: var(--tw-duration, 0s);
|
|
1203
1022
|
}
|
|
1204
|
-
.duration-200 {
|
|
1205
|
-
--tw-duration: 200ms;
|
|
1206
|
-
transition-duration: 200ms;
|
|
1207
|
-
}
|
|
1208
1023
|
.duration-300 {
|
|
1209
1024
|
--tw-duration: 300ms;
|
|
1210
1025
|
transition-duration: 300ms;
|
|
@@ -1213,11 +1028,6 @@
|
|
|
1213
1028
|
--tw-outline-style: none;
|
|
1214
1029
|
outline-style: none;
|
|
1215
1030
|
}
|
|
1216
|
-
.select-none {
|
|
1217
|
-
-webkit-user-select: none;
|
|
1218
|
-
-moz-user-select: none;
|
|
1219
|
-
user-select: none;
|
|
1220
|
-
}
|
|
1221
1031
|
.group-hover\:block {
|
|
1222
1032
|
&:is(:where(.group):hover *) {
|
|
1223
1033
|
@media (hover: hover) {
|
|
@@ -1357,19 +1167,6 @@
|
|
|
1357
1167
|
.hide-scrollbar::-webkit-scrollbar {
|
|
1358
1168
|
display: none;
|
|
1359
1169
|
}
|
|
1360
|
-
.kupos-time-dd > summary {
|
|
1361
|
-
list-style: none;
|
|
1362
|
-
}
|
|
1363
|
-
.kupos-time-dd > summary::-webkit-details-marker {
|
|
1364
|
-
display: none;
|
|
1365
|
-
}
|
|
1366
|
-
.kupos-time-chevron {
|
|
1367
|
-
transition: transform 200ms ease;
|
|
1368
|
-
flex-shrink: 0;
|
|
1369
|
-
}
|
|
1370
|
-
.kupos-time-dd[open] .kupos-time-chevron {
|
|
1371
|
-
transform: rotate(180deg);
|
|
1372
|
-
}
|
|
1373
1170
|
.hide-scrollbar {
|
|
1374
1171
|
-ms-overflow-style: none;
|
|
1375
1172
|
scrollbar-width: none;
|
|
@@ -1442,11 +1239,6 @@
|
|
|
1442
1239
|
syntax: "*";
|
|
1443
1240
|
inherits: false;
|
|
1444
1241
|
}
|
|
1445
|
-
@property --tw-outline-style {
|
|
1446
|
-
syntax: "*";
|
|
1447
|
-
inherits: false;
|
|
1448
|
-
initial-value: solid;
|
|
1449
|
-
}
|
|
1450
1242
|
@property --tw-blur {
|
|
1451
1243
|
syntax: "*";
|
|
1452
1244
|
inherits: false;
|
|
@@ -1538,7 +1330,6 @@
|
|
|
1538
1330
|
--tw-numeric-figure: initial;
|
|
1539
1331
|
--tw-numeric-spacing: initial;
|
|
1540
1332
|
--tw-numeric-fraction: initial;
|
|
1541
|
-
--tw-outline-style: solid;
|
|
1542
1333
|
--tw-blur: initial;
|
|
1543
1334
|
--tw-brightness: initial;
|
|
1544
1335
|
--tw-contrast: initial;
|
|
@@ -14,6 +14,7 @@ interface ExpandedDropdownProps {
|
|
|
14
14
|
ladiesBookedSeats?: string;
|
|
15
15
|
isDpEnabled?: boolean;
|
|
16
16
|
renderIcon?: any;
|
|
17
|
+
operatorLabel?: string;
|
|
17
18
|
}
|
|
18
|
-
declare function ExpandedDropdown({ serviceItem, isPeru, translation, getAnimationIcon, isChangeTicket, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, }: ExpandedDropdownProps): React.ReactElement;
|
|
19
|
+
declare function ExpandedDropdown({ serviceItem, isPeru, translation, getAnimationIcon, isChangeTicket, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, operatorLabel, }: ExpandedDropdownProps): React.ReactElement;
|
|
19
20
|
export default ExpandedDropdown;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAnimationIcon, isChangeTicket = false, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, }) {
|
|
2
|
+
function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAnimationIcon, isChangeTicket = false, isSoldOut, ladiesBookedSeats, isDpEnabled, renderIcon, operatorLabel, }) {
|
|
3
3
|
const hasPetInfo = serviceItem.pet_seat_info &&
|
|
4
4
|
Object.keys(serviceItem.pet_seat_info).length > 0;
|
|
5
5
|
return (React.createElement("div", { className: "px-[15px] pt-[26px] pb-[14px] -mt-[16px] pt-[35px] relative -z-9", style: {
|
|
@@ -11,14 +11,16 @@ function ExpandedDropdown({ serviceItem, isPeru = false, translation = {}, getAn
|
|
|
11
11
|
React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
|
|
12
12
|
React.createElement("span", null,
|
|
13
13
|
React.createElement("span", { className: "bold-text" }, "Pasaje flexible:"),
|
|
14
|
-
" Tu pasaje puede ser cambiado
|
|
14
|
+
" Tu pasaje puede ser cambiado sin costo",
|
|
15
15
|
" ",
|
|
16
16
|
React.createElement("span", { className: "bold-text" },
|
|
17
17
|
"hasta ",
|
|
18
18
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.change_ticket_hours) || 6,
|
|
19
19
|
" horas antes"),
|
|
20
20
|
" ",
|
|
21
|
-
"de la salida del bus. El monto ser\u00E1 reembolsado a tu billetera
|
|
21
|
+
"de la salida del bus. El monto ser\u00E1 reembolsado a tu billetera",
|
|
22
|
+
" ", operatorLabel !== null && operatorLabel !== void 0 ? operatorLabel : "kupospay",
|
|
23
|
+
"."))) : (React.createElement("div", { className: "flex gap-[8px] text-[13.33px]" },
|
|
22
24
|
React.createElement("span", null, renderIcon("changeTicketIcon", "16px")),
|
|
23
25
|
React.createElement("span", null,
|
|
24
26
|
React.createElement("span", null,
|
package/dist/ui/OfferBanner.d.ts
CHANGED
|
@@ -10,8 +10,6 @@ interface OfferBannerProps {
|
|
|
10
10
|
viewersConfig: ServiceItemProps["viewersConfig"];
|
|
11
11
|
getAnimationIcon: (name: string) => any;
|
|
12
12
|
showLoginOption?: boolean;
|
|
13
|
-
isNewUiEnabled?: boolean;
|
|
14
|
-
colors: any;
|
|
15
13
|
}
|
|
16
14
|
declare const OfferBanner: React.FC<OfferBannerProps>;
|
|
17
15
|
export default OfferBanner;
|
package/dist/ui/OfferBanner.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
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, showLoginOption,
|
|
5
|
-
var _a, _b, _c, _d;
|
|
6
|
-
return (React.createElement("div", { className: "text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[
|
|
7
|
-
background:
|
|
4
|
+
const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLoggedIn, showLoginModal, viewersConfig, getAnimationIcon, showLoginOption, }) => {
|
|
5
|
+
var _a, _b, _c, _d, _e, _f;
|
|
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: {
|
|
7
|
+
background: offerGradient,
|
|
8
8
|
opacity: isSoldOut ? 0.5 : 1,
|
|
9
9
|
// zIndex: 0,
|
|
10
10
|
} },
|
|
@@ -13,7 +13,7 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLogg
|
|
|
13
13
|
Object.keys((_a = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _a !== void 0 ? _a : {}).length === 0 &&
|
|
14
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]" },
|
|
15
15
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("starAnimation"), width: "18px", height: "18px" }),
|
|
16
|
-
React.createElement("span", null, "Servicio popular entre los usuarios"))) : (
|
|
16
|
+
React.createElement("span", null, "Servicio popular entre los usuarios"))) : (React.createElement("div", { className: "flex items-center" },
|
|
17
17
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("bombAnimation"), width: "18px", height: "18px" }),
|
|
18
18
|
React.createElement("div", { className: "flex items-center mt-[2px]" },
|
|
19
19
|
React.createElement("span", { className: "bold-text", style: {
|
|
@@ -23,24 +23,19 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLogg
|
|
|
23
23
|
? ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "").slice(0, 30) + "..."
|
|
24
24
|
: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "",
|
|
25
25
|
" ",
|
|
26
|
-
isLoggedIn && showLoginOption ? null :
|
|
26
|
+
isLoggedIn && showLoginOption ? null : Object.keys((_c = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _c !== void 0 ? _c : {}).length > 0 ||
|
|
27
|
+
((_d = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _d !== void 0 ? _d : []).length >
|
|
28
|
+
0 ? null : (React.createElement("span", { onClick: showLoginModal, className: "cursor-pointer" }, "- registro")),
|
|
27
29
|
" ",
|
|
28
30
|
"\u00A0"),
|
|
29
31
|
" ",
|
|
30
|
-
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "|" : "",
|
|
32
|
+
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "| " : "",
|
|
31
33
|
"Termina en\u00A0",
|
|
32
34
|
React.createElement("span", { className: "bold-text text-end", ref: (node) => CommonService.startCountdown(node, 599), style: {
|
|
33
35
|
fontVariantNumeric: "tabular-nums",
|
|
34
36
|
display: "inline-block",
|
|
35
|
-
} }))))
|
|
36
|
-
|
|
37
|
-
React.createElement(LottiePlayer, { animationData: getAnimationIcon("promoAnim"), width: "18px", height: "18px" }),
|
|
38
|
-
React.createElement("div", { className: "flex items-center mt-[2px]" },
|
|
39
|
-
React.createElement("span", { className: "bold-text", style: {
|
|
40
|
-
marginLeft: (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) ? "6px" : "3px",
|
|
41
|
-
} }, ((serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) || "")),
|
|
42
|
-
" "))))),
|
|
43
|
-
(isNewUiEnabled || (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled)) && (React.createElement("div", { className: "flex items-center" },
|
|
37
|
+
} }))))),
|
|
38
|
+
React.createElement("div", { className: "flex items-center" },
|
|
44
39
|
React.createElement(LottiePlayer, { animationData: getAnimationIcon("dotAnimation"), width: "12px", height: "12px" }),
|
|
45
40
|
React.createElement("span", { className: "ml-[6px]" },
|
|
46
41
|
React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startViewerCount(node, viewersConfig), style: { fontVariantNumeric: "tabular-nums" } }),
|
|
@@ -52,13 +47,13 @@ const OfferBanner = ({ offerGradient, isSoldOut, serviceItem, renderIcon, isLogg
|
|
|
52
47
|
" ",
|
|
53
48
|
React.createElement("span", { className: "" },
|
|
54
49
|
(serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.is_dp_enabled) &&
|
|
55
|
-
Object.keys((
|
|
50
|
+
Object.keys((_e = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discount_percents) !== null && _e !== void 0 ? _e : {}).length ===
|
|
56
51
|
0 &&
|
|
57
|
-
((
|
|
52
|
+
((_f = serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.dp_discounted_seats) !== null && _f !== void 0 ? _f : []).length === 0
|
|
58
53
|
? null
|
|
59
54
|
: "Quedan pocos • ",
|
|
60
55
|
React.createElement("span", { className: "bold-text", ref: (node) => CommonService.startComprandoCount(node, 4, 16), style: { fontVariantNumeric: "tabular-nums" } }),
|
|
61
56
|
" ",
|
|
62
|
-
"comprando")))))))
|
|
57
|
+
"comprando")))))));
|
|
63
58
|
};
|
|
64
59
|
export default OfferBanner;
|
|
@@ -3,6 +3,8 @@ interface SeatType {
|
|
|
3
3
|
label: string;
|
|
4
4
|
fare: number;
|
|
5
5
|
key: any;
|
|
6
|
+
apiSeatType?: string;
|
|
7
|
+
api_seat_type?: string;
|
|
6
8
|
}
|
|
7
9
|
interface SeatSectionProps {
|
|
8
10
|
seatTypes: SeatType[];
|
|
@@ -16,6 +18,10 @@ interface SeatSectionProps {
|
|
|
16
18
|
serviceItem?: any;
|
|
17
19
|
renderIcon?: (iconKey: string, size?: string) => React.ReactNode;
|
|
18
20
|
discountSeatPriceColor?: string;
|
|
21
|
+
isTrain?: boolean;
|
|
22
|
+
selectedSeatKey?: any;
|
|
23
|
+
onSeatSelect?: (key: any, price: number, seatKey: string, apiSeatType?: string) => void;
|
|
24
|
+
topLabelColor?: string;
|
|
19
25
|
}
|
|
20
|
-
declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, }: SeatSectionProps): React.ReactElement;
|
|
26
|
+
declare function SeatSection({ seatTypes, availableSeats, isSoldOut, priceColor, currencySign, removeDuplicateSeats, selectedSeatKey, onSeatSelect, isPeru, serviceItem, renderIcon, dpSeatColor, discountSeatPriceColor, isTrain, topLabelColor, }: SeatSectionProps): React.ReactElement;
|
|
21
27
|
export default SeatSection;
|