@sikka/hawa 0.0.224 → 0.0.226

package/dist/styles.css

@@ -570,9 +570,15 @@ video {
 .inset-0 {
   inset: 0px;
 }
+.-bottom-10 {
+  bottom: -2.5rem;
+}
 .-left-1 {
   left: -0.25rem;
 }
+.-right-10 {
+  right: -2.5rem;
+}
 .-right-3 {
   right: -0.75rem;
 }
@@ -687,6 +693,9 @@ video {
 .-mb-px {
   margin-bottom: -1px;
 }
+.-mt-1 {
+  margin-top: -0.25rem;
+}
 .mb-0 {
   margin-bottom: 0px;
 }
@@ -747,6 +756,9 @@ video {
 .mr-2 {
   margin-right: 0.5rem;
 }
+.mr-3 {
+  margin-right: 0.75rem;
+}
 .mr-4 {
   margin-right: 1rem;
 }
@@ -944,6 +956,9 @@ video {
 .w-44 {
   width: 11rem;
 }
+.w-48 {
+  width: 12rem;
+}
 .w-5 {
   width: 1.25rem;
 }
@@ -1238,9 +1253,15 @@ video {
 .rounded-lg {
   border-radius: 0.5rem;
 }
+.rounded-md {
+  border-radius: 0.375rem;
+}
 .rounded-none {
   border-radius: 0px;
 }
+.rounded-xl {
+  border-radius: 0.75rem;
+}
 .rounded-b {
   border-bottom-right-radius: var(--border-radius);
   border-bottom-left-radius: var(--border-radius);
@@ -1429,6 +1450,10 @@ video {
   --tw-border-opacity: 1;
   border-top-color: rgb(255 255 255 / var(--tw-border-opacity));
 }
+.bg-black {
+  --tw-bg-opacity: 1;
+  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
+}
 .bg-blue-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(219 234 254 / var(--tw-bg-opacity));
@@ -1847,9 +1872,16 @@ video {
   --tw-text-opacity: 1;
   color: rgb(161 98 7 / var(--tw-text-opacity));
 }
+.underline {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+}
 .underline-offset-4 {
   text-underline-offset: 4px;
 }
+.underline-offset-8 {
+  text-underline-offset: 8px;
+}
 .opacity-0 {
   opacity: 0;
 }
@@ -1880,8 +1912,8 @@ video {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-neobrutalism {
-  --tw-shadow: 10px 10px 0px 0px rgba(0,0,0,1);;
-  --tw-shadow-colored: 10px 10px 0px 0px var(--tw-shadow-color);
+  --tw-shadow: 5px 5px 0px 0px rgba(0,0,0,1);;
+  --tw-shadow-colored: 5px 5px 0px 0px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-sm {
@@ -1927,6 +1959,10 @@ video {
 .ring-offset-2 {
   --tw-ring-offset-width: 2px;
 }
+.drop-shadow-md {
+  --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
+  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);
+}
 .filter {
   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);
 }

package/es/elements/HawaApiBox.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+type HawaApiBoxTypes = {
+    lang?: any;
+    onClick?: any;
+    buttonText?: any;
+};
+export declare const HawaApiBox: React.FunctionComponent<HawaApiBoxTypes>;
+export {};

package/es/elements/HawaDatepicker.d.ts

@@ -0,0 +1,4 @@
+import { FC } from "react";
+type DatepickerTypes = {};
+export declare const HawaDatepicker: FC<DatepickerTypes>;
+export {};

package/es/elements/HawaLandingCard.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+type LandingCardTypes = {
+    orientation: "vertical" | "horizontal";
+    title: string;
+    description: string;
+    imageURL: string;
+    handleHide: any;
+    texts?: {
+        titleTip?: string;
+        title?: string;
+        description?: string;
+        linkText?: string;
+    };
+    buttonLink?: string;
+};
+export declare const HawaLandingCard: React.FunctionComponent<LandingCardTypes>;
+export {};

package/es/elements/HawaModal.d.ts

@@ -1,11 +1,30 @@
 import React, { ReactElement } from "react";
 type ModalTypes = {
+    /**
+     * The boolean to open and close the modal
+     */
     open: boolean;
+    /**
+     * The title of the modal, it will appear in the header of the modal
+     */
     title: string;
+    /**
+     * a function that's triggered when the modal is closed either by the clicking the close button or outside the modal.
+     * @returns void
+     */
     onClose: () => void;
+    /**
+     * Boolean to enable/disable closing the modal upon clicking outside the modal
+     */
     closeOnClickOutside?: boolean;
+    /**
+     * The id of the modal
+     */
     modalID?: string;
     children: ReactElement;
+    /**
+     * The array of actions for the modal, it will appear in the footer of the modal
+     */
     actions: any;
 };
 export declare const HawaModal: React.FunctionComponent<ModalTypes>;

package/es/elements/HawaStats.d.ts

@@ -1,9 +1,10 @@
 import React from "react";
 type StatTypes = {
     label?: string;
+    color?: string;
     number?: string;
     helperText?: string;
-    variant?: "plain" | "contained" | "outlined";
+    variant?: "plain" | "contained" | "outlined" | "brutalist" | "dropshadow";
     width?: "full" | "min" | "normal";
     isLoading?: boolean;
     handleClick?: () => void;

package/es/elements/HawaStoreButtons.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+type StoreButtonsTypes = {
+    store: "apple" | "google";
+    mode: "dark" | "light";
+};
+export declare const HawaStoreButtons: React.FunctionComponent<StoreButtonsTypes>;
+export {};

package/es/elements/HawaTable.d.ts

@@ -9,7 +9,8 @@ type TableTypes = {
     end?: any;
     size?: "normal" | "small";
     highlightFirst?: boolean;
-    customColor?: string;
+    bodyColor?: string;
+    headerColor?: string;
     clickable?: boolean;
     texts?: {
         actions?: string;

package/es/elements/HawaTextField.d.ts

@@ -2,19 +2,27 @@ import React from "react";
 type TextFieldTypes = {
     margin?: "none" | "normal" | "large";
     width?: "small" | "normal" | "full";
+    /** The label of the input field   */
     label?: any;
-    multiline?: any;
+    /** Disable/Enable multiple line text input field   */
+    multiline?: boolean;
+    /** The small red text under the input field to show validation or a hint.   */
     helperText?: any;
+    /** The value of the input field */
     value?: any;
     props?: React.PropsWithRef<"input">;
+    /** The type of input field. Same as the types of <input/> component   */
     type?: any;
+    /** The placeholder of the input field  */
     placeholder?: any;
     defaultValue?: any;
     name?: any;
     inputProps?: any;
     onChange?: any;
     ref?: any;
+    /** The icon inside the input field */
     icon?: any;
+    /** Boolean to enable/disable editing the input field and using it as a text field   */
     preview?: boolean;
 };
 export declare const HawaTextField: React.FunctionComponent<TextFieldTypes>;

package/es/elements/index.d.ts

@@ -29,11 +29,15 @@ export * from "./HawaDrawer";
 export * from "./SubsectionList";
 export * from "./UsageCard";
 export * from "./InvoiceAccordion";
+export * from "./HawaApiBox";
+export * from "./HawaDatepicker";
 export * from "./HawaTextField";
 export * from "./HawaCardInput";
 export * from "./HawaPinInput";
 export * from "./HawaItemCard";
 export * from "./HawaPricingCard";
 export * from "./HawaAdCard";
+export * from "./HawaLandingCard";
 export * from "./HawaButton";
+export * from "./HawaStoreButtons";
 export * from "./HawaLogoButton";