@sikka/hawa 0.0.105 → 0.0.107
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/styles.css +110 -30
- package/es/blocks/Misc/EmptyState.d.ts +4 -0
- package/es/blocks/Misc/index.d.ts +1 -0
- package/es/elements/DragDropImages.d.ts +1 -1
- package/es/elements/HawaCardInput.d.ts +25 -0
- package/es/elements/HawaMenu.d.ts +2 -1
- package/es/elements/HawaTimeline.d.ts +8 -0
- package/es/elements/index.d.ts +3 -1
- package/es/hooks/index.d.ts +1 -0
- package/es/hooks/useDiscloser.d.ts +7 -0
- package/es/index.d.ts +1 -0
- package/es/index.es.js +1 -1
- package/es/layout/HawaContainer.d.ts +2 -0
- package/lib/blocks/Misc/EmptyState.d.ts +4 -0
- package/lib/blocks/Misc/index.d.ts +1 -0
- package/lib/elements/DragDropImages.d.ts +1 -1
- package/lib/elements/HawaCardInput.d.ts +25 -0
- package/lib/elements/HawaMenu.d.ts +2 -1
- package/lib/elements/HawaTimeline.d.ts +8 -0
- package/lib/elements/index.d.ts +3 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/useDiscloser.d.ts +7 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -1
- package/lib/layout/HawaContainer.d.ts +2 -0
- package/package.json +3 -2
- package/src/blocks/Misc/EmptyState.tsx +24 -0
- package/src/blocks/Misc/NotFound.tsx +15 -12
- package/src/blocks/Misc/index.ts +2 -1
- package/src/elements/DragDropImages.tsx +3 -3
- package/src/elements/HawaAccordian.tsx +21 -10
- package/src/elements/HawaCardInput.tsx +317 -0
- package/src/elements/HawaItemCard.tsx +6 -2
- package/src/elements/HawaMenu.tsx +10 -2
- package/src/elements/HawaTimeline.tsx +82 -0
- package/src/elements/index.ts +33 -30
- package/src/hooks/index.ts +1 -0
- package/src/hooks/useDiscloser.ts +25 -0
- package/src/index.ts +2 -1
- package/src/layout/HawaContainer.tsx +18 -2
- package/src/styles.css +110 -30
- package/storybook-static/{209.d29fd715.iframe.bundle.js → 209.05314e10.iframe.bundle.js} +2 -2
- package/storybook-static/{209.d29fd715.iframe.bundle.js.LICENSE.txt → 209.05314e10.iframe.bundle.js.LICENSE.txt} +0 -0
- package/storybook-static/iframe.html +1 -1
- package/storybook-static/main.7a1984b7.iframe.bundle.js +1 -0
- package/storybook-static/project.json +1 -1
- package/tsconfig.json +30 -25
- package/storybook-static/main.a1546405.iframe.bundle.js +0 -1
package/dist/styles.css
CHANGED
|
@@ -487,6 +487,9 @@ video {
|
|
|
487
487
|
.pointer-events-none {
|
|
488
488
|
pointer-events: none;
|
|
489
489
|
}
|
|
490
|
+
.visible {
|
|
491
|
+
visibility: visible;
|
|
492
|
+
}
|
|
490
493
|
.invisible {
|
|
491
494
|
visibility: hidden;
|
|
492
495
|
}
|
|
@@ -511,6 +514,12 @@ video {
|
|
|
511
514
|
.top-10 {
|
|
512
515
|
top: 2.5rem;
|
|
513
516
|
}
|
|
517
|
+
.right-2 {
|
|
518
|
+
right: 0.5rem;
|
|
519
|
+
}
|
|
520
|
+
.top-1\/2 {
|
|
521
|
+
top: 50%;
|
|
522
|
+
}
|
|
514
523
|
.top-0 {
|
|
515
524
|
top: 0px;
|
|
516
525
|
}
|
|
@@ -520,9 +529,6 @@ video {
|
|
|
520
529
|
.bottom-0 {
|
|
521
530
|
bottom: 0px;
|
|
522
531
|
}
|
|
523
|
-
.top-1\/2 {
|
|
524
|
-
top: 50%;
|
|
525
|
-
}
|
|
526
532
|
.left-1\/2 {
|
|
527
533
|
left: 50%;
|
|
528
534
|
}
|
|
@@ -550,9 +556,6 @@ video {
|
|
|
550
556
|
.top-2 {
|
|
551
557
|
top: 0.5rem;
|
|
552
558
|
}
|
|
553
|
-
.right-2 {
|
|
554
|
-
right: 0.5rem;
|
|
555
|
-
}
|
|
556
559
|
.-left-1 {
|
|
557
560
|
left: -0.25rem;
|
|
558
561
|
}
|
|
@@ -616,6 +619,9 @@ video {
|
|
|
616
619
|
.mb-4 {
|
|
617
620
|
margin-bottom: 1rem;
|
|
618
621
|
}
|
|
622
|
+
.mb-0 {
|
|
623
|
+
margin-bottom: 0px;
|
|
624
|
+
}
|
|
619
625
|
.mt-0\.5 {
|
|
620
626
|
margin-top: 0.125rem;
|
|
621
627
|
}
|
|
@@ -649,12 +655,15 @@ video {
|
|
|
649
655
|
.mt-2 {
|
|
650
656
|
margin-top: 0.5rem;
|
|
651
657
|
}
|
|
652
|
-
.mb-0 {
|
|
653
|
-
margin-bottom: 0px;
|
|
654
|
-
}
|
|
655
658
|
.mb-5 {
|
|
656
659
|
margin-bottom: 1.25rem;
|
|
657
660
|
}
|
|
661
|
+
.ml-6 {
|
|
662
|
+
margin-left: 1.5rem;
|
|
663
|
+
}
|
|
664
|
+
.mr-4 {
|
|
665
|
+
margin-right: 1rem;
|
|
666
|
+
}
|
|
658
667
|
.mt-5 {
|
|
659
668
|
margin-top: 1.25rem;
|
|
660
669
|
}
|
|
@@ -737,12 +746,21 @@ video {
|
|
|
737
746
|
.h-10 {
|
|
738
747
|
height: 2.5rem;
|
|
739
748
|
}
|
|
749
|
+
.h-32 {
|
|
750
|
+
height: 8rem;
|
|
751
|
+
}
|
|
752
|
+
.h-0\.5 {
|
|
753
|
+
height: 0.125rem;
|
|
754
|
+
}
|
|
740
755
|
.h-9 {
|
|
741
756
|
height: 2.25rem;
|
|
742
757
|
}
|
|
743
758
|
.h-12 {
|
|
744
759
|
height: 3rem;
|
|
745
760
|
}
|
|
761
|
+
.h-20 {
|
|
762
|
+
height: 5rem;
|
|
763
|
+
}
|
|
746
764
|
.h-96 {
|
|
747
765
|
height: 24rem;
|
|
748
766
|
}
|
|
@@ -790,18 +808,24 @@ video {
|
|
|
790
808
|
.w-11 {
|
|
791
809
|
width: 2.75rem;
|
|
792
810
|
}
|
|
811
|
+
.w-1 {
|
|
812
|
+
width: 0.25rem;
|
|
813
|
+
}
|
|
814
|
+
.w-10 {
|
|
815
|
+
width: 2.5rem;
|
|
816
|
+
}
|
|
793
817
|
.w-1\/3 {
|
|
794
818
|
width: 33.333333%;
|
|
795
819
|
}
|
|
796
820
|
.w-80 {
|
|
797
821
|
width: 20rem;
|
|
798
822
|
}
|
|
799
|
-
.w-10 {
|
|
800
|
-
width: 2.5rem;
|
|
801
|
-
}
|
|
802
823
|
.w-12 {
|
|
803
824
|
width: 3rem;
|
|
804
825
|
}
|
|
826
|
+
.w-20 {
|
|
827
|
+
width: 5rem;
|
|
828
|
+
}
|
|
805
829
|
.min-w-max {
|
|
806
830
|
min-width: -moz-max-content;
|
|
807
831
|
min-width: max-content;
|
|
@@ -838,6 +862,10 @@ video {
|
|
|
838
862
|
.shrink-0 {
|
|
839
863
|
flex-shrink: 0;
|
|
840
864
|
}
|
|
865
|
+
.translate-y-1\/2 {
|
|
866
|
+
--tw-translate-y: 50%;
|
|
867
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
868
|
+
}
|
|
841
869
|
.-translate-x-1\/2 {
|
|
842
870
|
--tw-translate-x: -50%;
|
|
843
871
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
@@ -888,6 +916,9 @@ video {
|
|
|
888
916
|
.flex-wrap {
|
|
889
917
|
flex-wrap: wrap;
|
|
890
918
|
}
|
|
919
|
+
.content-center {
|
|
920
|
+
align-content: center;
|
|
921
|
+
}
|
|
891
922
|
.items-start {
|
|
892
923
|
align-items: flex-start;
|
|
893
924
|
}
|
|
@@ -897,6 +928,9 @@ video {
|
|
|
897
928
|
.items-baseline {
|
|
898
929
|
align-items: baseline;
|
|
899
930
|
}
|
|
931
|
+
.items-stretch {
|
|
932
|
+
align-items: stretch;
|
|
933
|
+
}
|
|
900
934
|
.justify-end {
|
|
901
935
|
justify-content: flex-end;
|
|
902
936
|
}
|
|
@@ -909,12 +943,15 @@ video {
|
|
|
909
943
|
.justify-evenly {
|
|
910
944
|
justify-content: space-evenly;
|
|
911
945
|
}
|
|
912
|
-
.gap-
|
|
913
|
-
gap: 0.
|
|
946
|
+
.gap-3 {
|
|
947
|
+
gap: 0.75rem;
|
|
914
948
|
}
|
|
915
949
|
.gap-2 {
|
|
916
950
|
gap: 0.5rem;
|
|
917
951
|
}
|
|
952
|
+
.gap-1 {
|
|
953
|
+
gap: 0.25rem;
|
|
954
|
+
}
|
|
918
955
|
.gap-x-3 {
|
|
919
956
|
-moz-column-gap: 0.75rem;
|
|
920
957
|
column-gap: 0.75rem;
|
|
@@ -999,6 +1036,9 @@ video {
|
|
|
999
1036
|
.rounded {
|
|
1000
1037
|
border-radius: 0.25rem;
|
|
1001
1038
|
}
|
|
1039
|
+
.rounded-3xl {
|
|
1040
|
+
border-radius: 1.5rem;
|
|
1041
|
+
}
|
|
1002
1042
|
.rounded-t-xl {
|
|
1003
1043
|
border-top-left-radius: 0.75rem;
|
|
1004
1044
|
border-top-right-radius: 0.75rem;
|
|
@@ -1119,6 +1159,10 @@ video {
|
|
|
1119
1159
|
--tw-border-opacity: 1;
|
|
1120
1160
|
border-color: rgb(37 99 235 / var(--tw-border-opacity));
|
|
1121
1161
|
}
|
|
1162
|
+
.border-primary-200 {
|
|
1163
|
+
--tw-border-opacity: 1;
|
|
1164
|
+
border-color: rgb(196 222 253 / var(--tw-border-opacity));
|
|
1165
|
+
}
|
|
1122
1166
|
.border-t-white {
|
|
1123
1167
|
--tw-border-opacity: 1;
|
|
1124
1168
|
border-top-color: rgb(255 255 255 / var(--tw-border-opacity));
|
|
@@ -1174,17 +1218,33 @@ video {
|
|
|
1174
1218
|
--tw-bg-opacity: 1;
|
|
1175
1219
|
background-color: rgb(163 208 57 / var(--tw-bg-opacity));
|
|
1176
1220
|
}
|
|
1177
|
-
.bg-
|
|
1221
|
+
.bg-red-200 {
|
|
1178
1222
|
--tw-bg-opacity: 1;
|
|
1179
|
-
background-color: rgb(
|
|
1223
|
+
background-color: rgb(254 202 202 / var(--tw-bg-opacity));
|
|
1224
|
+
}
|
|
1225
|
+
.bg-gray-50 {
|
|
1226
|
+
--tw-bg-opacity: 1;
|
|
1227
|
+
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
|
|
1228
|
+
}
|
|
1229
|
+
.bg-red-700 {
|
|
1230
|
+
--tw-bg-opacity: 1;
|
|
1231
|
+
background-color: rgb(185 28 28 / var(--tw-bg-opacity));
|
|
1232
|
+
}
|
|
1233
|
+
.bg-red-300 {
|
|
1234
|
+
--tw-bg-opacity: 1;
|
|
1235
|
+
background-color: rgb(252 165 165 / var(--tw-bg-opacity));
|
|
1236
|
+
}
|
|
1237
|
+
.bg-red-400 {
|
|
1238
|
+
--tw-bg-opacity: 1;
|
|
1239
|
+
background-color: rgb(248 113 113 / var(--tw-bg-opacity));
|
|
1180
1240
|
}
|
|
1181
1241
|
.bg-red-500 {
|
|
1182
1242
|
--tw-bg-opacity: 1;
|
|
1183
1243
|
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
|
|
1184
1244
|
}
|
|
1185
|
-
.bg-
|
|
1245
|
+
.bg-blue-200 {
|
|
1186
1246
|
--tw-bg-opacity: 1;
|
|
1187
|
-
background-color: rgb(
|
|
1247
|
+
background-color: rgb(191 219 254 / var(--tw-bg-opacity));
|
|
1188
1248
|
}
|
|
1189
1249
|
.bg-primary-500 {
|
|
1190
1250
|
--tw-bg-opacity: 1;
|
|
@@ -1198,6 +1258,14 @@ video {
|
|
|
1198
1258
|
--tw-bg-opacity: 1;
|
|
1199
1259
|
background-color: rgb(37 99 235 / var(--tw-bg-opacity));
|
|
1200
1260
|
}
|
|
1261
|
+
.bg-primary-200 {
|
|
1262
|
+
--tw-bg-opacity: 1;
|
|
1263
|
+
background-color: rgb(196 222 253 / var(--tw-bg-opacity));
|
|
1264
|
+
}
|
|
1265
|
+
.bg-primary-400 {
|
|
1266
|
+
--tw-bg-opacity: 1;
|
|
1267
|
+
background-color: rgb(116 177 251 / var(--tw-bg-opacity));
|
|
1268
|
+
}
|
|
1201
1269
|
.bg-primary-300 {
|
|
1202
1270
|
--tw-bg-opacity: 1;
|
|
1203
1271
|
background-color: rgb(156 199 252 / var(--tw-bg-opacity));
|
|
@@ -1233,12 +1301,12 @@ video {
|
|
|
1233
1301
|
.p-0 {
|
|
1234
1302
|
padding: 0px;
|
|
1235
1303
|
}
|
|
1236
|
-
.p-3 {
|
|
1237
|
-
padding: 0.75rem;
|
|
1238
|
-
}
|
|
1239
1304
|
.p-2\.5 {
|
|
1240
1305
|
padding: 0.625rem;
|
|
1241
1306
|
}
|
|
1307
|
+
.p-3 {
|
|
1308
|
+
padding: 0.75rem;
|
|
1309
|
+
}
|
|
1242
1310
|
.p-10 {
|
|
1243
1311
|
padding: 2.5rem;
|
|
1244
1312
|
}
|
|
@@ -1523,13 +1591,30 @@ video {
|
|
|
1523
1591
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1524
1592
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1525
1593
|
}
|
|
1594
|
+
.ring-2 {
|
|
1595
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1596
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1597
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1598
|
+
}
|
|
1526
1599
|
.ring-blue-200 {
|
|
1527
1600
|
--tw-ring-opacity: 1;
|
|
1528
1601
|
--tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));
|
|
1529
1602
|
}
|
|
1603
|
+
.ring-primary-200 {
|
|
1604
|
+
--tw-ring-opacity: 1;
|
|
1605
|
+
--tw-ring-color: rgb(196 222 253 / var(--tw-ring-opacity));
|
|
1606
|
+
}
|
|
1530
1607
|
.ring-offset-1 {
|
|
1531
1608
|
--tw-ring-offset-width: 1px;
|
|
1532
1609
|
}
|
|
1610
|
+
.ring-offset-2 {
|
|
1611
|
+
--tw-ring-offset-width: 2px;
|
|
1612
|
+
}
|
|
1613
|
+
.transition-all {
|
|
1614
|
+
transition-property: all;
|
|
1615
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1616
|
+
transition-duration: 150ms;
|
|
1617
|
+
}
|
|
1533
1618
|
.transition-opacity {
|
|
1534
1619
|
transition-property: opacity;
|
|
1535
1620
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
@@ -1542,11 +1627,6 @@ video {
|
|
|
1542
1627
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1543
1628
|
transition-duration: 150ms;
|
|
1544
1629
|
}
|
|
1545
|
-
.transition-all {
|
|
1546
|
-
transition-property: all;
|
|
1547
|
-
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1548
|
-
transition-duration: 150ms;
|
|
1549
|
-
}
|
|
1550
1630
|
.duration-300 {
|
|
1551
1631
|
transition-duration: 300ms;
|
|
1552
1632
|
}
|
|
@@ -1910,6 +1990,10 @@ body {
|
|
|
1910
1990
|
--tw-ring-opacity: 1;
|
|
1911
1991
|
--tw-ring-color: rgb(5 74 158 / var(--tw-ring-opacity));
|
|
1912
1992
|
}
|
|
1993
|
+
.dark .dark\:focus\:ring-blue-500:focus {
|
|
1994
|
+
--tw-ring-opacity: 1;
|
|
1995
|
+
--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity));
|
|
1996
|
+
}
|
|
1913
1997
|
.dark .dark\:focus\:ring-blue-600:focus {
|
|
1914
1998
|
--tw-ring-opacity: 1;
|
|
1915
1999
|
--tw-ring-color: rgb(37 99 235 / var(--tw-ring-opacity));
|
|
@@ -1918,10 +2002,6 @@ body {
|
|
|
1918
2002
|
--tw-ring-opacity: 1;
|
|
1919
2003
|
--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
|
|
1920
2004
|
}
|
|
1921
|
-
.dark .dark\:focus\:ring-blue-500:focus {
|
|
1922
|
-
--tw-ring-opacity: 1;
|
|
1923
|
-
--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity));
|
|
1924
|
-
}
|
|
1925
2005
|
.dark .dark\:focus\:ring-blue-900:focus {
|
|
1926
2006
|
--tw-ring-opacity: 1;
|
|
1927
2007
|
--tw-ring-color: rgb(30 58 138 / var(--tw-ring-opacity));
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const HawaCardInput: ({ cardHolder, cardMonth, cardYear, cardCvv, rememberMe, onUpdateState, cardNumberRef, cardHolderRef, cardDateRef, cardCvvRef, rememberMeRef, onCardInputFocus, onCardInputBlur, children, handlePaymentPayfort, selectedPaymentMethod, isRegister, accessCode, shaRequestPassphrase, transaction, signature, isCheckout, }: {
|
|
3
|
+
cardHolder: any;
|
|
4
|
+
cardMonth: any;
|
|
5
|
+
cardYear: any;
|
|
6
|
+
cardCvv: any;
|
|
7
|
+
rememberMe: any;
|
|
8
|
+
onUpdateState: any;
|
|
9
|
+
cardNumberRef: any;
|
|
10
|
+
cardHolderRef: any;
|
|
11
|
+
cardDateRef: any;
|
|
12
|
+
cardCvvRef: any;
|
|
13
|
+
rememberMeRef: any;
|
|
14
|
+
onCardInputFocus: any;
|
|
15
|
+
onCardInputBlur: any;
|
|
16
|
+
children: any;
|
|
17
|
+
handlePaymentPayfort: any;
|
|
18
|
+
selectedPaymentMethod: any;
|
|
19
|
+
isRegister: any;
|
|
20
|
+
accessCode: any;
|
|
21
|
+
shaRequestPassphrase: any;
|
|
22
|
+
transaction: any;
|
|
23
|
+
signature: any;
|
|
24
|
+
isCheckout: any;
|
|
25
|
+
}) => JSX.Element;
|
|
@@ -6,7 +6,8 @@ interface TMenuTypes {
|
|
|
6
6
|
headerTitle?: string;
|
|
7
7
|
headerSubtitle?: string;
|
|
8
8
|
open?: boolean;
|
|
9
|
-
handleClose?: (
|
|
9
|
+
handleClose?: () => void;
|
|
10
|
+
handleOpen: () => void;
|
|
10
11
|
anchor?: any;
|
|
11
12
|
children?: ReactNode;
|
|
12
13
|
buttonPosition?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
|
package/es/elements/index.d.ts
CHANGED
|
@@ -6,7 +6,6 @@ export * from "./HawaChip";
|
|
|
6
6
|
export * from "./HawaSettingsRow";
|
|
7
7
|
export * from "./HawaSelect";
|
|
8
8
|
export * from "./HawaRange";
|
|
9
|
-
export * from "./HawaTextField";
|
|
10
9
|
export * from "./HawaTypography";
|
|
11
10
|
export * from "./HawaAlert";
|
|
12
11
|
export * from "./HawaTable";
|
|
@@ -23,6 +22,9 @@ export * from "./HawaModal";
|
|
|
23
22
|
export * from "./HawaMenu";
|
|
24
23
|
export * from "./HawaDrawer";
|
|
25
24
|
export * from "./HawaCopyrights";
|
|
25
|
+
export * from "./HawaTimeline";
|
|
26
|
+
export * from "./HawaTextField";
|
|
27
|
+
export * from "./HawaCardInput";
|
|
26
28
|
export * from "./HawaItemCard";
|
|
27
29
|
export * from "./HawaPricingCard";
|
|
28
30
|
export * from "./HawaAdCard";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./useDiscloser";
|
package/es/index.d.ts
CHANGED