@sikka/hawa 0.0.264 → 0.0.266
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 +77 -10
- package/es/elements/HawaAlert.d.ts +2 -0
- package/es/elements/HawaButton.d.ts +3 -1
- package/es/elements/HawaCodeBlock.d.ts +1 -0
- package/es/elements/HawaInlineCode.d.ts +6 -0
- package/es/elements/Timeline.d.ts +13 -0
- package/es/elements/index.d.ts +6 -4
- package/es/index.es.js +3 -3
- package/es/layout/HawaAppLayoutSimplified.d.ts +2 -0
- package/lib/elements/HawaAlert.d.ts +2 -0
- package/lib/elements/HawaButton.d.ts +3 -1
- package/lib/elements/HawaCodeBlock.d.ts +1 -0
- package/lib/elements/HawaInlineCode.d.ts +6 -0
- package/lib/elements/Timeline.d.ts +13 -0
- package/lib/elements/index.d.ts +6 -4
- package/lib/index.js +3 -3
- package/lib/layout/HawaAppLayoutSimplified.d.ts +2 -0
- package/package.json +2 -1
- package/src/elements/HawaAlert.tsx +73 -51
- package/src/elements/HawaButton.tsx +97 -49
- package/src/elements/HawaCodeBlock.tsx +68 -19
- package/src/elements/HawaInlineCode.tsx +9 -0
- package/src/elements/HawaMenu.tsx +2 -2
- package/src/elements/Timeline.tsx +35 -0
- package/src/elements/index.ts +6 -4
- package/src/layout/HawaAppLayoutSimplified.tsx +98 -82
- package/src/styles.css +77 -10
- package/src/tailwind.css +18 -0
- package/es/stories/ElementsStories/Buttons.stories.d.ts +0 -24
- package/lib/stories/ElementsStories/Buttons.stories.d.ts +0 -24
package/dist/styles.css
CHANGED
|
@@ -403,6 +403,24 @@ video {
|
|
|
403
403
|
var(--border-radius) - calc(var(--border-radius) / 3)
|
|
404
404
|
);
|
|
405
405
|
}
|
|
406
|
+
|
|
407
|
+
.inline-code {
|
|
408
|
+
font-size: 0.75rem;
|
|
409
|
+
/* color: theme("colors.slate.500"); */
|
|
410
|
+
/* background-color: theme("colors.stone.100"); */
|
|
411
|
+
border-radius: var(--border-radius);
|
|
412
|
+
/* padding-left: theme("spacing[1.5]");
|
|
413
|
+
padding-right: theme("spacing[1.5]");
|
|
414
|
+
padding-top: theme("spacing.1");
|
|
415
|
+
padding-bottom: theme("spacing.1"); */
|
|
416
|
+
padding: 0.25rem 0.375rem;
|
|
417
|
+
/* margin: theme("spacing.0") theme("spacing.1"); */
|
|
418
|
+
|
|
419
|
+
border: #d1d5db 1px solid;
|
|
420
|
+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
|
|
421
|
+
Liberation Mono, Courier New, monospace;
|
|
422
|
+
}
|
|
423
|
+
|
|
406
424
|
input[type="number"]::-webkit-inner-spin-button,
|
|
407
425
|
input[type="number"]::-webkit-outer-spin-button {
|
|
408
426
|
-webkit-appearance: none;
|
|
@@ -597,6 +615,9 @@ video {
|
|
|
597
615
|
.-left-1 {
|
|
598
616
|
left: -0.25rem;
|
|
599
617
|
}
|
|
618
|
+
.-left-1\.5 {
|
|
619
|
+
left: -0.375rem;
|
|
620
|
+
}
|
|
600
621
|
.-right-10 {
|
|
601
622
|
right: -2.5rem;
|
|
602
623
|
}
|
|
@@ -769,6 +790,9 @@ video {
|
|
|
769
790
|
.ml-3 {
|
|
770
791
|
margin-left: 0.75rem;
|
|
771
792
|
}
|
|
793
|
+
.ml-4 {
|
|
794
|
+
margin-left: 1rem;
|
|
795
|
+
}
|
|
772
796
|
.ml-40 {
|
|
773
797
|
margin-left: 10rem;
|
|
774
798
|
}
|
|
@@ -820,6 +844,9 @@ video {
|
|
|
820
844
|
.mt-1 {
|
|
821
845
|
margin-top: 0.25rem;
|
|
822
846
|
}
|
|
847
|
+
.mt-1\.5 {
|
|
848
|
+
margin-top: 0.375rem;
|
|
849
|
+
}
|
|
823
850
|
.mt-14 {
|
|
824
851
|
margin-top: 3.5rem;
|
|
825
852
|
}
|
|
@@ -973,6 +1000,9 @@ video {
|
|
|
973
1000
|
.max-h-full {
|
|
974
1001
|
max-height: 100%;
|
|
975
1002
|
}
|
|
1003
|
+
.min-h-\[37\.75px\] {
|
|
1004
|
+
min-height: 37.75px;
|
|
1005
|
+
}
|
|
976
1006
|
.w-0 {
|
|
977
1007
|
width: 0px;
|
|
978
1008
|
}
|
|
@@ -1145,10 +1175,22 @@ video {
|
|
|
1145
1175
|
--tw-translate-y: -50%;
|
|
1146
1176
|
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));
|
|
1147
1177
|
}
|
|
1178
|
+
.-translate-y-8 {
|
|
1179
|
+
--tw-translate-y: -2rem;
|
|
1180
|
+
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));
|
|
1181
|
+
}
|
|
1182
|
+
.translate-y-0 {
|
|
1183
|
+
--tw-translate-y: 0px;
|
|
1184
|
+
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));
|
|
1185
|
+
}
|
|
1148
1186
|
.translate-y-1\/2 {
|
|
1149
1187
|
--tw-translate-y: 50%;
|
|
1150
1188
|
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));
|
|
1151
1189
|
}
|
|
1190
|
+
.-rotate-180 {
|
|
1191
|
+
--tw-rotate: -180deg;
|
|
1192
|
+
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));
|
|
1193
|
+
}
|
|
1152
1194
|
.-rotate-90 {
|
|
1153
1195
|
--tw-rotate: -90deg;
|
|
1154
1196
|
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));
|
|
@@ -1217,6 +1259,9 @@ video {
|
|
|
1217
1259
|
.flex-col {
|
|
1218
1260
|
flex-direction: column;
|
|
1219
1261
|
}
|
|
1262
|
+
.flex-col-reverse {
|
|
1263
|
+
flex-direction: column-reverse;
|
|
1264
|
+
}
|
|
1220
1265
|
.flex-wrap {
|
|
1221
1266
|
flex-wrap: wrap;
|
|
1222
1267
|
}
|
|
@@ -1533,6 +1578,10 @@ video {
|
|
|
1533
1578
|
--tw-border-opacity: 1;
|
|
1534
1579
|
border-color: rgb(75 85 99 / var(--tw-border-opacity));
|
|
1535
1580
|
}
|
|
1581
|
+
.border-gray-900 {
|
|
1582
|
+
--tw-border-opacity: 1;
|
|
1583
|
+
border-color: rgb(17 24 39 / var(--tw-border-opacity));
|
|
1584
|
+
}
|
|
1536
1585
|
.border-green-300 {
|
|
1537
1586
|
--tw-border-opacity: 1;
|
|
1538
1587
|
border-color: rgb(134 239 172 / var(--tw-border-opacity));
|
|
@@ -1593,6 +1642,9 @@ video {
|
|
|
1593
1642
|
.bg-buttonPrimary-500 {
|
|
1594
1643
|
background-color: var(--button-primary-500);
|
|
1595
1644
|
}
|
|
1645
|
+
.bg-buttonSecondary-500 {
|
|
1646
|
+
background-color: var(--button-secondary-500);
|
|
1647
|
+
}
|
|
1596
1648
|
.bg-cyan-800 {
|
|
1597
1649
|
--tw-bg-opacity: 1;
|
|
1598
1650
|
background-color: rgb(21 94 117 / var(--tw-bg-opacity));
|
|
@@ -1645,10 +1697,6 @@ video {
|
|
|
1645
1697
|
--tw-bg-opacity: 1;
|
|
1646
1698
|
background-color: rgb(134 239 172 / var(--tw-bg-opacity));
|
|
1647
1699
|
}
|
|
1648
|
-
.bg-green-400 {
|
|
1649
|
-
--tw-bg-opacity: 1;
|
|
1650
|
-
background-color: rgb(74 222 128 / var(--tw-bg-opacity));
|
|
1651
|
-
}
|
|
1652
1700
|
.bg-green-500 {
|
|
1653
1701
|
--tw-bg-opacity: 1;
|
|
1654
1702
|
background-color: rgb(34 197 94 / var(--tw-bg-opacity));
|
|
@@ -1833,6 +1881,9 @@ video {
|
|
|
1833
1881
|
.pb-0 {
|
|
1834
1882
|
padding-bottom: 0px;
|
|
1835
1883
|
}
|
|
1884
|
+
.pb-1 {
|
|
1885
|
+
padding-bottom: 0.25rem;
|
|
1886
|
+
}
|
|
1836
1887
|
.pb-2 {
|
|
1837
1888
|
padding-bottom: 0.5rem;
|
|
1838
1889
|
}
|
|
@@ -1848,9 +1899,6 @@ video {
|
|
|
1848
1899
|
.pl-3 {
|
|
1849
1900
|
padding-left: 0.75rem;
|
|
1850
1901
|
}
|
|
1851
|
-
.pl-4 {
|
|
1852
|
-
padding-left: 1rem;
|
|
1853
|
-
}
|
|
1854
1902
|
.pl-6 {
|
|
1855
1903
|
padding-left: 1.5rem;
|
|
1856
1904
|
}
|
|
@@ -1860,12 +1908,12 @@ video {
|
|
|
1860
1908
|
.pr-3 {
|
|
1861
1909
|
padding-right: 0.75rem;
|
|
1862
1910
|
}
|
|
1863
|
-
.pr-4 {
|
|
1864
|
-
padding-right: 1rem;
|
|
1865
|
-
}
|
|
1866
1911
|
.pt-0 {
|
|
1867
1912
|
padding-top: 0px;
|
|
1868
1913
|
}
|
|
1914
|
+
.pt-1 {
|
|
1915
|
+
padding-top: 0.25rem;
|
|
1916
|
+
}
|
|
1869
1917
|
.pt-2 {
|
|
1870
1918
|
padding-top: 0.5rem;
|
|
1871
1919
|
}
|
|
@@ -1921,6 +1969,10 @@ video {
|
|
|
1921
1969
|
.text-\[9px\] {
|
|
1922
1970
|
font-size: 9px;
|
|
1923
1971
|
}
|
|
1972
|
+
.text-base {
|
|
1973
|
+
font-size: 1rem;
|
|
1974
|
+
line-height: 1.5rem;
|
|
1975
|
+
}
|
|
1924
1976
|
.text-lg {
|
|
1925
1977
|
font-size: 1.125rem;
|
|
1926
1978
|
line-height: 1.75rem;
|
|
@@ -1967,6 +2019,9 @@ video {
|
|
|
1967
2019
|
.leading-4 {
|
|
1968
2020
|
line-height: 1rem;
|
|
1969
2021
|
}
|
|
2022
|
+
.leading-none {
|
|
2023
|
+
line-height: 1;
|
|
2024
|
+
}
|
|
1970
2025
|
.leading-tight {
|
|
1971
2026
|
line-height: 1.25;
|
|
1972
2027
|
}
|
|
@@ -2308,6 +2363,10 @@ body {
|
|
|
2308
2363
|
--tw-bg-opacity: 1;
|
|
2309
2364
|
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
|
2310
2365
|
}
|
|
2366
|
+
.hover\:bg-gray-300:hover {
|
|
2367
|
+
--tw-bg-opacity: 1;
|
|
2368
|
+
background-color: rgb(209 213 219 / var(--tw-bg-opacity));
|
|
2369
|
+
}
|
|
2311
2370
|
.hover\:bg-gray-400:hover {
|
|
2312
2371
|
--tw-bg-opacity: 1;
|
|
2313
2372
|
background-color: rgb(156 163 175 / var(--tw-bg-opacity));
|
|
@@ -2494,6 +2553,10 @@ body {
|
|
|
2494
2553
|
--tw-bg-opacity: 1;
|
|
2495
2554
|
background-color: rgb(191 219 254 / var(--tw-bg-opacity));
|
|
2496
2555
|
}
|
|
2556
|
+
:is(.dark .dark\:bg-gray-200) {
|
|
2557
|
+
--tw-bg-opacity: 1;
|
|
2558
|
+
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
|
2559
|
+
}
|
|
2497
2560
|
:is(.dark .dark\:bg-gray-600) {
|
|
2498
2561
|
--tw-bg-opacity: 1;
|
|
2499
2562
|
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
|
|
@@ -2558,6 +2621,10 @@ body {
|
|
|
2558
2621
|
--tw-text-opacity: 1;
|
|
2559
2622
|
color: rgb(107 114 128 / var(--tw-text-opacity));
|
|
2560
2623
|
}
|
|
2624
|
+
:is(.dark .dark\:text-gray-800) {
|
|
2625
|
+
--tw-text-opacity: 1;
|
|
2626
|
+
color: rgb(31 41 55 / var(--tw-text-opacity));
|
|
2627
|
+
}
|
|
2561
2628
|
:is(.dark .dark\:text-green-800) {
|
|
2562
2629
|
--tw-text-opacity: 1;
|
|
2563
2630
|
color: rgb(22 101 52 / var(--tw-text-opacity));
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { FC, ButtonHTMLAttributes } from "react";
|
|
2
2
|
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3
3
|
variant?: "contained" | "outlined";
|
|
4
|
+
feedback?: string;
|
|
4
5
|
tooltipDirection?: "rtl" | "ltr";
|
|
5
|
-
color?: "default" | "primary" | "secondary";
|
|
6
|
+
color?: "default" | "primary" | "secondary" | "light" | "dark";
|
|
6
7
|
width?: "full" | "normal" | "half";
|
|
7
8
|
size?: "xs" | "small" | "medium" | "large" | "noPadding" | "full";
|
|
8
9
|
margins?: "none" | "1" | "2" | "3" | "4";
|
|
@@ -13,6 +14,7 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
13
14
|
endIcon?: any;
|
|
14
15
|
isLoading?: boolean;
|
|
15
16
|
badge?: any;
|
|
17
|
+
edgeCorner?: any;
|
|
16
18
|
}
|
|
17
19
|
export declare const HawaButton: FC<ButtonProps>;
|
|
18
20
|
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { FC } from "react";
|
|
2
|
+
type TimelineTypes = {
|
|
3
|
+
title: any;
|
|
4
|
+
steps: StepTypes[];
|
|
5
|
+
};
|
|
6
|
+
type StepTypes = {
|
|
7
|
+
date: string;
|
|
8
|
+
title: string;
|
|
9
|
+
description?: string;
|
|
10
|
+
actions?: any;
|
|
11
|
+
};
|
|
12
|
+
export declare const Timeline: FC<TimelineTypes>;
|
|
13
|
+
export {};
|
package/es/elements/index.d.ts
CHANGED
|
@@ -13,8 +13,6 @@ export * from "./HawaTable";
|
|
|
13
13
|
export * from "./HawaColorPicker";
|
|
14
14
|
export * from "./HawaSearchBar";
|
|
15
15
|
export * from "./HawaAccordion";
|
|
16
|
-
export * from "./DragDropImages";
|
|
17
|
-
export * from "./DraggableCard";
|
|
18
16
|
export * from "./HawaPhoneInput";
|
|
19
17
|
export * from "./HawaTooltip";
|
|
20
18
|
export * from "./HawaTabs";
|
|
@@ -22,22 +20,26 @@ export * from "./HawaModal";
|
|
|
22
20
|
export * from "./HawaMenu";
|
|
23
21
|
export * from "./HawaCopyrights";
|
|
24
22
|
export * from "./HawaStepper";
|
|
25
|
-
export * from "./Breadcrumb";
|
|
26
23
|
export * from "./HawaStats";
|
|
27
24
|
export * from "./HawaCodeBlock";
|
|
28
25
|
export * from "./HawaSpinner";
|
|
29
26
|
export * from "./HawaRadio";
|
|
30
27
|
export * from "./HawaDrawer";
|
|
28
|
+
export * from "./HawaDatepicker";
|
|
29
|
+
export * from "./DragDropImages";
|
|
30
|
+
export * from "./DraggableCard";
|
|
31
|
+
export * from "./Breadcrumb";
|
|
31
32
|
export * from "./SubsectionList";
|
|
32
33
|
export * from "./UsageCard";
|
|
33
34
|
export * from "./InvoiceAccordion";
|
|
34
|
-
export * from "./HawaDatepicker";
|
|
35
35
|
export * from "./UserFeedback";
|
|
36
36
|
export * from "./ArrowCarousel";
|
|
37
37
|
export * from "./FloatingComment";
|
|
38
38
|
export * from "./FloatingCommentSlate";
|
|
39
39
|
export * from "./FloatingCommentExec";
|
|
40
40
|
export * from "./BackToTop";
|
|
41
|
+
export * from "./HawaInlineCode";
|
|
42
|
+
export * from "./Timeline";
|
|
41
43
|
export * from "./HawaTextField";
|
|
42
44
|
export * from "./HawaCardInput";
|
|
43
45
|
export * from "./HawaPinInput";
|