@sikka/hawa 0.1.59 → 0.1.61

package/dist/index.mjs

@@ -778,8 +778,10 @@ Button.displayName = "Button";
 var HawaAlert = ({
   variant = "normal",
   direction = "ltr",
+  severity = "info",
   duration,
   icon,
+  className,
   ...props
 }) => {
   const alertRef = useRef3(null);
@@ -848,8 +850,9 @@ var HawaAlert = ({
     {
       className: clsx7(
         "relative mb-4 flex flex-col rounded p-4 text-sm transition-all",
-        styleVariant[variant][props.severity],
-        closed ? "opacity-0" : "opacity-100"
+        styleVariant[variant][severity],
+        closed ? "opacity-0" : "opacity-100",
+        className
       ),
       role: "alert",
       dir: direction
@@ -863,7 +866,7 @@ var HawaAlert = ({
         )
       },
       props.title
-    ), /* @__PURE__ */ React17.createElement("span", null, " " + props.text), props.actions && /* @__PURE__ */ React17.createElement("div", { className: "mt-2 flex flex-row gap-2" }, props.actions.map((act, index) => /* @__PURE__ */ React17.createElement(
+    ), /* @__PURE__ */ React17.createElement("span", null, props.text), props.actions && /* @__PURE__ */ React17.createElement("div", { className: "mt-2 flex flex-row gap-2" }, props.actions.map((act, index) => /* @__PURE__ */ React17.createElement(
       Button,
       {
         key: index,
@@ -878,7 +881,7 @@ var HawaAlert = ({
         type: "button",
         className: clsx7(
           "absolute  top-2 inline-flex h-9 w-9 items-center justify-center rounded-inner p-1.5 text-gray-400 transition-all  hover:text-gray-900",
-          closeButtonStyle[props.severity],
+          closeButtonStyle[severity],
           direction === "rtl" ? "left-2" : "right-2"
         ),
         "data-dismiss-target": "#alert-default",
@@ -5904,187 +5907,8 @@ var HawaPinInput = ({
 };
 
 // src/elements/HawaItemCard.tsx
-import React53, { useEffect as useEffect18, useState as useState29 } from "react";
-import clsx23 from "clsx";
-
-// src/elements/HawaButton.tsx
-import React52, { useState as useState28 } from "react";
+import React52, { useEffect as useEffect18, useState as useState28 } from "react";
 import clsx22 from "clsx";
-var disabledSyles = "cursor-default pointer-events-none";
-var disabledVariantSyles = {
-  contained: "text-gray-300 bg-gray-100",
-  outlined: "text-gray-300 border-gray-300"
-};
-var baseStyles = "cursor-pointer  justify-center items-center text-center font-medium transition-all ";
-var sizeStyles = {
-  icon: "h-10 w-10",
-  xs: "px-1.5 py-2 text-[9px] h-fit",
-  small: "text-xs px-2.5 py-1.5",
-  medium: "text-sm leading-4 px-3 py-2",
-  default: "h-10 px-4 py-2",
-  large: "text-sm px-4 py-2",
-  noPadding: "p-0",
-  full: "h-full max-h-full p-2"
-};
-var widthStyles = {
-  full: "w-full flex justify-center px-5 py-2.5 text-center inline-flex items-center",
-  half: "w-full text-center flex items-center justify-center h-full",
-  normal: "w-fit dark:bg-buttonPrimary-dark dark:hover:bg-buttonPrimary-700 dark:hover:brightness-90 dark:focus:ring-buttonPrimary-500"
-};
-var containerWidthStyles = {
-  full: "w-full flex justify-center text-center inline-flex items-center",
-  half: "w-1/2",
-  normal: "w-fit"
-};
-var variantStyles = {
-  contained: "border-transparent",
-  // outlined: "bg-transparent border",
-  outlined: "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
-};
-var colorStyles = {
-  contained: {
-    default: "text-neutral-900 bg-buttonPrimary-500 hover:bg-buttonPrimary-700 bg-buttonPrimary-500 text-white",
-    primary: "text-white bg-buttonPrimary-500 hover:bg-buttonPrimary-700 transition-all",
-    secondary: "bg-buttonSecondary-500 hover:text-white hover:bg-buttonSecondary-700",
-    gray: "text-neutral-900 bg-gray-200 hover:bg-gray-300",
-    dark: "text-neutral-900 bg-gray-200 hover:bg-gray-300"
-  },
-  outlined: {
-    default: "text-gray-600 border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800 dark:text-white",
-    primary: "text-black hover:bg-gray-50  dark:text-white",
-    secondary: " dark:text-white text-secondary-800 border-secondary-800 hover:bg-buttonSecondary-700 hover:text-white",
-    gray: "border-gray-300 hover:bg-gray-200",
-    dark: "border-gray-900 hover:bg-gray-700"
-  }
-};
-var HawaButton = ({
-  className,
-  variant = "contained",
-  color = "default",
-  size = "default",
-  width = "normal",
-  disabled = false,
-  isLoading = false,
-  tooltip,
-  tooltipSize = "normal",
-  tooltipPosition = "top-left",
-  tooltipDirection = "ltr",
-  margins = "2",
-  children,
-  badge,
-  edgeCorner = false,
-  feedback,
-  ...props
-}) => {
-  const [isClicked, setIsClicked] = useState28(false);
-  const [buttonText, setButtonText] = useState28(children);
-  const handleClick = (event) => {
-    if (props.onClick) {
-      props.onClick(event);
-    }
-    if (feedback && !isClicked) {
-      setButtonText(feedback);
-      setIsClicked(true);
-      setTimeout(() => {
-        setButtonText(children);
-        setIsClicked(false);
-      }, 2e3);
-    }
-  };
-  return /* @__PURE__ */ React52.createElement(
-    "div",
-    {
-      className: clsx22(
-        "relative",
-        margins !== "none" ? `my-${margins}` : "m-0",
-        containerWidthStyles[width]
-      )
-    },
-    tooltip ? /* @__PURE__ */ React52.createElement(
-      HawaTooltip,
-      {
-        direction: tooltipDirection,
-        position: tooltipPosition,
-        size: tooltipSize,
-        content: tooltip
-      },
-      /* @__PURE__ */ React52.createElement(
-        "button",
-        {
-          className: disabled ? clsx22(
-            className,
-            baseStyles,
-            edgeCorner ? "rounded-inner" : "rounded",
-            variantStyles[variant],
-            sizeStyles[size],
-            widthStyles[width],
-            disabledSyles,
-            disabledVariantSyles[variant]
-          ) : clsx22(
-            className,
-            baseStyles,
-            edgeCorner ? "rounded-inner" : "rounded",
-            variantStyles[variant],
-            sizeStyles[size],
-            colorStyles[variant][color],
-            widthStyles[width]
-          ),
-          disabled,
-          onClick: props.onClick
-        },
-        !isLoading ? children : /* @__PURE__ */ React52.createElement(HawaLoading, { size: "button" })
-      )
-    ) : /* @__PURE__ */ React52.createElement(
-      "button",
-      {
-        className: disabled ? clsx22(
-          className,
-          baseStyles,
-          edgeCorner ? "rounded-inner" : "rounded",
-          variantStyles[variant],
-          sizeStyles[size],
-          widthStyles[width],
-          disabledSyles,
-          disabledVariantSyles[variant]
-        ) : clsx22(
-          className,
-          "overflow-x-clip",
-          baseStyles,
-          edgeCorner ? "rounded-inner" : "rounded",
-          variantStyles[variant],
-          sizeStyles[size],
-          colorStyles[variant][color],
-          widthStyles[width]
-        ),
-        disabled,
-        onClick: handleClick
-      },
-      !isLoading ? /* @__PURE__ */ React52.createElement(
-        "div",
-        {
-          className: clsx22(
-            " s flex flex-col-reverse items-start justify-center gap-4 transition-all",
-            isClicked && feedback ? " -translate-y-8 pb-1 pt-1" : "translate-y-0"
-          )
-        },
-        isClicked && feedback ? /* @__PURE__ */ React52.createElement("div", { className: "w-full  text-center" }, buttonText) : null,
-        /* @__PURE__ */ React52.createElement("div", { className: "flex w-full select-none flex-row items-center justify-center gap-2 whitespace-nowrap" }, props.startIcon && props.startIcon, children, props.endIcon && props.endIcon)
-      ) : /* @__PURE__ */ React52.createElement(HawaLoading, { design: "dots-pulse", color: "bg-white", size: "button" })
-    ),
-    badge && /* @__PURE__ */ React52.createElement(
-      "div",
-      {
-        className: clsx22(
-          typeof badge === "boolean" ? "h-5 w-5" : typeof badge === "string" ? "h-5 w-7" : "h-6 w-6",
-          "absolute -right-2 -top-2 inline-flex select-none  items-center justify-center rounded-full border-2 border-white bg-red-500 text-[9px] font-bold text-white dark:border-gray-900"
-        )
-      },
-      typeof badge === "number" && badge > 100 ? "+99" : badge
-    )
-  );
-};
-
-// src/elements/HawaItemCard.tsx
 var HawaItemCard = ({
   actions,
   counts,
@@ -6113,7 +5937,7 @@ var HawaItemCard = ({
     )
   };
   let headerActionsButtonStyle = "inline-block rounded p-1 text-sm text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-700";
-  const [openActionHeader, setOpenActionHeader] = useState29(false);
+  const [openActionHeader, setOpenActionHeader] = useState28(false);
   function handleOpenActionHeader() {
     setOpenActionHeader(!openActionHeader);
   }
@@ -6125,51 +5949,58 @@ var HawaItemCard = ({
     };
     return () => window.onclick = null;
   }, [openActionHeader]);
-  return /* @__PURE__ */ React53.createElement(
+  return /* @__PURE__ */ React52.createElement(
     "div",
     {
-      className: clsx23(defaultStyle, orientationStyles[orientation]),
+      className: clsx22(defaultStyle, orientationStyles[orientation]),
       ...props
     },
-    cardImage && /* @__PURE__ */ React53.createElement("div", { className: "group relative overflow-clip" }, /* @__PURE__ */ React53.createElement(
+    cardImage && /* @__PURE__ */ React52.createElement("div", { className: "group relative overflow-clip" }, /* @__PURE__ */ React52.createElement(
       "img",
       {
         src: "https://via.placeholder.com/50",
-        className: clsx23(
+        className: clsx22(
           imageStyles[orientation],
           clickableImage ? "overflow-clip transition-all group-hover:blur-lg" : ""
         )
       }
-    ), clickableImage && /* @__PURE__ */ React53.createElement("div", { className: "absolute left-0 top-0 flex h-full w-full items-center  justify-center opacity-0 transition-all group-hover:opacity-100 " }, /* @__PURE__ */ React53.createElement(
-      HawaButton,
+    ), clickableImage && /* @__PURE__ */ React52.createElement("div", { className: "absolute left-0 top-0 flex h-full w-full items-center  justify-center opacity-0 transition-all group-hover:opacity-100 " }, /* @__PURE__ */ React52.createElement(
+      Button,
       {
-        startIcon: clickableImageActionIcon,
-        variant: "outlined",
-        onClick: clickableImageAction
+        variant: "secondary",
+        onClick: clickableImageAction,
+        className: "flex flex-row gap-2"
       },
+      clickableImageActionIcon,
       clickableImageActionText
     ))),
-    /* @__PURE__ */ React53.createElement("div", { className: "relative w-full p-6" }, headerActions && /* @__PURE__ */ React53.createElement("div", { className: "max-h- bg-red absolute right-0 top-0 flex justify-end pr-3 pt-3" }, /* @__PURE__ */ React53.createElement(HawaMenu, { position: "top-right", menuItems: headerActions }, /* @__PURE__ */ React53.createElement(
-      "div",
+    /* @__PURE__ */ React52.createElement("div", { className: "relative w-full p-6" }, headerActions && /* @__PURE__ */ React52.createElement("div", { className: "max-h- bg-red absolute right-0 top-0 flex justify-end pr-3 pt-3" }, /* @__PURE__ */ React52.createElement(
+      DropdownMenu,
       {
-        className: clsx23(headerActionsButtonStyle),
-        onClick: handleOpenActionHeader
-      },
-      /* @__PURE__ */ React53.createElement("span", { className: "sr-only" }, "Open dropdown"),
-      /* @__PURE__ */ React53.createElement(
-        "svg",
-        {
-          className: "h-6 w-6",
-          "aria-hidden": "true",
-          fill: "currentColor",
-          viewBox: "0 0 20 20"
-        },
-        /* @__PURE__ */ React53.createElement("path", { d: "M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z" })
-      )
-    ))), header && /* @__PURE__ */ React53.createElement("h5", { className: "mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" }, header), content && /* @__PURE__ */ React53.createElement("span", { className: "w-full font-normal text-gray-700 dark:text-gray-400" }, content), actions || counts ? /* @__PURE__ */ React53.createElement(
+        items: headerActions,
+        trigger: /* @__PURE__ */ React52.createElement(
+          "div",
+          {
+            className: clsx22(headerActionsButtonStyle),
+            onClick: handleOpenActionHeader
+          },
+          /* @__PURE__ */ React52.createElement("span", { className: "sr-only" }, "Open dropdown"),
+          /* @__PURE__ */ React52.createElement(
+            "svg",
+            {
+              className: "h-6 w-6",
+              "aria-hidden": "true",
+              fill: "currentColor",
+              viewBox: "0 0 20 20"
+            },
+            /* @__PURE__ */ React52.createElement("path", { d: "M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z" })
+          )
+        )
+      }
+    )), header && /* @__PURE__ */ React52.createElement("h5", { className: "mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" }, header), content && /* @__PURE__ */ React52.createElement("span", { className: "w-full font-normal text-gray-700 dark:text-gray-400" }, content), actions || counts ? /* @__PURE__ */ React52.createElement(
       "div",
       {
-        className: clsx23(
+        className: clsx22(
           "mt-3 flex items-center rounded-b-lg dark:text-white ",
           actions && counts ? "justify-between" : "justify-end"
         )
@@ -6181,8 +6012,8 @@ var HawaItemCard = ({
 };
 
 // src/elements/HawaPricingCard.tsx
-import clsx24 from "clsx";
-import React54 from "react";
+import clsx23 from "clsx";
+import React53 from "react";
 var HawaPricingCard = ({
   size = "medium",
   direction = "ltr",
@@ -6195,21 +6026,21 @@ var HawaPricingCard = ({
     medium: "mx-1 w-full rounded min-w-fit border dark:border-gray-700 bg-background ",
     large: "mx-1 w-full max-w-lg rounded border dark:border-gray-700 bg-background "
   };
-  return /* @__PURE__ */ React54.createElement(
+  return /* @__PURE__ */ React53.createElement(
     "div",
     {
       dir: isArabic ? "rtl" : "ltr",
-      className: clsx24(
+      className: clsx23(
         currentPlan ? "border-primary" : "bg-background",
         cardSizes[size],
         "flex flex-col gap-4 rounded border-2 p-4"
       )
     },
-    /* @__PURE__ */ React54.createElement("h5", { className: "text-md 0 font-bold text-primary/70" }, props.texts.title),
-    /* @__PURE__ */ React54.createElement("div", { className: " text-primary/ flex  items-baseline" }, /* @__PURE__ */ React54.createElement(React54.Fragment, null, /* @__PURE__ */ React54.createElement("span", { className: "text-5xl font-extrabold tracking-tight" }, props.price), /* @__PURE__ */ React54.createElement("span", { className: "mx-1 text-sm font-semibold" }, props.texts.currencyText)), /* @__PURE__ */ React54.createElement("span", { className: "ml-1 text-xl font-normal text-primary/70" }, "/ ", props.texts.cycleText)),
-    /* @__PURE__ */ React54.createElement("h5", { className: "text-md  font-normal text-primary/70" }, props.texts.subtitle),
-    props.features && /* @__PURE__ */ React54.createElement("ul", { role: "list", className: "space-y-0 " }, props.features?.map((feature, o) => {
-      return /* @__PURE__ */ React54.createElement("li", { key: o, className: "flex " }, /* @__PURE__ */ React54.createElement(
+    /* @__PURE__ */ React53.createElement("h5", { className: "text-md 0 font-bold text-primary/70" }, props.texts.title),
+    /* @__PURE__ */ React53.createElement("div", { className: " text-primary/ flex  items-baseline" }, /* @__PURE__ */ React53.createElement(React53.Fragment, null, /* @__PURE__ */ React53.createElement("span", { className: "text-5xl font-extrabold tracking-tight" }, props.price), /* @__PURE__ */ React53.createElement("span", { className: "mx-1 text-sm font-semibold" }, props.texts.currencyText)), /* @__PURE__ */ React53.createElement("span", { className: "ml-1 text-xl font-normal text-primary/70" }, "/ ", props.texts.cycleText)),
+    /* @__PURE__ */ React53.createElement("h5", { className: "text-md  font-normal text-primary/70" }, props.texts.subtitle),
+    props.features && /* @__PURE__ */ React53.createElement("ul", { role: "list", className: "space-y-0 " }, props.features?.map((feature, o) => {
+      return /* @__PURE__ */ React53.createElement("li", { key: o, className: "flex " }, /* @__PURE__ */ React53.createElement(
         "svg",
         {
           "aria-label": "Check Icon",
@@ -6218,7 +6049,7 @@ var HawaPricingCard = ({
           fill: "currentColor",
           viewBox: "0 0 20 20"
         },
-        /* @__PURE__ */ React54.createElement(
+        /* @__PURE__ */ React53.createElement(
           "path",
           {
             fillRule: "evenodd",
@@ -6226,9 +6057,9 @@ var HawaPricingCard = ({
             clipRule: "evenodd"
           }
         )
-      ), /* @__PURE__ */ React54.createElement("span", { className: "flex items-center  text-center font-normal leading-tight text-primary/70 " }, feature.text));
+      ), /* @__PURE__ */ React53.createElement("span", { className: "flex items-center  text-center font-normal leading-tight text-primary/70 " }, feature.text));
     })),
-    /* @__PURE__ */ React54.createElement(
+    /* @__PURE__ */ React53.createElement(
       Button,
       {
         onClick: props.onPlanClicked,
@@ -6241,8 +6072,8 @@ var HawaPricingCard = ({
 };
 
 // src/elements/HawaAdCard.tsx
-import clsx25 from "clsx";
-import React55 from "react";
+import clsx24 from "clsx";
+import React54 from "react";
 var HawaAdCard = ({ orientation, ...props }) => {
   let cardStyles = {
     horizontal: "flex flex-row  max-w-xl rounded border-gray-200 bg-gray-100 shadow-md p-2 gap-2 items-center relative  dark:border-gray-700 dark:bg-gray-800 ",
@@ -6252,21 +6083,21 @@ var HawaAdCard = ({ orientation, ...props }) => {
     horizontal: "w-auto h-full bg-blue-500  rounded-inner",
     vertical: "bg-blue-500 rounded-inner w-auto "
   };
-  return /* @__PURE__ */ React55.createElement(
+  return /* @__PURE__ */ React54.createElement(
     "div",
     {
-      className: clsx25(cardStyles[orientation], "dark:text-white"),
+      className: clsx24(cardStyles[orientation], "dark:text-white"),
       ...props
     },
-    /* @__PURE__ */ React55.createElement("div", { className: "flex aspect-square w-full  max-w-fit  items-start " }, /* @__PURE__ */ React55.createElement(
+    /* @__PURE__ */ React54.createElement("div", { className: "flex aspect-square w-full  max-w-fit  items-start " }, /* @__PURE__ */ React54.createElement(
       "img",
       {
         src: props.imageURL ? props.imageURL : "https://via.placeholder.com/50",
         className: imageStyles[orientation]
       }
     )),
-    /* @__PURE__ */ React55.createElement("div", { className: "w-full text-xs" }, /* @__PURE__ */ React55.createElement("div", { className: "font-bold" }, props.title), /* @__PURE__ */ React55.createElement("div", { className: "text-[12px]" }, props.description)),
-    /* @__PURE__ */ React55.createElement(
+    /* @__PURE__ */ React54.createElement("div", { className: "w-full text-xs" }, /* @__PURE__ */ React54.createElement("div", { className: "font-bold" }, props.title), /* @__PURE__ */ React54.createElement("div", { className: "text-[12px]" }, props.description)),
+    /* @__PURE__ */ React54.createElement(
       "span",
       {
         onClick: props.handleHide,
@@ -6278,8 +6109,8 @@ var HawaAdCard = ({ orientation, ...props }) => {
 };
 
 // src/elements/HawaLandingCard.tsx
-import clsx26 from "clsx";
-import React56 from "react";
+import clsx25 from "clsx";
+import React55 from "react";
 var HawaLandingCard = ({
   orientation = "horizontal",
   ...props
@@ -6292,10 +6123,10 @@ var HawaLandingCard = ({
     horizontal: "w-8 h-8 rounded",
     vertical: "w-14 h-14 rounded"
   };
-  return /* @__PURE__ */ React56.createElement(
+  return /* @__PURE__ */ React55.createElement(
     "div",
     {
-      className: clsx26(
+      className: clsx25(
         cardStyles[orientation],
         "flex flex-col p-10",
         "relative overflow-hidden dark:text-white",
@@ -6303,67 +6134,244 @@ var HawaLandingCard = ({
       ),
       ...props
     },
-    props.texts?.titleTip && /* @__PURE__ */ React56.createElement("div", { className: "text-sm text-red-600" }, props.texts?.titleTip),
-    props.imageURL && /* @__PURE__ */ React56.createElement(
+    props.texts?.titleTip && /* @__PURE__ */ React55.createElement("div", { className: "text-sm text-red-600" }, props.texts?.titleTip),
+    props.imageURL && /* @__PURE__ */ React55.createElement(
       "img",
       {
         className: "absolute -bottom-10 -right-10 h-40 w-auto ",
         src: props.imageURL
       }
     ),
-    props.texts?.title && /* @__PURE__ */ React56.createElement("div", { className: "mt-2 text-lg font-medium" }, props.texts?.title, " "),
-    props.texts?.description && /* @__PURE__ */ React56.createElement("div", { className: "z-10 mt-4 text-sm" }, props.texts?.description),
-    props.texts?.linkText && /* @__PURE__ */ React56.createElement("div", { className: "z-10 mt-6 text-sm underline underline-offset-8" }, props.texts?.linkText)
+    props.texts?.title && /* @__PURE__ */ React55.createElement("div", { className: "mt-2 text-lg font-medium" }, props.texts?.title, " "),
+    props.texts?.description && /* @__PURE__ */ React55.createElement("div", { className: "z-10 mt-4 text-sm" }, props.texts?.description),
+    props.texts?.linkText && /* @__PURE__ */ React55.createElement("div", { className: "z-10 mt-6 text-sm underline underline-offset-8" }, props.texts?.linkText)
   );
 };
 
-// src/elements/HawaStoreButtons.tsx
-import React57 from "react";
-var HawaStoreButtons = (props) => {
-  return /* @__PURE__ */ React57.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React57.createElement("div", null, props.store === "apple" ? props.mode === "dark" ? /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg bg-black text-white" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "currentColor",
-      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
-    }
-  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "Download on the"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-2xl font-semibold" }, "App Store"))) : /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg border border-black bg-transparent text-black" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "currentColor",
-      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
-    }
-  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "Download on the"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-2xl font-semibold" }, "App Store"))) : props.mode === "dark" ? /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg bg-black text-white" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "#FFD400",
-      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
-    }
-  ), /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "#FF3333",
-      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
-    }
-  ), /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "#48FF48",
-      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
-    }
-  ), /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "#3BCCFF",
-      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
-    }
-  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "GET IT ON"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-xl font-semibold" }, "Google Play"))) : /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg border border-black bg-white text-black" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React57.createElement(
-    "path",
-    {
-      fill: "#FFD400",
-      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
-    }
-  ), /* @__PURE__ */ React57.createElement(
-    "path",
+// src/elements/HawaButton.tsx
+import React56, { useState as useState29 } from "react";
+import clsx26 from "clsx";
+var disabledSyles = "cursor-default pointer-events-none";
+var disabledVariantSyles = {
+  contained: "text-gray-300 bg-gray-100",
+  outlined: "text-gray-300 border-gray-300"
+};
+var baseStyles = "cursor-pointer  justify-center items-center text-center font-medium transition-all ";
+var sizeStyles = {
+  icon: "h-10 w-10",
+  xs: "px-1.5 py-2 text-[9px] h-fit",
+  small: "text-xs px-2.5 py-1.5",
+  medium: "text-sm leading-4 px-3 py-2",
+  default: "h-10 px-4 py-2",
+  large: "text-sm px-4 py-2",
+  noPadding: "p-0",
+  full: "h-full max-h-full p-2"
+};
+var widthStyles = {
+  full: "w-full flex justify-center px-5 py-2.5 text-center inline-flex items-center",
+  half: "w-full text-center flex items-center justify-center h-full",
+  normal: "w-fit dark:bg-buttonPrimary-dark dark:hover:bg-buttonPrimary-700 dark:hover:brightness-90 dark:focus:ring-buttonPrimary-500"
+};
+var containerWidthStyles = {
+  full: "w-full flex justify-center text-center inline-flex items-center",
+  half: "w-1/2",
+  normal: "w-fit"
+};
+var variantStyles = {
+  contained: "border-transparent",
+  // outlined: "bg-transparent border",
+  outlined: "border border-input bg-background hover:bg-accent hover:text-accent-foreground"
+};
+var colorStyles = {
+  contained: {
+    default: "text-neutral-900 bg-buttonPrimary-500 hover:bg-buttonPrimary-700 bg-buttonPrimary-500 text-white",
+    primary: "text-white bg-buttonPrimary-500 hover:bg-buttonPrimary-700 transition-all",
+    secondary: "bg-buttonSecondary-500 hover:text-white hover:bg-buttonSecondary-700",
+    gray: "text-neutral-900 bg-gray-200 hover:bg-gray-300",
+    dark: "text-neutral-900 bg-gray-200 hover:bg-gray-300"
+  },
+  outlined: {
+    default: "text-gray-600 border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-800 dark:text-white",
+    primary: "text-black hover:bg-gray-50  dark:text-white",
+    secondary: " dark:text-white text-secondary-800 border-secondary-800 hover:bg-buttonSecondary-700 hover:text-white",
+    gray: "border-gray-300 hover:bg-gray-200",
+    dark: "border-gray-900 hover:bg-gray-700"
+  }
+};
+var HawaButton = ({
+  className,
+  variant = "contained",
+  color = "default",
+  size = "default",
+  width = "normal",
+  disabled = false,
+  isLoading = false,
+  tooltip,
+  tooltipSize = "normal",
+  tooltipPosition = "top-left",
+  tooltipDirection = "ltr",
+  margins = "2",
+  children,
+  badge,
+  edgeCorner = false,
+  feedback,
+  ...props
+}) => {
+  const [isClicked, setIsClicked] = useState29(false);
+  const [buttonText, setButtonText] = useState29(children);
+  const handleClick = (event) => {
+    if (props.onClick) {
+      props.onClick(event);
+    }
+    if (feedback && !isClicked) {
+      setButtonText(feedback);
+      setIsClicked(true);
+      setTimeout(() => {
+        setButtonText(children);
+        setIsClicked(false);
+      }, 2e3);
+    }
+  };
+  return /* @__PURE__ */ React56.createElement(
+    "div",
+    {
+      className: clsx26(
+        "relative",
+        margins !== "none" ? `my-${margins}` : "m-0",
+        containerWidthStyles[width]
+      )
+    },
+    tooltip ? /* @__PURE__ */ React56.createElement(
+      HawaTooltip,
+      {
+        direction: tooltipDirection,
+        position: tooltipPosition,
+        size: tooltipSize,
+        content: tooltip
+      },
+      /* @__PURE__ */ React56.createElement(
+        "button",
+        {
+          className: disabled ? clsx26(
+            className,
+            baseStyles,
+            edgeCorner ? "rounded-inner" : "rounded",
+            variantStyles[variant],
+            sizeStyles[size],
+            widthStyles[width],
+            disabledSyles,
+            disabledVariantSyles[variant]
+          ) : clsx26(
+            className,
+            baseStyles,
+            edgeCorner ? "rounded-inner" : "rounded",
+            variantStyles[variant],
+            sizeStyles[size],
+            colorStyles[variant][color],
+            widthStyles[width]
+          ),
+          disabled,
+          onClick: props.onClick
+        },
+        !isLoading ? children : /* @__PURE__ */ React56.createElement(HawaLoading, { size: "button" })
+      )
+    ) : /* @__PURE__ */ React56.createElement(
+      "button",
+      {
+        className: disabled ? clsx26(
+          className,
+          baseStyles,
+          edgeCorner ? "rounded-inner" : "rounded",
+          variantStyles[variant],
+          sizeStyles[size],
+          widthStyles[width],
+          disabledSyles,
+          disabledVariantSyles[variant]
+        ) : clsx26(
+          className,
+          "overflow-x-clip",
+          baseStyles,
+          edgeCorner ? "rounded-inner" : "rounded",
+          variantStyles[variant],
+          sizeStyles[size],
+          colorStyles[variant][color],
+          widthStyles[width]
+        ),
+        disabled,
+        onClick: handleClick
+      },
+      !isLoading ? /* @__PURE__ */ React56.createElement(
+        "div",
+        {
+          className: clsx26(
+            " s flex flex-col-reverse items-start justify-center gap-4 transition-all",
+            isClicked && feedback ? " -translate-y-8 pb-1 pt-1" : "translate-y-0"
+          )
+        },
+        isClicked && feedback ? /* @__PURE__ */ React56.createElement("div", { className: "w-full  text-center" }, buttonText) : null,
+        /* @__PURE__ */ React56.createElement("div", { className: "flex w-full select-none flex-row items-center justify-center gap-2 whitespace-nowrap" }, props.startIcon && props.startIcon, children, props.endIcon && props.endIcon)
+      ) : /* @__PURE__ */ React56.createElement(HawaLoading, { design: "dots-pulse", color: "bg-white", size: "button" })
+    ),
+    badge && /* @__PURE__ */ React56.createElement(
+      "div",
+      {
+        className: clsx26(
+          typeof badge === "boolean" ? "h-5 w-5" : typeof badge === "string" ? "h-5 w-7" : "h-6 w-6",
+          "absolute -right-2 -top-2 inline-flex select-none  items-center justify-center rounded-full border-2 border-white bg-red-500 text-[9px] font-bold text-white dark:border-gray-900"
+        )
+      },
+      typeof badge === "number" && badge > 100 ? "+99" : badge
+    )
+  );
+};
+
+// src/elements/HawaStoreButtons.tsx
+import React57 from "react";
+var HawaStoreButtons = (props) => {
+  return /* @__PURE__ */ React57.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ React57.createElement("div", null, props.store === "apple" ? props.mode === "dark" ? /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg bg-black text-white" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
+    }
+  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "Download on the"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-2xl font-semibold" }, "App Store"))) : /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg border border-black bg-transparent text-black" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
+    }
+  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "Download on the"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-2xl font-semibold" }, "App Store"))) : props.mode === "dark" ? /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg bg-black text-white" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "#FFD400",
+      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+    }
+  ), /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "#FF3333",
+      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "#48FF48",
+      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "#3BCCFF",
+      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
+    }
+  ))), /* @__PURE__ */ React57.createElement("div", null, /* @__PURE__ */ React57.createElement("div", { className: "text-xs" }, "GET IT ON"), /* @__PURE__ */ React57.createElement("div", { className: "font-sans -mt-1 text-xl font-semibold" }, "Google Play"))) : /* @__PURE__ */ React57.createElement("div", { className: "mt-3 flex h-14 w-48 items-center justify-center rounded-lg border border-black bg-white text-black" }, /* @__PURE__ */ React57.createElement("div", { className: "mr-3" }, /* @__PURE__ */ React57.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React57.createElement(
+    "path",
+    {
+      fill: "#FFD400",
+      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+    }
+  ), /* @__PURE__ */ React57.createElement(
+    "path",
     {
       fill: "#FF3333",
       d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
@@ -6962,33 +6970,136 @@ function Toaster(props) {
   }), /* @__PURE__ */ React67.createElement(ToastViewport, { className: cn("gap-2", isRTL && "fixed left-0") }));
 }
 
+// src/elements/Dialog.tsx
+import * as React68 from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ React68.createElement(DialogPrimitive.Portal, { className: cn(className), ...props });
+DialogPortal.displayName = DialogPrimitive.Portal.displayName;
+var DialogOverlay = React68.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React68.createElement(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      className
+    ),
+    ...props
+  }
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React68.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React68.createElement(DialogPortal, null, /* @__PURE__ */ React68.createElement(DialogOverlay, null), /* @__PURE__ */ React68.createElement(
+  DialogPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",
+      className
+    ),
+    ...props
+  },
+  children,
+  /* @__PURE__ */ React68.createElement(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" }, /* @__PURE__ */ React68.createElement(
+    "svg",
+    {
+      "aria-label": "Close Icon",
+      "aria-hidden": "true",
+      className: "h-5 w-5",
+      fill: "currentColor",
+      viewBox: "0 0 20 20"
+    },
+    /* @__PURE__ */ React68.createElement(
+      "path",
+      {
+        fillRule: "evenodd",
+        d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+        clipRule: "evenodd"
+      }
+    )
+  ), /* @__PURE__ */ React68.createElement("span", { className: "sr-only" }, "Close"))
+)));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ React68.createElement(
+  "div",
+  {
+    className: cn(
+      "flex flex-col space-y-1.5 text-center sm:text-left",
+      className
+    ),
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ React68.createElement(
+  "div",
+  {
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React68.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React68.createElement(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React68.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React68.createElement(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-sm text-muted-foreground", className),
+    ...props
+  }
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
 // src/layout/Box.tsx
-import React68 from "react";
+import React69 from "react";
 var Box = (props) => {
-  return /* @__PURE__ */ React68.createElement("div", null, props.children);
+  return /* @__PURE__ */ React69.createElement("div", null, props.children);
 };
 
 // src/layout/HawaBottomAppBar.tsx
-import React69 from "react";
+import React70 from "react";
 var HawaBottomAppBar = (props) => {
-  return /* @__PURE__ */ React69.createElement("div", { className: "fixed bottom-0 top-auto left-0 m-0 w-full max-w-full  p-1" }, /* @__PURE__ */ React69.createElement(
+  return /* @__PURE__ */ React70.createElement("div", { className: "fixed bottom-0 top-auto left-0 m-0 w-full max-w-full  p-1" }, /* @__PURE__ */ React70.createElement(
     "div",
     {
       className: "flex w-full flex-row items-center justify-evenly rounded bg-gray-200"
     },
-    props.appBarContent.map((singleContent, i) => /* @__PURE__ */ React69.createElement(
+    props.appBarContent.map((singleContent, i) => /* @__PURE__ */ React70.createElement(
       "div",
       {
         key: i,
         className: "m-1 flex h-full w-full flex-col items-center justify-center rounded p-2 transition-all hover:cursor-pointer hover:bg-buttonPrimary-700 hover:text-white",
         onClick: singleContent.action
       },
-      /* @__PURE__ */ React69.createElement(
+      /* @__PURE__ */ React70.createElement(
         "div",
         null,
         singleContent.icon
       ),
-      /* @__PURE__ */ React69.createElement(
+      /* @__PURE__ */ React70.createElement(
         "div",
         {
           className: "mt-2 text-sm"
@@ -7000,7 +7111,7 @@ var HawaBottomAppBar = (props) => {
 };
 
 // src/layout/HawaSiteLayout.tsx
-import React72, { useEffect as useEffect21, useRef as useRef13, useState as useState36 } from "react";
+import React73, { useEffect as useEffect21, useRef as useRef13, useState as useState36 } from "react";
 import clsx27 from "clsx";
 
 // src/hooks/useDiscloser.ts
@@ -7089,7 +7200,7 @@ var HawaSiteLayout = ({
     // "w-full",
     // "top-14 h-[calc(100%-3.5rem)]",
   ];
-  return /* @__PURE__ */ React72.createElement("div", { className: "h-full w-full" }, /* @__PURE__ */ React72.createElement(
+  return /* @__PURE__ */ React73.createElement("div", { className: "h-full w-full" }, /* @__PURE__ */ React73.createElement(
     "div",
     {
       className: clsx27(
@@ -7102,7 +7213,7 @@ var HawaSiteLayout = ({
         direction === "rtl" ? "flex-row" : "flex-row-reverse"
       )
     },
-    size > 600 ? /* @__PURE__ */ React72.createElement("div", { className: "flex  flex-row h-8    items-center  gap-4 px-3" }, props.navItems?.map(({ label }, i) => /* @__PURE__ */ React72.createElement(
+    size > 600 ? /* @__PURE__ */ React73.createElement("div", { className: "flex  flex-row h-8    items-center  gap-4 px-3" }, props.navItems?.map(({ label }, i) => /* @__PURE__ */ React73.createElement(
       "div",
       {
         onClick: () => setOpenSideMenu(!openSideMenu),
@@ -7110,13 +7221,13 @@ var HawaSiteLayout = ({
         className: "cursor-pointer rounded bg-none text-gray-600 transition-all hover:text-black"
       },
       label
-    ))) : /* @__PURE__ */ React72.createElement("div", { className: "flex items-center justify-center" }, /* @__PURE__ */ React72.createElement(
+    ))) : /* @__PURE__ */ React73.createElement("div", { className: "flex items-center justify-center" }, /* @__PURE__ */ React73.createElement(
       "div",
       {
         onClick: () => setOpenSideMenu(!openSideMenu),
         className: "cursor-pointer  rounded p-1  transition-all hover:bg-gray-100"
       },
-      /* @__PURE__ */ React72.createElement(
+      /* @__PURE__ */ React73.createElement(
         "svg",
         {
           stroke: "currentColor",
@@ -7127,7 +7238,7 @@ var HawaSiteLayout = ({
           height: "1.6em",
           width: "1.6em"
         },
-        /* @__PURE__ */ React72.createElement(
+        /* @__PURE__ */ React73.createElement(
           "path",
           {
             fillRule: "evenodd",
@@ -7137,15 +7248,15 @@ var HawaSiteLayout = ({
         )
       ),
       " "
-    ), props.pageTitle ? /* @__PURE__ */ React72.createElement("div", null, props.pageTitle) : /* @__PURE__ */ React72.createElement("div", null)),
-    /* @__PURE__ */ React72.createElement("div", { className: "h-full" }, /* @__PURE__ */ React72.createElement(
+    ), props.pageTitle ? /* @__PURE__ */ React73.createElement("div", null, props.pageTitle) : /* @__PURE__ */ React73.createElement("div", null)),
+    /* @__PURE__ */ React73.createElement("div", { className: "h-full" }, /* @__PURE__ */ React73.createElement(
       "img",
       {
         className: "h-full max-h-8 ",
         src: `https://sikka-images.s3.ap-southeast-1.amazonaws.com/seera/seera-horizontal-wordmark-${direction === "rtl" ? "ar" : "en"}-white.svg`
       }
     ))
-  ), /* @__PURE__ */ React72.createElement(
+  ), /* @__PURE__ */ React73.createElement(
     "div",
     {
       className: clsx27(" relative top-14")
@@ -7155,17 +7266,17 @@ var HawaSiteLayout = ({
 };
 
 // src/layout/AppLayout.tsx
-import React74, { useEffect as useEffect22, useRef as useRef14, useState as useState37 } from "react";
+import React75, { useEffect as useEffect22, useRef as useRef14, useState as useState37 } from "react";
 import clsx28 from "clsx";
 
 // src/layout/Sidebar.tsx
-import * as React73 from "react";
+import * as React74 from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
 var Accordion = AccordionPrimitive.Root;
 var triggerStyles = "flex flex-1 items-center select-none cursor-pointer bg-primary-foreground rounded justify-between p-2 px-3 font-medium transition-all  [&[data-state=open]>svg]:-rotate-90";
-var AccordionItem = React73.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React73.createElement(AccordionPrimitive.Item, { ref, className: cn(className), ...props }));
+var AccordionItem = React74.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React74.createElement(AccordionPrimitive.Item, { ref, className: cn(className), ...props }));
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React73.forwardRef(({ className, showArrow, children, ...props }, ref) => /* @__PURE__ */ React73.createElement(AccordionPrimitive.Header, { className: "flex" }, /* @__PURE__ */ React73.createElement(
+var AccordionTrigger = React74.forwardRef(({ className, showArrow, children, ...props }, ref) => /* @__PURE__ */ React74.createElement(AccordionPrimitive.Header, { className: "flex" }, /* @__PURE__ */ React74.createElement(
   AccordionPrimitive.Trigger,
   {
     ref,
@@ -7173,7 +7284,7 @@ var AccordionTrigger = React73.forwardRef(({ className, showArrow, children, ...
     ...props
   },
   children,
-  showArrow && /* @__PURE__ */ React73.createElement(
+  showArrow && /* @__PURE__ */ React74.createElement(
     "svg",
     {
       "aria-label": "Chevron Right Icon",
@@ -7184,7 +7295,7 @@ var AccordionTrigger = React73.forwardRef(({ className, showArrow, children, ...
       width: "1em",
       className: "h-4 w-4 shrink-0 rotate-90 transition-transform duration-200"
     },
-    /* @__PURE__ */ React73.createElement(
+    /* @__PURE__ */ React74.createElement(
       "path",
       {
         d: "M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"
@@ -7193,7 +7304,7 @@ var AccordionTrigger = React73.forwardRef(({ className, showArrow, children, ...
   )
 )));
 AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-var AccordionContent = React73.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React73.createElement(
+var AccordionContent = React74.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React74.createElement(
   AccordionPrimitive.Content,
   {
     ref,
@@ -7203,7 +7314,7 @@ var AccordionContent = React73.forwardRef(({ className, children, ...props }, re
     ),
     ...props
   },
-  /* @__PURE__ */ React73.createElement("div", null, children)
+  /* @__PURE__ */ React74.createElement("div", null, children)
 ));
 AccordionContent.displayName = AccordionPrimitive.Content.displayName;
 var SidebarGroup = ({
@@ -7217,7 +7328,7 @@ var SidebarGroup = ({
   direction,
   isOpen
 }) => {
-  return /* @__PURE__ */ React73.createElement("div", null, title && /* @__PURE__ */ React73.createElement("h3", { className: "mb-1 font-bold" }, title), /* @__PURE__ */ React73.createElement("ul", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React73.createElement(
+  return /* @__PURE__ */ React74.createElement("div", null, title && /* @__PURE__ */ React74.createElement("h3", { className: "mb-1 font-bold" }, title), /* @__PURE__ */ React74.createElement("ul", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React74.createElement(
     Accordion,
     {
       value: openedItem,
@@ -7228,7 +7339,7 @@ var SidebarGroup = ({
       collapsible: true,
       className: "flex flex-col gap-1"
     },
-    items.map((item, idx) => /* @__PURE__ */ React73.createElement(
+    items.map((item, idx) => /* @__PURE__ */ React74.createElement(
       SidebarItem,
       {
         isOpen,
@@ -7254,20 +7365,20 @@ var SidebarItem = ({
     return isSelected && isSelected[index] === value ? "bg-primary text-primary-foreground  cursor-default" : "hover:bg-primary/10";
   };
   if (item.subitems) {
-    return /* @__PURE__ */ React73.createElement(
+    return /* @__PURE__ */ React74.createElement(
       AccordionItem,
       {
         value: item.value,
         className: "overflow-x-clip",
         dir: direction
       },
-      /* @__PURE__ */ React73.createElement(
+      /* @__PURE__ */ React74.createElement(
         AccordionTrigger,
         {
           className: cn(getSelectedStyle(item.value, 0)),
           showArrow: isOpen
         },
-        /* @__PURE__ */ React73.createElement(
+        /* @__PURE__ */ React74.createElement(
           "div",
           {
             className: cn(
@@ -7276,7 +7387,7 @@ var SidebarItem = ({
             )
           },
           item.icon,
-          isOpen && /* @__PURE__ */ React73.createElement(
+          isOpen && /* @__PURE__ */ React74.createElement(
             "span",
             {
               className: cn(
@@ -7288,12 +7399,12 @@ var SidebarItem = ({
           )
         )
       ),
-      item.subitems && /* @__PURE__ */ React73.createElement(AccordionContent, { className: " mt-1 h-full rounded  " }, /* @__PURE__ */ React73.createElement(
+      item.subitems && /* @__PURE__ */ React74.createElement(AccordionContent, { className: " mt-1 h-full rounded  " }, /* @__PURE__ */ React74.createElement(
         "div",
         {
           className: cn("flex h-full flex-col gap-2 bg-foreground/5 p-1")
         },
-        item.subitems.map((subitem, idx) => /* @__PURE__ */ React73.createElement(
+        item.subitems.map((subitem, idx) => /* @__PURE__ */ React74.createElement(
           "li",
           {
             key: idx,
@@ -7314,7 +7425,7 @@ var SidebarItem = ({
       ))
     );
   } else {
-    return /* @__PURE__ */ React73.createElement(
+    return /* @__PURE__ */ React74.createElement(
       "div",
       {
         dir: direction,
@@ -7329,7 +7440,7 @@ var SidebarItem = ({
           "overflow-x-clip "
         )
       },
-      /* @__PURE__ */ React73.createElement("div", { className: "flex flex-row items-center gap-2 " }, item.icon, /* @__PURE__ */ React73.createElement(
+      /* @__PURE__ */ React74.createElement("div", { className: "flex flex-row items-center gap-2 " }, item.icon, /* @__PURE__ */ React74.createElement(
         "span",
         {
           className: cn(
@@ -7394,7 +7505,7 @@ var AppLayout = ({
       document.removeEventListener("click", handleClickOutside, true);
     };
   }, [keepOpen]);
-  return /* @__PURE__ */ React74.createElement("div", { className: "fixed left-0" }, props.topBar && /* @__PURE__ */ React74.createElement(
+  return /* @__PURE__ */ React75.createElement("div", { className: "fixed left-0" }, props.topBar && /* @__PURE__ */ React75.createElement(
     "div",
     {
       className: clsx28(
@@ -7402,7 +7513,7 @@ var AppLayout = ({
         isRTL ? "flex-row-reverse" : "flex-row"
       )
     },
-    size > 600 ? /* @__PURE__ */ React74.createElement(
+    size > 600 ? /* @__PURE__ */ React75.createElement(
       "div",
       {
         className: clsx28(
@@ -7418,19 +7529,19 @@ var AppLayout = ({
       props.pageTitle
     ) : (
       // Mobile Drawer Menu Button
-      /* @__PURE__ */ React74.createElement(
+      /* @__PURE__ */ React75.createElement(
         "div",
         {
           dir: direction,
           className: "flex items-center justify-center gap-0.5"
         },
-        /* @__PURE__ */ React74.createElement(
+        /* @__PURE__ */ React75.createElement(
           "div",
           {
             onClick: () => setOpenSideMenu(true),
             className: "z-40 mx-1 cursor-pointer  rounded p-2  transition-all hover:bg-gray-100"
           },
-          /* @__PURE__ */ React74.createElement(
+          /* @__PURE__ */ React75.createElement(
             "svg",
             {
               stroke: "currentColor",
@@ -7441,7 +7552,7 @@ var AppLayout = ({
               height: "1.6em",
               width: "1.6em"
             },
-            /* @__PURE__ */ React74.createElement(
+            /* @__PURE__ */ React75.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -7451,10 +7562,10 @@ var AppLayout = ({
             )
           )
         ),
-        props.pageTitle ? /* @__PURE__ */ React74.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React74.createElement("div", null)
+        props.pageTitle ? /* @__PURE__ */ React75.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React75.createElement("div", null)
       )
     ),
-    /* @__PURE__ */ React74.createElement(
+    /* @__PURE__ */ React75.createElement(
       "div",
       {
         className: clsx28(
@@ -7462,16 +7573,16 @@ var AppLayout = ({
           isRTL ? "flex-row-reverse" : "flex-row"
         )
       },
-      size > 600 ? /* @__PURE__ */ React74.createElement(
+      size > 600 ? /* @__PURE__ */ React75.createElement(
         "div",
         {
           className: isRTL ? "text-left text-xs" : "text-right text-xs"
         },
-        /* @__PURE__ */ React74.createElement("div", { className: "font-bold" }, props.username),
+        /* @__PURE__ */ React75.createElement("div", { className: "font-bold" }, props.username),
         " ",
-        /* @__PURE__ */ React74.createElement("div", null, props.email)
+        /* @__PURE__ */ React75.createElement("div", null, props.email)
       ) : null,
-      /* @__PURE__ */ React74.createElement(
+      /* @__PURE__ */ React75.createElement(
         DropdownMenu,
         {
           triggerClassname: "mx-2",
@@ -7480,7 +7591,7 @@ var AppLayout = ({
           side: "bottom",
           sideOffset: 5,
           direction: isRTL ? "rtl" : "ltr",
-          trigger: /* @__PURE__ */ React74.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-clip rounded ring-1 ring-primary/30 dark:bg-gray-600" }, /* @__PURE__ */ React74.createElement(
+          trigger: /* @__PURE__ */ React75.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-clip rounded ring-1 ring-primary/30 dark:bg-gray-600" }, /* @__PURE__ */ React75.createElement(
             "svg",
             {
               "aria-label": "Avatar Icon",
@@ -7488,7 +7599,7 @@ var AppLayout = ({
               fill: "currentColor",
               viewBox: "0 0 20 20"
             },
-            /* @__PURE__ */ React74.createElement(
+            /* @__PURE__ */ React75.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -7502,7 +7613,7 @@ var AppLayout = ({
         }
       )
     )
-  ), /* @__PURE__ */ React74.createElement(
+  ), /* @__PURE__ */ React75.createElement(
     "div",
     {
       className: clsx28(
@@ -7525,7 +7636,7 @@ var AppLayout = ({
       },
       ref
     },
-    /* @__PURE__ */ React74.createElement(
+    /* @__PURE__ */ React75.createElement(
       "div",
       {
         dir: direction,
@@ -7537,7 +7648,7 @@ var AppLayout = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      /* @__PURE__ */ React74.createElement(
+      /* @__PURE__ */ React75.createElement(
         "img",
         {
           className: clsx28(
@@ -7547,7 +7658,7 @@ var AppLayout = ({
           src: props.logoLink
         }
       ),
-      size > 600 ? /* @__PURE__ */ React74.createElement(
+      size > 600 ? /* @__PURE__ */ React75.createElement(
         "img",
         {
           className: clsx28(
@@ -7560,7 +7671,7 @@ var AppLayout = ({
         }
       ) : null
     ),
-    /* @__PURE__ */ React74.createElement(
+    /* @__PURE__ */ React75.createElement(
       "div",
       {
         className: clsx28(
@@ -7573,7 +7684,7 @@ var AppLayout = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      /* @__PURE__ */ React74.createElement(
+      /* @__PURE__ */ React75.createElement(
         SidebarGroup,
         {
           direction,
@@ -7593,7 +7704,7 @@ var AppLayout = ({
         }
       )
     ),
-    /* @__PURE__ */ React74.createElement(
+    /* @__PURE__ */ React75.createElement(
       "div",
       {
         className: clsx28(
@@ -7605,22 +7716,22 @@ var AppLayout = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      DrawerFooterActions && openSideMenu ? /* @__PURE__ */ React74.createElement(React74.Fragment, null, DrawerFooterActions) : null,
-      size > 600 && openSideMenu ? /* @__PURE__ */ React74.createElement(
+      DrawerFooterActions && openSideMenu ? /* @__PURE__ */ React75.createElement(React75.Fragment, null, DrawerFooterActions) : null,
+      size > 600 && openSideMenu ? /* @__PURE__ */ React75.createElement(
         Tooltip,
         {
           side: "left",
           delayDuration: 500,
           content: keepOpen ? props.texts?.collapseSidebar || "Collapse Sidebar" : props.texts?.expandSidebar || "Expand Sidebar"
         },
-        /* @__PURE__ */ React74.createElement(
+        /* @__PURE__ */ React75.createElement(
           Button,
           {
             variant: "light",
             onClick: () => setKeepOpen(!keepOpen),
             size: "smallIcon"
           },
-          /* @__PURE__ */ React74.createElement(
+          /* @__PURE__ */ React75.createElement(
             "svg",
             {
               className: clsx28(
@@ -7630,7 +7741,7 @@ var AppLayout = ({
               fill: "currentColor",
               viewBox: "0 0 20 20"
             },
-            /* @__PURE__ */ React74.createElement(
+            /* @__PURE__ */ React75.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -7642,7 +7753,7 @@ var AppLayout = ({
         )
       ) : null
     )
-  ), /* @__PURE__ */ React74.createElement(
+  ), /* @__PURE__ */ React75.createElement(
     "div",
     {
       className: "fixed overflow-y-auto transition-all",
@@ -7673,7 +7784,7 @@ var AppLayout = ({
 };
 
 // src/layout/HawaAppLayout.tsx
-import React75, { useEffect as useEffect23, useRef as useRef15, useState as useState38 } from "react";
+import React76, { useEffect as useEffect23, useRef as useRef15, useState as useState38 } from "react";
 import clsx29 from "clsx";
 import { FaChevronRight } from "react-icons/fa";
 var HawaAppLayout = ({
@@ -7719,7 +7830,7 @@ var HawaAppLayout = ({
     }
   };
   let drawerSizeCondition = size > 600 ? drawerSizeStyle[keepOpen ? "opened" : "closed"][drawerSize] : 0;
-  return /* @__PURE__ */ React75.createElement("div", { className: "fixed" }, props.topBar && /* @__PURE__ */ React75.createElement(
+  return /* @__PURE__ */ React76.createElement("div", { className: "fixed" }, props.topBar && /* @__PURE__ */ React76.createElement(
     "div",
     {
       className: clsx29(
@@ -7729,7 +7840,7 @@ var HawaAppLayout = ({
     },
     size > 600 ? props.pageTitle ? (
       // Title of the page
-      /* @__PURE__ */ React75.createElement(
+      /* @__PURE__ */ React76.createElement(
         "div",
         {
           className: clsx29(
@@ -7745,19 +7856,19 @@ var HawaAppLayout = ({
       )
     ) : null : (
       // Mobile Drawer Menu Button
-      /* @__PURE__ */ React75.createElement(
+      /* @__PURE__ */ React76.createElement(
         "div",
         {
           dir: direction,
           className: "flex items-center justify-center gap-0.5 "
         },
-        /* @__PURE__ */ React75.createElement(
+        /* @__PURE__ */ React76.createElement(
           "div",
           {
             onClick: () => setOpenSideMenu(true),
             className: "z-40 mx-1 cursor-pointer  rounded p-2  transition-all hover:bg-gray-100"
           },
-          /* @__PURE__ */ React75.createElement(
+          /* @__PURE__ */ React76.createElement(
             "svg",
             {
               stroke: "currentColor",
@@ -7768,7 +7879,7 @@ var HawaAppLayout = ({
               height: "1.6em",
               width: "1.6em"
             },
-            /* @__PURE__ */ React75.createElement(
+            /* @__PURE__ */ React76.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -7779,10 +7890,10 @@ var HawaAppLayout = ({
           ),
           " "
         ),
-        props.pageTitle ? /* @__PURE__ */ React75.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React75.createElement("div", null)
+        props.pageTitle ? /* @__PURE__ */ React76.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React76.createElement("div", null)
       )
     ),
-    /* @__PURE__ */ React75.createElement(
+    /* @__PURE__ */ React76.createElement(
       "div",
       {
         className: clsx29(
@@ -7790,18 +7901,18 @@ var HawaAppLayout = ({
           isRTL ? "flex-row-reverse" : "flex-row"
         )
       },
-      size > 600 ? /* @__PURE__ */ React75.createElement(
+      size > 600 ? /* @__PURE__ */ React76.createElement(
         "div",
         {
           className: clsx29(
             isRTL ? "text-left text-xs" : "text-right text-xs"
           )
         },
-        /* @__PURE__ */ React75.createElement("div", { className: "font-bold" }, props.username),
+        /* @__PURE__ */ React76.createElement("div", { className: "font-bold" }, props.username),
         " ",
-        /* @__PURE__ */ React75.createElement("div", null, props.email)
+        /* @__PURE__ */ React76.createElement("div", null, props.email)
       ) : null,
-      /* @__PURE__ */ React75.createElement(
+      /* @__PURE__ */ React76.createElement(
         HawaMenu,
         {
           direction,
@@ -7811,14 +7922,14 @@ var HawaAppLayout = ({
           menuItems: props.profileMenuItems,
           position: "bottom-left"
         },
-        /* @__PURE__ */ React75.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-hidden rounded-full ring-1 ring-buttonPrimary-500 dark:bg-gray-600" }, /* @__PURE__ */ React75.createElement(
+        /* @__PURE__ */ React76.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-hidden rounded-full ring-1 ring-buttonPrimary-500 dark:bg-gray-600" }, /* @__PURE__ */ React76.createElement(
           "svg",
           {
             className: "absolute -left-1 h-10 w-10 text-gray-400",
             fill: "currentColor",
             viewBox: "0 0 20 20"
           },
-          /* @__PURE__ */ React75.createElement(
+          /* @__PURE__ */ React76.createElement(
             "path",
             {
               fillRule: "evenodd",
@@ -7829,7 +7940,7 @@ var HawaAppLayout = ({
         ))
       )
     )
-  ), /* @__PURE__ */ React75.createElement(
+  ), /* @__PURE__ */ React76.createElement(
     "div",
     {
       onMouseEnter: () => {
@@ -7846,7 +7957,7 @@ var HawaAppLayout = ({
         width: size > 600 ? openSideMenu ? `${drawerSizeStyle["opened"][drawerSize]}px` : `${drawerSizeStyle["closed"][drawerSize]}px` : openSideMenu ? `${drawerSizeStyle["opened"][drawerSize]}px` : "0px"
       }
     },
-    /* @__PURE__ */ React75.createElement(
+    /* @__PURE__ */ React76.createElement(
       "div",
       {
         className: clsx29(
@@ -7855,7 +7966,7 @@ var HawaAppLayout = ({
           openSideMenu ? "overflow-auto" : "overflow-hidden"
         )
       },
-      /* @__PURE__ */ React75.createElement(
+      /* @__PURE__ */ React76.createElement(
         "div",
         {
           dir: direction,
@@ -7867,7 +7978,7 @@ var HawaAppLayout = ({
             width: size > 600 ? `${drawerSizeStyle[openSideMenu ? "opened" : "closed"][drawerSize] - 16}px` : "full"
           }
         },
-        /* @__PURE__ */ React75.createElement(
+        /* @__PURE__ */ React76.createElement(
           "img",
           {
             className: clsx29(
@@ -7879,7 +7990,7 @@ var HawaAppLayout = ({
             src: props.logoLink
           }
         ),
-        size > 600 ? /* @__PURE__ */ React75.createElement(
+        size > 600 ? /* @__PURE__ */ React76.createElement(
           "img",
           {
             className: clsx29(
@@ -7891,14 +8002,14 @@ var HawaAppLayout = ({
           }
         ) : null
       ),
-      /* @__PURE__ */ React75.createElement("div", { className: "mb-10 mt-14" }, props.drawerItems?.map((dSection, dIndex) => /* @__PURE__ */ React75.createElement(
+      /* @__PURE__ */ React76.createElement("div", { className: "mb-10 mt-14" }, props.drawerItems?.map((dSection, dIndex) => /* @__PURE__ */ React76.createElement(
         "div",
         {
           key: dIndex,
           className: clsx29("flex flex-col items-stretch justify-center")
         },
         dSection?.map((dItem, i) => {
-          return /* @__PURE__ */ React75.createElement("div", { key: i, id: "test", className: "flex flex-col" }, /* @__PURE__ */ React75.createElement(
+          return /* @__PURE__ */ React76.createElement("div", { key: i, id: "test", className: "flex flex-col" }, /* @__PURE__ */ React76.createElement(
             "div",
             {
               onClick: () => {
@@ -7918,7 +8029,7 @@ var HawaAppLayout = ({
                 isRTL ? "flex-row-reverse pr-3" : ""
               )
             },
-            /* @__PURE__ */ React75.createElement("div", { className: "flex flex-row", dir: direction }, /* @__PURE__ */ React75.createElement("div", { className: "flex items-center justify-center" }, dItem.icon), /* @__PURE__ */ React75.createElement(
+            /* @__PURE__ */ React76.createElement("div", { className: "flex flex-row", dir: direction }, /* @__PURE__ */ React76.createElement("div", { className: "flex items-center justify-center" }, dItem.icon), /* @__PURE__ */ React76.createElement(
               "div",
               {
                 className: clsx29(
@@ -7928,16 +8039,16 @@ var HawaAppLayout = ({
               },
               dItem.label
             )),
-            dItem.subItems && /* @__PURE__ */ React75.createElement(
+            dItem.subItems && /* @__PURE__ */ React76.createElement(
               "div",
               {
                 className: clsx29(
                   openSubItem && dItem.slug === openSubItem ? "-rotate-90" : "rotate-90"
                 )
               },
-              /* @__PURE__ */ React75.createElement(FaChevronRight, { fontSize: 11 })
+              /* @__PURE__ */ React76.createElement(FaChevronRight, { fontSize: 11 })
             )
-          ), dItem.subItems && /* @__PURE__ */ React75.createElement(
+          ), dItem.subItems && /* @__PURE__ */ React76.createElement(
             "div",
             {
               className: clsx29(
@@ -7949,7 +8060,7 @@ var HawaAppLayout = ({
                 height: openSubItem == dItem.slug && openSideMenu ? 6 + 33 * dItem.subItems?.length : 0
               }
             },
-            dItem.subItems?.map((subIt, s) => /* @__PURE__ */ React75.createElement(
+            dItem.subItems?.map((subIt, s) => /* @__PURE__ */ React76.createElement(
               "div",
               {
                 key: s,
@@ -7963,14 +8074,14 @@ var HawaAppLayout = ({
                   subIt.action();
                 }
               },
-              /* @__PURE__ */ React75.createElement("div", { className: "flex items-center justify-center" }, subIt.icon),
-              /* @__PURE__ */ React75.createElement("div", { className: "flex flex-row justify-between" }, subIt.label)
+              /* @__PURE__ */ React76.createElement("div", { className: "flex items-center justify-center" }, subIt.icon),
+              /* @__PURE__ */ React76.createElement("div", { className: "flex flex-row justify-between" }, subIt.label)
             ))
           ));
         }),
-        dIndex !== props.drawerItems.length - 1 && /* @__PURE__ */ React75.createElement("div", { className: "my-2 h-[1px] w-10/12 self-center bg-buttonPrimary-500 text-center " })
+        dIndex !== props.drawerItems.length - 1 && /* @__PURE__ */ React76.createElement("div", { className: "my-2 h-[1px] w-10/12 self-center bg-buttonPrimary-500 text-center " })
       ))),
-      openSideMenu && /* @__PURE__ */ React75.createElement(
+      openSideMenu && /* @__PURE__ */ React76.createElement(
         "div",
         {
           className: clsx29(
@@ -7983,13 +8094,13 @@ var HawaAppLayout = ({
             width: `${drawerSizeStyle[openSideMenu ? "opened" : "closed"][drawerSize] - 16}px`
           }
         },
-        onSettingsClick && /* @__PURE__ */ React75.createElement(
+        onSettingsClick && /* @__PURE__ */ React76.createElement(
           "div",
           {
             className: " cursor-pointer rounded p-2 transition-all hover:bg-layoutPrimary-700",
             onClick: () => onSettingsClick()
           },
-          /* @__PURE__ */ React75.createElement(
+          /* @__PURE__ */ React76.createElement(
             "svg",
             {
               "aria-label": "Settings Icon",
@@ -8002,11 +8113,11 @@ var HawaAppLayout = ({
               height: "1em",
               width: "1em"
             },
-            /* @__PURE__ */ React75.createElement("circle", { cx: "12", cy: "12", r: "3" }),
-            /* @__PURE__ */ React75.createElement("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })
+            /* @__PURE__ */ React76.createElement("circle", { cx: "12", cy: "12", r: "3" }),
+            /* @__PURE__ */ React76.createElement("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })
           )
         ),
-        size > 600 ? /* @__PURE__ */ React75.createElement(
+        size > 600 ? /* @__PURE__ */ React76.createElement(
           "div",
           {
             className: clsx29("w-fit transition-all"),
@@ -8016,7 +8127,7 @@ var HawaAppLayout = ({
               left: `${drawerSizeStyle[openSideMenu ? "opened" : "closed"][drawerSize] - 35}px`
             }
           },
-          /* @__PURE__ */ React75.createElement(
+          /* @__PURE__ */ React76.createElement(
             "div",
             {
               dir: direction,
@@ -8025,13 +8136,13 @@ var HawaAppLayout = ({
                 openSideMenu ? " opacity-100" : " opacity-0"
               )
             },
-            /* @__PURE__ */ React75.createElement(
+            /* @__PURE__ */ React76.createElement(
               "div",
               {
                 onClick: () => setKeepOpen(!keepOpen),
                 className: "w-fit cursor-pointer rounded bg-gray-300 p-2 transition-all hover:bg-gray-400"
               },
-              /* @__PURE__ */ React75.createElement(
+              /* @__PURE__ */ React76.createElement(
                 FaChevronRight,
                 {
                   fontSize: 14,
@@ -8046,7 +8157,7 @@ var HawaAppLayout = ({
         ) : null
       )
     )
-  ), /* @__PURE__ */ React75.createElement(
+  ), /* @__PURE__ */ React76.createElement(
     "div",
     {
       className: "fixed overflow-y-auto",
@@ -8067,7 +8178,7 @@ var HawaAppLayout = ({
 };
 
 // src/layout/HawaAppLayoutSimplified.tsx
-import React76, { useEffect as useEffect24, useRef as useRef16, useState as useState39 } from "react";
+import React77, { useEffect as useEffect24, useRef as useRef16, useState as useState39 } from "react";
 import clsx30 from "clsx";
 var HawaAppLayoutSimplified = ({
   direction = "rtl",
@@ -8115,7 +8226,7 @@ var HawaAppLayoutSimplified = ({
     }
   };
   let drawerSizeCondition = size > 600 ? drawerSizeStyle[keepOpen ? "opened" : "closed"][drawerSize] : 0;
-  return /* @__PURE__ */ React76.createElement("div", { className: "fixed left-0" }, props.topBar && /* @__PURE__ */ React76.createElement(
+  return /* @__PURE__ */ React77.createElement("div", { className: "fixed left-0" }, props.topBar && /* @__PURE__ */ React77.createElement(
     "div",
     {
       className: clsx30(
@@ -8123,7 +8234,7 @@ var HawaAppLayoutSimplified = ({
         isRTL ? "flex-row-reverse" : "flex-row"
       )
     },
-    size > 600 ? /* @__PURE__ */ React76.createElement(
+    size > 600 ? /* @__PURE__ */ React77.createElement(
       "div",
       {
         className: clsx30(
@@ -8139,19 +8250,19 @@ var HawaAppLayoutSimplified = ({
       props.pageTitle
     ) : (
       // Mobile Drawer Menu Button
-      /* @__PURE__ */ React76.createElement(
+      /* @__PURE__ */ React77.createElement(
         "div",
         {
           dir: direction,
           className: "flex items-center justify-center gap-0.5"
         },
-        /* @__PURE__ */ React76.createElement(
+        /* @__PURE__ */ React77.createElement(
           "div",
           {
             onClick: () => setOpenSideMenu(true),
             className: "z-40 mx-1 cursor-pointer  rounded p-2  transition-all hover:bg-gray-100"
           },
-          /* @__PURE__ */ React76.createElement(
+          /* @__PURE__ */ React77.createElement(
             "svg",
             {
               stroke: "currentColor",
@@ -8162,7 +8273,7 @@ var HawaAppLayoutSimplified = ({
               height: "1.6em",
               width: "1.6em"
             },
-            /* @__PURE__ */ React76.createElement(
+            /* @__PURE__ */ React77.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -8172,10 +8283,10 @@ var HawaAppLayoutSimplified = ({
             )
           )
         ),
-        props.pageTitle ? /* @__PURE__ */ React76.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React76.createElement("div", null)
+        props.pageTitle ? /* @__PURE__ */ React77.createElement("div", { className: "text-sm" }, props.pageTitle) : /* @__PURE__ */ React77.createElement("div", null)
       )
     ),
-    /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement(
       "div",
       {
         className: clsx30(
@@ -8183,16 +8294,16 @@ var HawaAppLayoutSimplified = ({
           isRTL ? "flex-row-reverse" : "flex-row"
         )
       },
-      size > 600 ? /* @__PURE__ */ React76.createElement(
+      size > 600 ? /* @__PURE__ */ React77.createElement(
         "div",
         {
           className: isRTL ? "text-left text-xs" : "text-right text-xs"
         },
-        /* @__PURE__ */ React76.createElement("div", { className: "font-bold" }, props.username),
+        /* @__PURE__ */ React77.createElement("div", { className: "font-bold" }, props.username),
         " ",
-        /* @__PURE__ */ React76.createElement("div", null, props.email)
+        /* @__PURE__ */ React77.createElement("div", null, props.email)
       ) : null,
-      /* @__PURE__ */ React76.createElement(
+      /* @__PURE__ */ React77.createElement(
         DropdownMenu,
         {
           triggerClassname: "mx-2",
@@ -8201,13 +8312,13 @@ var HawaAppLayoutSimplified = ({
           side: "bottom",
           sideOffset: 5,
           direction: isRTL ? "rtl" : "ltr",
-          trigger: /* @__PURE__ */ React76.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-clip rounded ring-1 ring-primary/30 dark:bg-gray-600" }, /* @__PURE__ */ React76.createElement(AvatarIcon, null)),
+          trigger: /* @__PURE__ */ React77.createElement("div", { className: "relative h-8 w-8  cursor-pointer overflow-clip rounded ring-1 ring-primary/30 dark:bg-gray-600" }, /* @__PURE__ */ React77.createElement(AvatarIcon, null)),
           items: props.profileMenuItems,
           onItemSelect: (e) => console.log("selecting item ", e)
         }
       )
     )
-  ), /* @__PURE__ */ React76.createElement(
+  ), /* @__PURE__ */ React77.createElement(
     "div",
     {
       className: clsx30(
@@ -8223,7 +8334,7 @@ var HawaAppLayoutSimplified = ({
       onMouseLeave: () => keepOpen ? setOpenSideMenu(true) : setOpenSideMenu(false),
       ref
     },
-    /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement(
       "div",
       {
         dir: direction,
@@ -8234,7 +8345,7 @@ var HawaAppLayoutSimplified = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      /* @__PURE__ */ React76.createElement(
+      /* @__PURE__ */ React77.createElement(
         "img",
         {
           className: clsx30(
@@ -8246,7 +8357,7 @@ var HawaAppLayoutSimplified = ({
           src: props.logoLink
         }
       ),
-      size > 600 ? /* @__PURE__ */ React76.createElement(
+      size > 600 ? /* @__PURE__ */ React77.createElement(
         "img",
         {
           className: clsx30(
@@ -8258,7 +8369,7 @@ var HawaAppLayoutSimplified = ({
         }
       ) : null
     ),
-    /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement(
       "div",
       {
         className: clsx30(
@@ -8272,7 +8383,7 @@ var HawaAppLayoutSimplified = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      props.drawerItems?.map((dSection, dIndex) => /* @__PURE__ */ React76.createElement(
+      props.drawerItems?.map((dSection, dIndex) => /* @__PURE__ */ React77.createElement(
         "div",
         {
           key: dIndex,
@@ -8281,7 +8392,7 @@ var HawaAppLayoutSimplified = ({
           )
         },
         dSection?.map((dItem, i) => {
-          return /* @__PURE__ */ React76.createElement("div", { key: i, id: "test", className: "flex flex-col" }, /* @__PURE__ */ React76.createElement(
+          return /* @__PURE__ */ React77.createElement("div", { key: i, id: "test", className: "flex flex-col" }, /* @__PURE__ */ React77.createElement(
             "div",
             {
               onClick: () => {
@@ -8302,7 +8413,7 @@ var HawaAppLayoutSimplified = ({
                 openSideMenu ? "m-2" : "m-2"
               )
             },
-            /* @__PURE__ */ React76.createElement("div", { className: "flex flex-row", dir: direction }, /* @__PURE__ */ React76.createElement("div", { className: "flex items-center justify-center " }, dItem.icon), /* @__PURE__ */ React76.createElement(
+            /* @__PURE__ */ React77.createElement("div", { className: "flex flex-row", dir: direction }, /* @__PURE__ */ React77.createElement("div", { className: "flex items-center justify-center " }, dItem.icon), /* @__PURE__ */ React77.createElement(
               "div",
               {
                 className: clsx30(
@@ -8312,13 +8423,13 @@ var HawaAppLayoutSimplified = ({
               },
               dItem.label
             )),
-            dItem.subItems && /* @__PURE__ */ React76.createElement(
+            dItem.subItems && /* @__PURE__ */ React77.createElement(
               ArrowIcon,
               {
                 pointing: openSubItem && dItem.slug === openSubItem ? "up" : "down"
               }
             )
-          ), dItem.subItems && /* @__PURE__ */ React76.createElement(
+          ), dItem.subItems && /* @__PURE__ */ React77.createElement(
             "div",
             {
               className: clsx30(
@@ -8330,7 +8441,7 @@ var HawaAppLayoutSimplified = ({
                 height: openSubItem == dItem.slug && openSideMenu ? 6 + 35 * dItem.subItems?.length : 0
               }
             },
-            dItem.subItems?.map((subIt, s) => /* @__PURE__ */ React76.createElement(
+            dItem.subItems?.map((subIt, s) => /* @__PURE__ */ React77.createElement(
               "div",
               {
                 key: s,
@@ -8344,15 +8455,15 @@ var HawaAppLayoutSimplified = ({
                   subIt.action();
                 }
               },
-              /* @__PURE__ */ React76.createElement("div", { className: "flex items-center justify-center" }, subIt.icon),
-              /* @__PURE__ */ React76.createElement("div", { className: "flex flex-row justify-between" }, subIt.label)
+              /* @__PURE__ */ React77.createElement("div", { className: "flex items-center justify-center" }, subIt.icon),
+              /* @__PURE__ */ React77.createElement("div", { className: "flex flex-row justify-between" }, subIt.label)
             ))
           ));
         }),
-        dIndex !== props.drawerItems.length - 1 && /* @__PURE__ */ React76.createElement("div", { className: "my-2 h-[1px] w-10/12 self-center bg-buttonPrimary-500 bg-red-500 text-center " })
+        dIndex !== props.drawerItems.length - 1 && /* @__PURE__ */ React77.createElement("div", { className: "my-2 h-[1px] w-10/12 self-center bg-buttonPrimary-500 bg-red-500 text-center " })
       ))
     ),
-    /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement(
       "div",
       {
         className: clsx30(
@@ -8363,22 +8474,22 @@ var HawaAppLayoutSimplified = ({
           width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
         }
       },
-      DrawerFooterActions && openSideMenu ? /* @__PURE__ */ React76.createElement(React76.Fragment, null, DrawerFooterActions) : null,
-      size > 600 && openSideMenu ? /* @__PURE__ */ React76.createElement(
+      DrawerFooterActions && openSideMenu ? /* @__PURE__ */ React77.createElement(React77.Fragment, null, DrawerFooterActions) : null,
+      size > 600 && openSideMenu ? /* @__PURE__ */ React77.createElement(
         Tooltip,
         {
           side: "left",
           delayDuration: 500,
           content: keepOpen ? props.texts?.collapseSidebar || "Collapse Sidebar" : props.texts?.expandSidebar || "Expand Sidebar"
         },
-        /* @__PURE__ */ React76.createElement(
+        /* @__PURE__ */ React77.createElement(
           Button,
           {
             variant: "light",
             onClick: () => setKeepOpen(!keepOpen),
             size: "smallIcon"
           },
-          /* @__PURE__ */ React76.createElement(
+          /* @__PURE__ */ React77.createElement(
             "svg",
             {
               className: clsx30(
@@ -8388,7 +8499,7 @@ var HawaAppLayoutSimplified = ({
               fill: "currentColor",
               viewBox: "0 0 20 20"
             },
-            /* @__PURE__ */ React76.createElement(
+            /* @__PURE__ */ React77.createElement(
               "path",
               {
                 fillRule: "evenodd",
@@ -8400,7 +8511,7 @@ var HawaAppLayoutSimplified = ({
         )
       ) : null
     )
-  ), /* @__PURE__ */ React76.createElement(
+  ), /* @__PURE__ */ React77.createElement(
     "div",
     {
       className: "fixed overflow-y-auto",
@@ -8419,14 +8530,14 @@ var HawaAppLayoutSimplified = ({
     props.children
   ));
 };
-var AvatarIcon = () => /* @__PURE__ */ React76.createElement(
+var AvatarIcon = () => /* @__PURE__ */ React77.createElement(
   "svg",
   {
     className: "absolute -left-1 h-10 w-10 text-gray-400",
     fill: "currentColor",
     viewBox: "0 0 20 20"
   },
-  /* @__PURE__ */ React76.createElement(
+  /* @__PURE__ */ React77.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -8453,7 +8564,7 @@ var ArrowIcon = ({ pointing }) => {
     default:
       break;
   }
-  return /* @__PURE__ */ React76.createElement(
+  return /* @__PURE__ */ React77.createElement(
     "svg",
     {
       className: clsx30(
@@ -8463,7 +8574,7 @@ var ArrowIcon = ({ pointing }) => {
       fill: "currentColor",
       viewBox: "0 0 20 20"
     },
-    /* @__PURE__ */ React76.createElement(
+    /* @__PURE__ */ React77.createElement(
       "path",
       {
         fillRule: "evenodd",
@@ -8475,7 +8586,7 @@ var ArrowIcon = ({ pointing }) => {
 };
 
 // src/layout/HawaContainer.tsx
-import React77 from "react";
+import React78 from "react";
 import clsx31 from "clsx";
 var HawaContainer = ({
   maxWidth = "normal",
@@ -8495,7 +8606,7 @@ var HawaContainer = ({
     outlined: "bg-transparent border border-black w-fit",
     neobrutalism: "shadow-neobrutalism  border-4 border-black  bg-white"
   };
-  return /* @__PURE__ */ React77.createElement(
+  return /* @__PURE__ */ React78.createElement(
     "div",
     {
       className: clsx31(
@@ -8511,28 +8622,28 @@ var HawaContainer = ({
 };
 
 // src/layout/HawaGrid.tsx
-import React78 from "react";
+import React79 from "react";
 var HawaGrid = (props) => {
   return (
     // [&>*:not(:first-child)]:mt-8
-    /* @__PURE__ */ React78.createElement("div", { className: " columns-1 gap-5 sm:columns-2 sm:gap-8 md:columns-3 lg:columns-4 [&>*:not(:first-child)]:mt-8" }, props.children)
+    /* @__PURE__ */ React79.createElement("div", { className: " columns-1 gap-5 sm:columns-2 sm:gap-8 md:columns-3 lg:columns-4 [&>*:not(:first-child)]:mt-8" }, props.children)
   );
 };
 
 // src/layout/AppSidebar.tsx
-import React79 from "react";
+import React80 from "react";
 var AppSidebar = ({ isOpen, onClose, items }) => {
   if (!isOpen) {
     return null;
   }
-  return /* @__PURE__ */ React79.createElement("div", { className: "fixed inset-0 z-40 flex bg-gray-600 bg-opacity-75" }, /* @__PURE__ */ React79.createElement("div", { className: "w-1/3 rounded-l-lg bg-gray-800 shadow-2xl" }, /* @__PURE__ */ React79.createElement(
+  return /* @__PURE__ */ React80.createElement("div", { className: "fixed inset-0 z-40 flex bg-gray-600 bg-opacity-75" }, /* @__PURE__ */ React80.createElement("div", { className: "w-1/3 rounded-l-lg bg-gray-800 shadow-2xl" }, /* @__PURE__ */ React80.createElement(
     "button",
     {
       onClick: onClose,
       className: "p-4 text-gray-400 hover:text-white focus:text-white focus:outline-none"
     },
     "Close"
-  ), /* @__PURE__ */ React79.createElement("nav", null, items.map((item, i) => /* @__PURE__ */ React79.createElement(
+  ), /* @__PURE__ */ React80.createElement("nav", null, items.map((item, i) => /* @__PURE__ */ React80.createElement(
     "a",
     {
       key: i,
@@ -8541,7 +8652,7 @@ var AppSidebar = ({ isOpen, onClose, items }) => {
       className: "block p-4 font-bold text-white hover:bg-gray-700 hover:text-gray-400"
     },
     item.label
-  )))), /* @__PURE__ */ React79.createElement("div", { className: "w-2/3 bg-gray-50" }));
+  )))), /* @__PURE__ */ React80.createElement("div", { className: "w-2/3 bg-gray-50" }));
 };
 
 // src/layout/Footer.tsx
@@ -8559,7 +8670,7 @@ var Footer = ({ ...props }) => {
 };
 
 // src/layout/Banner.tsx
-import React80, { useRef as useRef17, useState as useState40 } from "react";
+import React81, { useRef as useRef17, useState as useState40 } from "react";
 import clsx32 from "clsx";
 var HawaBanner = ({
   design = "floating",
@@ -8571,7 +8682,7 @@ var HawaBanner = ({
     floating: "left-1/2  z-50  w-[calc(100%-2rem)] -translate-x-1/2 lg:max-w-7xl p-4 rounded",
     default: "w-[calc(100%)] left-0 z-50 right-0 rounded-none p-2"
   };
-  return /* @__PURE__ */ React80.createElement("div", { ref: bannerRef }, /* @__PURE__ */ React80.createElement(
+  return /* @__PURE__ */ React81.createElement("div", { ref: bannerRef }, /* @__PURE__ */ React81.createElement(
     "div",
     {
       dir: props.direction,
@@ -8582,7 +8693,7 @@ var HawaBanner = ({
         closed ? "opacity-0" : "opacity-100"
       )
     },
-    /* @__PURE__ */ React80.createElement("div", { className: "mb-3 flex w-full flex-col items-center  justify-start   md:mb-0 md:flex-row md:items-center" }, /* @__PURE__ */ React80.createElement(
+    /* @__PURE__ */ React81.createElement("div", { className: "mb-3 flex w-full flex-col items-center  justify-start   md:mb-0 md:flex-row md:items-center" }, /* @__PURE__ */ React81.createElement(
       "div",
       {
         className: clsx32(
@@ -8590,7 +8701,7 @@ var HawaBanner = ({
           "mb-2 flex items-center  border-gray-200 dark:border-gray-600 md:mb-0 md:mr-4  md:pr-4"
         )
       },
-      props.logoURL && /* @__PURE__ */ React80.createElement(
+      props.logoURL && /* @__PURE__ */ React81.createElement(
         "img",
         {
           src: props.logoURL,
@@ -8598,8 +8709,8 @@ var HawaBanner = ({
           alt: "Flowbite Logo"
         }
       ),
-      props.title && /* @__PURE__ */ React80.createElement("span", { className: "self-center whitespace-nowrap text-lg font-semibold dark:text-white" }, props.title)
-    ), props.text && /* @__PURE__ */ React80.createElement(
+      props.title && /* @__PURE__ */ React81.createElement("span", { className: "self-center whitespace-nowrap text-lg font-semibold dark:text-white" }, props.title)
+    ), props.text && /* @__PURE__ */ React81.createElement(
       "p",
       {
         className: clsx32(
@@ -8609,7 +8720,7 @@ var HawaBanner = ({
       },
       props.text
     )),
-    props.actionText && /* @__PURE__ */ React80.createElement(
+    props.actionText && /* @__PURE__ */ React81.createElement(
       "div",
       {
         className: clsx32(
@@ -8617,9 +8728,9 @@ var HawaBanner = ({
           props.direction === "rtl" ? "ml-0 md:ml-10" : "mr-0 md:mr-10"
         )
       },
-      /* @__PURE__ */ React80.createElement(HawaButton, { onClick: props.onActionClick }, props.actionText)
+      /* @__PURE__ */ React81.createElement(HawaButton, { onClick: props.onActionClick }, props.actionText)
     ),
-    /* @__PURE__ */ React80.createElement(
+    /* @__PURE__ */ React81.createElement(
       "button",
       {
         type: "button",
@@ -8636,8 +8747,8 @@ var HawaBanner = ({
           }, 200);
         }
       },
-      /* @__PURE__ */ React80.createElement("span", { className: "sr-only" }, "Close"),
-      /* @__PURE__ */ React80.createElement(
+      /* @__PURE__ */ React81.createElement("span", { className: "sr-only" }, "Close"),
+      /* @__PURE__ */ React81.createElement(
         "svg",
         {
           "aria-hidden": "true",
@@ -8645,7 +8756,7 @@ var HawaBanner = ({
           fill: "currentColor",
           viewBox: "0 0 20 20"
         },
-        /* @__PURE__ */ React80.createElement(
+        /* @__PURE__ */ React81.createElement(
           "path",
           {
             fillRule: "evenodd",
@@ -8659,7 +8770,7 @@ var HawaBanner = ({
 };
 
 // src/blocks/Account/UserProfileForm.tsx
-import React81 from "react";
+import React82 from "react";
 import { Controller, FormProvider, useForm } from "react-hook-form";
 var UserProfileForm = (props) => {
   const methods = useForm();
@@ -8669,12 +8780,12 @@ var UserProfileForm = (props) => {
     handleSubmit,
     control
   } = methods;
-  return /* @__PURE__ */ React81.createElement(Card, null, /* @__PURE__ */ React81.createElement("form", { onSubmit: handleSubmit((e) => props.handleUpdateProfile(e)) }, /* @__PURE__ */ React81.createElement(CardContent, { headless: true }, /* @__PURE__ */ React81.createElement(FormProvider, { ...methods }, /* @__PURE__ */ React81.createElement(
+  return /* @__PURE__ */ React82.createElement(Card, null, /* @__PURE__ */ React82.createElement("form", { onSubmit: handleSubmit((e) => props.handleUpdateProfile(e)) }, /* @__PURE__ */ React82.createElement(CardContent, { headless: true }, /* @__PURE__ */ React82.createElement(FormProvider, { ...methods }, /* @__PURE__ */ React82.createElement(
     Controller,
     {
       control,
       name: "fullName",
-      render: ({ field }) => /* @__PURE__ */ React81.createElement(
+      render: ({ field }) => /* @__PURE__ */ React82.createElement(
         HawaTextField,
         {
           width: "full",
@@ -8687,19 +8798,19 @@ var UserProfileForm = (props) => {
         }
       )
     }
-  ), /* @__PURE__ */ React81.createElement(
+  ), /* @__PURE__ */ React82.createElement(
     Controller,
     {
       control,
       name: "phoneNumber",
-      render: ({ field }) => /* @__PURE__ */ React81.createElement(HawaPhoneInput, { label: "Phone number" })
+      render: ({ field }) => /* @__PURE__ */ React82.createElement(HawaPhoneInput, { label: "Phone number" })
     }
-  ), /* @__PURE__ */ React81.createElement(
+  ), /* @__PURE__ */ React82.createElement(
     Controller,
     {
       control,
       name: "email",
-      render: ({ field }) => /* @__PURE__ */ React81.createElement(
+      render: ({ field }) => /* @__PURE__ */ React82.createElement(
         HawaTextField,
         {
           width: "full",
@@ -8719,12 +8830,12 @@ var UserProfileForm = (props) => {
         }
       }
     }
-  ), /* @__PURE__ */ React81.createElement(
+  ), /* @__PURE__ */ React82.createElement(
     Controller,
     {
       control,
       name: "password",
-      render: ({ field }) => /* @__PURE__ */ React81.createElement(
+      render: ({ field }) => /* @__PURE__ */ React82.createElement(
         HawaTextField,
         {
           width: "full",
@@ -8740,12 +8851,12 @@ var UserProfileForm = (props) => {
         required: props.texts.passwordRequiredText
       }
     }
-  ), /* @__PURE__ */ React81.createElement(
+  ), /* @__PURE__ */ React82.createElement(
     Controller,
     {
       control,
       name: "confirmPassword",
-      render: ({ field }) => /* @__PURE__ */ React81.createElement(
+      render: ({ field }) => /* @__PURE__ */ React82.createElement(
         HawaTextField,
         {
           width: "full",
@@ -8761,19 +8872,19 @@ var UserProfileForm = (props) => {
         required: props.texts.confirmPasswordRequiredText
       }
     }
-  ))), /* @__PURE__ */ React81.createElement(CardFooter, null, /* @__PURE__ */ React81.createElement(Button, { className: "w-full", type: "submit" }, props.texts.updateProfile))));
+  ))), /* @__PURE__ */ React82.createElement(CardFooter, null, /* @__PURE__ */ React82.createElement(Button, { className: "w-full", type: "submit" }, props.texts.updateProfile))));
 };
 
 // src/blocks/Account/UserSettingsForm.tsx
-import React82 from "react";
+import React83 from "react";
 var UserSettingsForm = (props) => {
-  return /* @__PURE__ */ React82.createElement(Card, null, /* @__PURE__ */ React82.createElement(CardContent, { headless: true }, /* @__PURE__ */ React82.createElement("div", { className: "mb-2 text-sm font-bold" }, props.blockTitle), /* @__PURE__ */ React82.createElement("div", { className: "flex flex-col gap-4 rounded  p-2" }, props.children)));
+  return /* @__PURE__ */ React83.createElement(Card, null, /* @__PURE__ */ React83.createElement(CardContent, { headless: true }, /* @__PURE__ */ React83.createElement("div", { className: "mb-2 text-sm font-bold" }, props.blockTitle), /* @__PURE__ */ React83.createElement("div", { className: "flex flex-col gap-4 rounded  p-2" }, props.children)));
 };
 
 // src/blocks/AuthForms/AppLanding.tsx
-import React83 from "react";
+import React84 from "react";
 var AppLanding = (props) => {
-  return /* @__PURE__ */ React83.createElement("div", null, /* @__PURE__ */ React83.createElement(Card, null, /* @__PURE__ */ React83.createElement(CardContent, { headless: true, className: "flex flex-col gap-6" }, props.handleSignIn && /* @__PURE__ */ React83.createElement(Button, { onClick: props.handleSignIn }, props.texts.signIn), props.handleSignUp && /* @__PURE__ */ React83.createElement(Button, { onClick: props.handleSignUp }, props.texts.signUp))), /* @__PURE__ */ React83.createElement("div", { className: "mt-6 flex flex-row justify-between" }, /* @__PURE__ */ React83.createElement(
+  return /* @__PURE__ */ React84.createElement("div", null, /* @__PURE__ */ React84.createElement(Card, null, /* @__PURE__ */ React84.createElement(CardContent, { headless: true, className: "flex flex-col gap-6" }, props.handleSignIn && /* @__PURE__ */ React84.createElement(Button, { onClick: props.handleSignIn }, props.texts.signIn), props.handleSignUp && /* @__PURE__ */ React84.createElement(Button, { onClick: props.handleSignUp }, props.texts.signUp))), /* @__PURE__ */ React84.createElement("div", { className: "mt-6 flex flex-row justify-between" }, /* @__PURE__ */ React84.createElement(
     HawaRadio,
     {
       onChangeTab: props.handleLanguage,
@@ -8783,7 +8894,7 @@ var AppLanding = (props) => {
         { value: "en", label: "English" }
       ]
     }
-  ), /* @__PURE__ */ React83.createElement(
+  ), /* @__PURE__ */ React84.createElement(
     HawaRadio,
     {
       onChangeTab: props.handleColorMode,
@@ -8791,7 +8902,7 @@ var AppLanding = (props) => {
       options: [
         {
           value: "light",
-          label: /* @__PURE__ */ React83.createElement(
+          label: /* @__PURE__ */ React84.createElement(
             "svg",
             {
               width: "15",
@@ -8801,7 +8912,7 @@ var AppLanding = (props) => {
               xmlns: "http://www.w3.org/2000/svg",
               className: "h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90"
             },
-            /* @__PURE__ */ React83.createElement(
+            /* @__PURE__ */ React84.createElement(
               "path",
               {
                 d: "M7.5 0C7.77614 0 8 0.223858 8 0.5V2.5C8 2.77614 7.77614 3 7.5 3C7.22386 3 7 2.77614 7 2.5V0.5C7 0.223858 7.22386 0 7.5 0ZM2.1967 2.1967C2.39196 2.00144 2.70854 2.00144 2.90381 2.1967L4.31802 3.61091C4.51328 3.80617 4.51328 4.12276 4.31802 4.31802C4.12276 4.51328 3.80617 4.51328 3.61091 4.31802L2.1967 2.90381C2.00144 2.70854 2.00144 2.39196 2.1967 2.1967ZM0.5 7C0.223858 7 0 7.22386 0 7.5C0 7.77614 0.223858 8 0.5 8H2.5C2.77614 8 3 7.77614 3 7.5C3 7.22386 2.77614 7 2.5 7H0.5ZM2.1967 12.8033C2.00144 12.608 2.00144 12.2915 2.1967 12.0962L3.61091 10.682C3.80617 10.4867 4.12276 10.4867 4.31802 10.682C4.51328 10.8772 4.51328 11.1938 4.31802 11.3891L2.90381 12.8033C2.70854 12.9986 2.39196 12.9986 2.1967 12.8033ZM12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8H14.5C14.7761 8 15 7.77614 15 7.5C15 7.22386 14.7761 7 14.5 7H12.5ZM10.682 4.31802C10.4867 4.12276 10.4867 3.80617 10.682 3.61091L12.0962 2.1967C12.2915 2.00144 12.608 2.00144 12.8033 2.1967C12.9986 2.39196 12.9986 2.70854 12.8033 2.90381L11.3891 4.31802C11.1938 4.51328 10.8772 4.51328 10.682 4.31802ZM8 12.5C8 12.2239 7.77614 12 7.5 12C7.22386 12 7 12.2239 7 12.5V14.5C7 14.7761 7.22386 15 7.5 15C7.77614 15 8 14.7761 8 14.5V12.5ZM10.682 10.682C10.8772 10.4867 11.1938 10.4867 11.3891 10.682L12.8033 12.0962C12.9986 12.2915 12.9986 12.608 12.8033 12.8033C12.608 12.9986 12.2915 12.9986 12.0962 12.8033L10.682 11.3891C10.4867 11.1938 10.4867 10.8772 10.682 10.682ZM5.5 7.5C5.5 6.39543 6.39543 5.5 7.5 5.5C8.60457 5.5 9.5 6.39543 9.5 7.5C9.5 8.60457 8.60457 9.5 7.5 9.5C6.39543 9.5 5.5 8.60457 5.5 7.5ZM7.5 4.5C5.84315 4.5 4.5 5.84315 4.5 7.5C4.5 9.15685 5.84315 10.5 7.5 10.5C9.15685 10.5 10.5 9.15685 10.5 7.5C10.5 5.84315 9.15685 4.5 7.5 4.5Z",
@@ -8814,7 +8925,7 @@ var AppLanding = (props) => {
         },
         {
           value: "dark",
-          label: /* @__PURE__ */ React83.createElement(
+          label: /* @__PURE__ */ React84.createElement(
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
@@ -8828,7 +8939,7 @@ var AppLanding = (props) => {
               strokeLinejoin: "round",
               className: "h-[1.2rem] w-[1.2rem]  transition-all dark:rotate-0 dark:scale-100"
             },
-            /* @__PURE__ */ React83.createElement("path", { d: "M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z" })
+            /* @__PURE__ */ React84.createElement("path", { d: "M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z" })
           )
         }
       ]
@@ -8837,7 +8948,7 @@ var AppLanding = (props) => {
 };
 
 // src/blocks/AuthForms/SignInPhone.tsx
-import React84, { useState as useState41 } from "react";
+import React85, { useState as useState41 } from "react";
 import { Controller as Controller2, useForm as useForm2 } from "react-hook-form";
 var SignInPhone = (props) => {
   const methods = useForm2();
@@ -8847,7 +8958,7 @@ var SignInPhone = (props) => {
     control
   } = methods;
   const [userPhone, setUserPhone] = useState41("");
-  return /* @__PURE__ */ React84.createElement(Card, null, /* @__PURE__ */ React84.createElement(CardContent, { headless: true }, /* @__PURE__ */ React84.createElement(
+  return /* @__PURE__ */ React85.createElement(Card, null, /* @__PURE__ */ React85.createElement(CardContent, { headless: true }, /* @__PURE__ */ React85.createElement(
     "form",
     {
       onSubmit: (e) => {
@@ -8855,12 +8966,12 @@ var SignInPhone = (props) => {
         props.handleSignIn(userPhone);
       }
     },
-    /* @__PURE__ */ React84.createElement(
+    /* @__PURE__ */ React85.createElement(
       Controller2,
       {
         control,
         name: "phone",
-        render: ({ field }) => /* @__PURE__ */ React84.createElement(
+        render: ({ field }) => /* @__PURE__ */ React85.createElement(
           HawaPhoneInput,
           {
             country: props.country ?? "",
@@ -8874,13 +8985,13 @@ var SignInPhone = (props) => {
         }
       }
     ),
-    /* @__PURE__ */ React84.createElement("div", { className: "mt-2" }),
-    /* @__PURE__ */ React84.createElement(Button, { className: "w-full" }, props.SignInButtonText)
+    /* @__PURE__ */ React85.createElement("div", { className: "mt-2" }),
+    /* @__PURE__ */ React85.createElement(Button, { className: "w-full" }, props.SignInButtonText)
   )));
 };
 
 // src/blocks/AuthForms/SignInForm.tsx
-import React85 from "react";
+import React86 from "react";
 import { Controller as Controller3, useForm as useForm3 } from "react-hook-form";
 import clsx33 from "clsx";
 
@@ -9022,19 +9133,19 @@ var SignInForm = (props) => {
     handleSubmit,
     control
   } = useForm3();
-  return /* @__PURE__ */ React85.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React85.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React85.createElement(CardContent, { headless: true }, /* @__PURE__ */ React85.createElement("form", { onSubmit: handleSubmit((e) => props.handleSignIn(e)) }, props.showError && /* @__PURE__ */ React85.createElement(
+  return /* @__PURE__ */ React86.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React86.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React86.createElement(CardContent, { headless: true }, /* @__PURE__ */ React86.createElement("form", { onSubmit: handleSubmit((e) => props.handleSignIn(e)) }, props.showError && /* @__PURE__ */ React86.createElement(
     HawaAlert,
     {
       title: props.errorTitle,
       text: props.errorText,
       severity: "error"
     }
-  ), props.signInType === "email" ? /* @__PURE__ */ React85.createElement(
+  ), props.signInType === "email" ? /* @__PURE__ */ React86.createElement(
     Controller3,
     {
       control,
       name: "email",
-      render: ({ field }) => /* @__PURE__ */ React85.createElement(
+      render: ({ field }) => /* @__PURE__ */ React86.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9055,13 +9166,13 @@ var SignInForm = (props) => {
         }
       }
     }
-  ) : props.signInType === "username" ? /* @__PURE__ */ React85.createElement(
+  ) : props.signInType === "username" ? /* @__PURE__ */ React86.createElement(
     Controller3,
     {
       control,
       name: "username",
       render: ({ field }) => {
-        return /* @__PURE__ */ React85.createElement(
+        return /* @__PURE__ */ React86.createElement(
           HawaTextField,
           {
             width: "full",
@@ -9079,20 +9190,20 @@ var SignInForm = (props) => {
         required: props.texts.usernameRequired
       }
     }
-  ) : /* @__PURE__ */ React85.createElement(
+  ) : /* @__PURE__ */ React86.createElement(
     Controller3,
     {
       control,
       name: "phone",
-      render: ({ field }) => /* @__PURE__ */ React85.createElement(HawaPhoneInput, { label: "Phone number" }),
+      render: ({ field }) => /* @__PURE__ */ React86.createElement(HawaPhoneInput, { label: "Phone number" }),
       rules: { required: props.texts.phoneRequiredText }
     }
-  ), props.signInType !== "phone" && /* @__PURE__ */ React85.createElement(React85.Fragment, null, /* @__PURE__ */ React85.createElement(
+  ), props.signInType !== "phone" && /* @__PURE__ */ React86.createElement(React86.Fragment, null, /* @__PURE__ */ React86.createElement(
     Controller3,
     {
       control,
       name: "password",
-      render: ({ field }) => /* @__PURE__ */ React85.createElement(
+      render: ({ field }) => /* @__PURE__ */ React86.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9110,21 +9221,21 @@ var SignInForm = (props) => {
         minLength: 5
       }
     }
-  ), !props.withoutResetPassword && /* @__PURE__ */ React85.createElement(
+  ), !props.withoutResetPassword && /* @__PURE__ */ React86.createElement(
     "div",
     {
       onClick: props.handleForgotPassword,
       className: "mb-3 w-fit cursor-pointer text-xs dark:text-gray-300"
     },
     props.texts.forgotPasswordText
-  )), /* @__PURE__ */ React85.createElement(Button, { className: "w-full mt-4", isLoading: props.isLoading }, props.texts.signInText), !props.withoutSignUp && /* @__PURE__ */ React85.createElement("div", { className: "p-3 text-center text-sm font-semibold dark:text-gray-300" }, props.texts.newUserText, " ", /* @__PURE__ */ React85.createElement(
+  )), /* @__PURE__ */ React86.createElement(Button, { className: "w-full mt-4", isLoading: props.isLoading }, props.texts.signInText), !props.withoutSignUp && /* @__PURE__ */ React86.createElement("div", { className: "p-3 text-center text-sm font-semibold dark:text-gray-300" }, props.texts.newUserText, " ", /* @__PURE__ */ React86.createElement(
     "span",
     {
       onClick: props.handleRouteToSignUp,
       className: "clickable-link"
     },
     props.texts.createAccount
-  )))), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React85.createElement(CardFooter, { className: "grid grid-cols-1 gap-2 " }, props.viaGoogle && /* @__PURE__ */ React85.createElement(Button, { variant: "outline", onClick: props.handleGoogleSignIn }, /* @__PURE__ */ React85.createElement(
+  )))), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React86.createElement(CardFooter, { className: "grid grid-cols-1 gap-2 " }, props.viaGoogle && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleGoogleSignIn }, /* @__PURE__ */ React86.createElement(
     Icons.google,
     {
       className: clsx33(
@@ -9132,7 +9243,7 @@ var SignInForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signInViaGoogleLabel), props.viaGithub && /* @__PURE__ */ React85.createElement(Button, { variant: "outline", onClick: props.handleGithubSignIn }, /* @__PURE__ */ React85.createElement(
+  ), props.texts.signInViaGoogleLabel), props.viaGithub && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleGithubSignIn }, /* @__PURE__ */ React86.createElement(
     Icons.gitHub,
     {
       className: clsx33(
@@ -9140,7 +9251,7 @@ var SignInForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signInViaGithubLabel), props.viaTwitter && /* @__PURE__ */ React85.createElement(Button, { variant: "outline", onClick: props.handleTwitterSignIn }, /* @__PURE__ */ React85.createElement(
+  ), props.texts.signInViaGithubLabel), props.viaTwitter && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleTwitterSignIn }, /* @__PURE__ */ React86.createElement(
     Icons.twitter,
     {
       className: clsx33(
@@ -9148,7 +9259,7 @@ var SignInForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signInViaTwitterLabel)) : null), /* @__PURE__ */ React85.createElement(
+  ), props.texts.signInViaTwitterLabel)) : null), /* @__PURE__ */ React86.createElement(
     InterfaceSettings,
     {
       currentColorMode: props.currentColorMode,
@@ -9165,7 +9276,7 @@ function SignInBlock() {
 }
 
 // src/blocks/AuthForms/SignUpForm.tsx
-import React86 from "react";
+import React87 from "react";
 import { Controller as Controller4, FormProvider as FormProvider2, useForm as useForm4 } from "react-hook-form";
 import clsx34 from "clsx";
 var SignUpForm = (props) => {
@@ -9175,22 +9286,22 @@ var SignUpForm = (props) => {
     handleSubmit,
     control
   } = methods;
-  return /* @__PURE__ */ React86.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React86.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React86.createElement(CardContent, { headless: true }, /* @__PURE__ */ React86.createElement("div", null, props.showError && /* @__PURE__ */ React86.createElement(
+  return /* @__PURE__ */ React87.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React87.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React87.createElement(CardContent, { headless: true }, /* @__PURE__ */ React87.createElement("div", null, props.showError && /* @__PURE__ */ React87.createElement(
     HawaAlert,
     {
       title: props.errorTitle,
       text: props.errorText,
       severity: "error"
     }
-  ), /* @__PURE__ */ React86.createElement(FormProvider2, { ...methods }, /* @__PURE__ */ React86.createElement("form", { onSubmit: handleSubmit((e) => props.handleSignUp(e)) }, /* @__PURE__ */ React86.createElement("div", null, props.signUpFields.map((fld, i) => {
+  ), /* @__PURE__ */ React87.createElement(FormProvider2, { ...methods }, /* @__PURE__ */ React87.createElement("form", { onSubmit: handleSubmit((e) => props.handleSignUp(e)) }, /* @__PURE__ */ React87.createElement("div", null, props.signUpFields.map((fld, i) => {
     if (fld === "fullname") {
-      return /* @__PURE__ */ React86.createElement(
+      return /* @__PURE__ */ React87.createElement(
         Controller4,
         {
           key: i,
           control,
           name: "fullName",
-          render: ({ field }) => /* @__PURE__ */ React86.createElement(
+          render: ({ field }) => /* @__PURE__ */ React87.createElement(
             HawaTextField,
             {
               width: "full",
@@ -9209,13 +9320,13 @@ var SignUpForm = (props) => {
       );
     }
     if (fld === "email") {
-      return /* @__PURE__ */ React86.createElement(
+      return /* @__PURE__ */ React87.createElement(
         Controller4,
         {
           key: i,
           control,
           name: "email",
-          render: ({ field }) => /* @__PURE__ */ React86.createElement(
+          render: ({ field }) => /* @__PURE__ */ React87.createElement(
             HawaTextField,
             {
               width: "full",
@@ -9239,13 +9350,13 @@ var SignUpForm = (props) => {
       );
     }
     if (fld === "username") {
-      return /* @__PURE__ */ React86.createElement(
+      return /* @__PURE__ */ React87.createElement(
         Controller4,
         {
           key: i,
           control,
           name: "username",
-          render: ({ field }) => /* @__PURE__ */ React86.createElement(
+          render: ({ field }) => /* @__PURE__ */ React87.createElement(
             HawaTextField,
             {
               width: "full",
@@ -9264,12 +9375,12 @@ var SignUpForm = (props) => {
         }
       );
     }
-  })), /* @__PURE__ */ React86.createElement(
+  })), /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "password",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9284,12 +9395,12 @@ var SignUpForm = (props) => {
       ),
       rules: { required: props.texts.passwordRequiredText }
     }
-  ), /* @__PURE__ */ React86.createElement(
+  ), /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "confirm_password",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9304,12 +9415,12 @@ var SignUpForm = (props) => {
       ),
       rules: { required: props.texts.passwordRequiredText }
     }
-  ), props.showRefCode && /* @__PURE__ */ React86.createElement(
+  ), props.showRefCode && /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "refCode",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9322,12 +9433,12 @@ var SignUpForm = (props) => {
         }
       )
     }
-  ), props.showUserSource && /* @__PURE__ */ React86.createElement("div", null, /* @__PURE__ */ React86.createElement(
+  ), props.showUserSource && /* @__PURE__ */ React87.createElement("div", null, /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "reference",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaSelect,
         {
           label: "How did you learn about us?",
@@ -9346,18 +9457,18 @@ var SignUpForm = (props) => {
         }
       )
     }
-  )), props.showTermsOption && /* @__PURE__ */ React86.createElement(
+  )), props.showTermsOption && /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "terms_accepted",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaCheckbox,
         {
           id: "terms_accepted",
           helperText: errors.terms_accepted?.message,
           onChange: (e) => field.onChange(e),
-          label: /* @__PURE__ */ React86.createElement("span", null, props.texts.iAcceptText, " ", /* @__PURE__ */ React86.createElement(
+          label: /* @__PURE__ */ React87.createElement("span", null, props.texts.iAcceptText, " ", /* @__PURE__ */ React87.createElement(
             "a",
             {
               onClick: props.handleRouteToTOS,
@@ -9369,12 +9480,12 @@ var SignUpForm = (props) => {
       ),
       rules: { required: props.texts.termsRequiredText }
     }
-  ), props.showNewsletterOption && /* @__PURE__ */ React86.createElement(
+  ), props.showNewsletterOption && /* @__PURE__ */ React87.createElement(
     Controller4,
     {
       control,
       name: "newsletter_accepted",
-      render: ({ field }) => /* @__PURE__ */ React86.createElement(
+      render: ({ field }) => /* @__PURE__ */ React87.createElement(
         HawaCheckbox,
         {
           id: "newsletter_accepted",
@@ -9383,14 +9494,14 @@ var SignUpForm = (props) => {
         }
       )
     }
-  ), /* @__PURE__ */ React86.createElement(Button, { className: "w-full", isLoading: props.isLoading }, props.texts.signUpText))), /* @__PURE__ */ React86.createElement("div", { className: "flex flex-row items-center justify-center gap-1 p-3 text-center  text-sm font-semibold dark:text-white" }, /* @__PURE__ */ React86.createElement("span", null, props.texts.existingUserText), /* @__PURE__ */ React86.createElement(
+  ), /* @__PURE__ */ React87.createElement(Button, { className: "w-full", isLoading: props.isLoading }, props.texts.signUpText))), /* @__PURE__ */ React87.createElement("div", { className: "flex flex-row items-center justify-center gap-1 p-3 text-center  text-sm font-semibold dark:text-white" }, /* @__PURE__ */ React87.createElement("span", null, props.texts.existingUserText), /* @__PURE__ */ React87.createElement(
     "span",
     {
       onClick: props.handleRouteToSignIn,
       className: "clickable-link"
     },
     props.texts.signInText
-  )))), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React86.createElement(CardFooter, { className: "grid grid-cols-1 gap-2 " }, props.viaGoogle && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleGoogleSignUp }, /* @__PURE__ */ React86.createElement(
+  )))), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React87.createElement(CardFooter, { className: "grid grid-cols-1 gap-2 " }, props.viaGoogle && /* @__PURE__ */ React87.createElement(Button, { variant: "outline", onClick: props.handleGoogleSignUp }, /* @__PURE__ */ React87.createElement(
     Icons.google,
     {
       className: clsx34(
@@ -9398,7 +9509,7 @@ var SignUpForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signUpViaGoogleLabel), props.viaGithub && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleGithubSignUp }, /* @__PURE__ */ React86.createElement(
+  ), props.texts.signUpViaGoogleLabel), props.viaGithub && /* @__PURE__ */ React87.createElement(Button, { variant: "outline", onClick: props.handleGithubSignUp }, /* @__PURE__ */ React87.createElement(
     Icons.gitHub,
     {
       className: clsx34(
@@ -9406,7 +9517,7 @@ var SignUpForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signUpViaGithubLabel), props.viaTwitter && /* @__PURE__ */ React86.createElement(Button, { variant: "outline", onClick: props.handleTwitterSignUp }, /* @__PURE__ */ React86.createElement(
+  ), props.texts.signUpViaGithubLabel), props.viaTwitter && /* @__PURE__ */ React87.createElement(Button, { variant: "outline", onClick: props.handleTwitterSignUp }, /* @__PURE__ */ React87.createElement(
     Icons.twitter,
     {
       className: clsx34(
@@ -9414,7 +9525,7 @@ var SignUpForm = (props) => {
         props.direction === "rtl" ? "ml-2" : "mr-2"
       )
     }
-  ), props.texts.signUpViaTwitterLabel)) : null), /* @__PURE__ */ React86.createElement(
+  ), props.texts.signUpViaTwitterLabel)) : null), /* @__PURE__ */ React87.createElement(
     InterfaceSettings,
     {
       currentColorMode: props.currentColorMode,
@@ -9426,7 +9537,7 @@ var SignUpForm = (props) => {
 };
 
 // src/blocks/AuthForms/NewPasswordForm.tsx
-import React87, { useState as useState42 } from "react";
+import React88, { useState as useState42 } from "react";
 import { Controller as Controller5, FormProvider as FormProvider3, useForm as useForm5 } from "react-hook-form";
 var NewPasswordForm = (props) => {
   const [matchError, setMatchError] = useState42(false);
@@ -9443,12 +9554,12 @@ var NewPasswordForm = (props) => {
       setMatchError(true);
     }
   };
-  return /* @__PURE__ */ React87.createElement(Card, null, matchError && /* @__PURE__ */ React87.createElement(HawaAlert, { text: props.texts.passwordMatchError, severity: "error" }), props.passwordChanged ? /* @__PURE__ */ React87.createElement(CardContent, { headless: true }, /* @__PURE__ */ React87.createElement("div", { className: "text-center" }, props.texts.passwordChanged)) : /* @__PURE__ */ React87.createElement(FormProvider3, { ...methods }, /* @__PURE__ */ React87.createElement("form", { onSubmit: handleSubmit(handleSubmission) }, /* @__PURE__ */ React87.createElement(CardHeader, null, /* @__PURE__ */ React87.createElement(CardTitle, null, "Create Password"), /* @__PURE__ */ React87.createElement(CardDescription, null, "Set a new password for your account")), /* @__PURE__ */ React87.createElement(CardContent, null, /* @__PURE__ */ React87.createElement(
+  return /* @__PURE__ */ React88.createElement(Card, null, matchError && /* @__PURE__ */ React88.createElement(HawaAlert, { text: props.texts.passwordMatchError, severity: "error" }), props.passwordChanged ? /* @__PURE__ */ React88.createElement(CardContent, { headless: true }, /* @__PURE__ */ React88.createElement("div", { className: "text-center" }, props.texts.passwordChanged)) : /* @__PURE__ */ React88.createElement(FormProvider3, { ...methods }, /* @__PURE__ */ React88.createElement("form", { onSubmit: handleSubmit(handleSubmission) }, /* @__PURE__ */ React88.createElement(CardHeader, null, /* @__PURE__ */ React88.createElement(CardTitle, null, "Create Password"), /* @__PURE__ */ React88.createElement(CardDescription, null, "Set a new password for your account")), /* @__PURE__ */ React88.createElement(CardContent, null, /* @__PURE__ */ React88.createElement(
     Controller5,
     {
       control,
       name: "password",
-      render: ({ field }) => /* @__PURE__ */ React87.createElement(
+      render: ({ field }) => /* @__PURE__ */ React88.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9465,12 +9576,12 @@ var NewPasswordForm = (props) => {
         required: props.texts.passwordRequiredText
       }
     }
-  ), /* @__PURE__ */ React87.createElement(
+  ), /* @__PURE__ */ React88.createElement(
     Controller5,
     {
       control,
       name: "confirmPassword",
-      render: ({ field }) => /* @__PURE__ */ React87.createElement(
+      render: ({ field }) => /* @__PURE__ */ React88.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9487,11 +9598,11 @@ var NewPasswordForm = (props) => {
         required: props.texts.confirmPasswordRequiredText
       }
     }
-  )), /* @__PURE__ */ React87.createElement(CardFooter, null, /* @__PURE__ */ React87.createElement(Button, { className: "w-full", type: "submit" }, props.texts.updatePassword)))));
+  )), /* @__PURE__ */ React88.createElement(CardFooter, null, /* @__PURE__ */ React88.createElement(Button, { className: "w-full", type: "submit" }, props.texts.updatePassword)))));
 };
 
 // src/blocks/AuthForms/ResetPasswordForm.tsx
-import React88 from "react";
+import React89 from "react";
 import { Controller as Controller6, useForm as useForm6 } from "react-hook-form";
 var ResetPasswordForm = (props) => {
   const methods = useForm6();
@@ -9501,12 +9612,12 @@ var ResetPasswordForm = (props) => {
     register,
     control
   } = methods;
-  return /* @__PURE__ */ React88.createElement(Card, null, !props.sent ? /* @__PURE__ */ React88.createElement(React88.Fragment, null, /* @__PURE__ */ React88.createElement(CardHeader, null, /* @__PURE__ */ React88.createElement(CardTitle, null, "Reset Password"), /* @__PURE__ */ React88.createElement(CardDescription, null, "Enter your email to reset your account password")), /* @__PURE__ */ React88.createElement("form", { onSubmit: handleSubmit(props.handleResetPassword) }, /* @__PURE__ */ React88.createElement(CardContent, null, /* @__PURE__ */ React88.createElement(
+  return /* @__PURE__ */ React89.createElement(Card, null, !props.sent ? /* @__PURE__ */ React89.createElement(React89.Fragment, null, /* @__PURE__ */ React89.createElement(CardHeader, null, /* @__PURE__ */ React89.createElement(CardTitle, null, "Reset Password"), /* @__PURE__ */ React89.createElement(CardDescription, null, "Enter your email to reset your account password")), /* @__PURE__ */ React89.createElement("form", { onSubmit: handleSubmit(props.handleResetPassword) }, /* @__PURE__ */ React89.createElement(CardContent, null, /* @__PURE__ */ React89.createElement(
     Controller6,
     {
       control,
       name: "email",
-      render: ({ field }) => /* @__PURE__ */ React88.createElement(
+      render: ({ field }) => /* @__PURE__ */ React89.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9526,28 +9637,28 @@ var ResetPasswordForm = (props) => {
         }
       }
     }
-  ), /* @__PURE__ */ React88.createElement("div", { className: " pb-2 text-left text-sm dark:text-gray-300" }, props.texts.dontHaveAccount ?? "Don't have an account? ", /* @__PURE__ */ React88.createElement(
+  ), /* @__PURE__ */ React89.createElement("div", { className: " pb-2 text-left text-sm dark:text-gray-300" }, props.texts.dontHaveAccount ?? "Don't have an account? ", /* @__PURE__ */ React89.createElement(
     "span",
     {
       onClick: props.handleRouteToSignUp,
       className: "clickable-link"
     },
     props.texts.signUpText ?? "Sign Up"
-  ))), /* @__PURE__ */ React88.createElement(CardFooter, null, /* @__PURE__ */ React88.createElement(Button, { type: "submit", className: "w-full" }, props.texts.resetPassword)))) : /* @__PURE__ */ React88.createElement(CardContent, { headless: true }, /* @__PURE__ */ React88.createElement("div", { className: "text-center" }, props.texts.emailSentText)));
+  ))), /* @__PURE__ */ React89.createElement(CardFooter, null, /* @__PURE__ */ React89.createElement(Button, { type: "submit", className: "w-full" }, props.texts.resetPassword)))) : /* @__PURE__ */ React89.createElement(CardContent, { headless: true }, /* @__PURE__ */ React89.createElement("div", { className: "text-center" }, props.texts.emailSentText)));
 };
 
 // src/blocks/AuthForms/CodeConfirmation.tsx
-import React89, { useState as useState43 } from "react";
+import React90, { useState as useState43 } from "react";
 var CodeConfirmation = (props) => {
   const [pins, setPins] = useState43(null);
-  return /* @__PURE__ */ React89.createElement(Card, null, /* @__PURE__ */ React89.createElement(CardContent, { headless: true }, props.showError && /* @__PURE__ */ React89.createElement(
+  return /* @__PURE__ */ React90.createElement(Card, null, /* @__PURE__ */ React90.createElement(CardContent, { headless: true }, props.showError && /* @__PURE__ */ React90.createElement(
     HawaAlert,
     {
       title: props.errorTitle,
       text: props.errorText,
       severity: "error"
     }
-  ), /* @__PURE__ */ React89.createElement("div", { className: "mb-4 dark:text-white" }, /* @__PURE__ */ React89.createElement("div", { className: "text-lg font-bold" }, props.texts.checkYourPhone ?? "Please check your phone"), /* @__PURE__ */ React89.createElement("div", { className: "text-muted-foreground" }, /* @__PURE__ */ React89.createElement("span", null, props.texts.weSentCode ?? "We've sent a code to "), /* @__PURE__ */ React89.createElement("span", null, props.phoneNumber)), " "), /* @__PURE__ */ React89.createElement(
+  ), /* @__PURE__ */ React90.createElement("div", { className: "mb-4 dark:text-white" }, /* @__PURE__ */ React90.createElement("div", { className: "text-lg font-bold" }, props.texts.checkYourPhone ?? "Please check your phone"), /* @__PURE__ */ React90.createElement("div", { className: "text-muted-foreground" }, /* @__PURE__ */ React90.createElement("span", null, props.texts.weSentCode ?? "We've sent a code to "), /* @__PURE__ */ React90.createElement("span", null, props.phoneNumber)), " "), /* @__PURE__ */ React90.createElement(
     "form",
     {
       onSubmit: (e) => {
@@ -9557,17 +9668,17 @@ var CodeConfirmation = (props) => {
         }
       }
     },
-    /* @__PURE__ */ React89.createElement(HawaPinInput, { width: "full", digits: 6, getPins: (e) => setPins(e) }),
-    /* @__PURE__ */ React89.createElement("div", { className: " py-2 text-center text-xs text-muted-foreground" }, /* @__PURE__ */ React89.createElement("span", null, props.texts.didntGetCode ?? "Didn't get the code?"), " ", /* @__PURE__ */ React89.createElement("span", { className: "clickable-link" }, props.texts.resendCode ?? "Click to resend")),
-    /* @__PURE__ */ React89.createElement("div", { className: "mt-4  grid grid-cols-2 gap-2" }, /* @__PURE__ */ React89.createElement(Button, { variant: "secondary" }, props.texts.cancel ?? "Cancel"), /* @__PURE__ */ React89.createElement(Button, null, props.texts.confirm ?? "Confirm"))
+    /* @__PURE__ */ React90.createElement(HawaPinInput, { width: "full", digits: 6, getPins: (e) => setPins(e) }),
+    /* @__PURE__ */ React90.createElement("div", { className: " py-2 text-center text-xs text-muted-foreground" }, /* @__PURE__ */ React90.createElement("span", null, props.texts.didntGetCode ?? "Didn't get the code?"), " ", /* @__PURE__ */ React90.createElement("span", { className: "clickable-link" }, props.texts.resendCode ?? "Click to resend")),
+    /* @__PURE__ */ React90.createElement("div", { className: "mt-4  grid grid-cols-2 gap-2" }, /* @__PURE__ */ React90.createElement(Button, { variant: "secondary" }, props.texts.cancel ?? "Cancel"), /* @__PURE__ */ React90.createElement(Button, null, props.texts.confirm ?? "Confirm"))
   )));
 };
 
 // src/blocks/Payment/SelectPayment.tsx
-import React90, { useState as useState44 } from "react";
+import React91, { useState as useState44 } from "react";
 var SelectPayment = (props) => {
   const [selectedMethod, setSelectedMethod] = useState44("");
-  return /* @__PURE__ */ React90.createElement(Card, null, /* @__PURE__ */ React90.createElement(CardHeader, null, /* @__PURE__ */ React90.createElement(CardTitle, null, "Choose Payment Method"), /* @__PURE__ */ React90.createElement(CardDescription, null, "And you'll be directed to the next step to complete the payment")), /* @__PURE__ */ React90.createElement(CardContent, { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React90.createElement(
+  return /* @__PURE__ */ React91.createElement(Card, null, /* @__PURE__ */ React91.createElement(CardHeader, null, /* @__PURE__ */ React91.createElement(CardTitle, null, "Choose Payment Method"), /* @__PURE__ */ React91.createElement(CardDescription, null, "And you'll be directed to the next step to complete the payment")), /* @__PURE__ */ React91.createElement(CardContent, { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React91.createElement(
     Button,
     {
       className: cn(
@@ -9579,15 +9690,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaMada,
       onClick: () => setSelectedMethod("mada")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/mada.png",
         className: "h-6"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.madaLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.madaLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       className: cn(
@@ -9599,15 +9710,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaApplePay,
       onClick: () => setSelectedMethod("apple-pay")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/apple-pay.png",
         className: "h-11"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.applePayLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.applePayLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       className: cn(
@@ -9619,15 +9730,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaCreditCard,
       onClick: () => setSelectedMethod("visa-master")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/visa-master.png",
         className: "h-6"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.visaMasterLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.visaMasterLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       variant: "outline",
@@ -9639,7 +9750,7 @@ var SelectPayment = (props) => {
       disabled: !props.viaWallet,
       onClick: () => setSelectedMethod("wallet")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "svg",
       {
         version: "1.1",
@@ -9647,20 +9758,20 @@ var SelectPayment = (props) => {
         viewBox: "0 0 223 223",
         className: "h-6 w-6"
       },
-      /* @__PURE__ */ React90.createElement("g", null, /* @__PURE__ */ React90.createElement(
+      /* @__PURE__ */ React91.createElement("g", null, /* @__PURE__ */ React91.createElement(
         "path",
         {
           d: "M223,94.5c0-6.075-4.925-11-11-11h-63c-6.075,0-11,4.925-11,11v33c0,6.075,4.925,11,11,11h63c6.075,0,11-4.925,11-11V94.5z\n                  M169.515,123.967c-7.082,0-12.823-5.741-12.823-12.823c0-7.082,5.741-12.823,12.823-12.823c7.082,0,12.823,5.741,12.823,12.823\n                  C182.338,118.225,176.597,123.967,169.515,123.967z"
         }
-      ), /* @__PURE__ */ React90.createElement(
+      ), /* @__PURE__ */ React91.createElement(
         "path",
         {
           d: "M123.509,68.5H205v-33c0-8.271-6.395-15-14.667-15h-175C7.062,20.5,0,27.229,0,35.5v152c0,8.271,7.062,15,15.333,15h175\n                  c8.271,0,14.667-6.729,14.667-15v-34h-81.342L123.509,68.5z"
         }
       ))
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.walletLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.walletLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       variant: "outline",
@@ -9672,15 +9783,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaSTCPay,
       onClick: () => setSelectedMethod("stc-pay")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/stc-pay.png",
         className: "h-6"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.stcPayLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.stcPayLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       variant: "outline",
@@ -9692,15 +9803,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaGooglePay,
       onClick: () => setSelectedMethod("google-pay")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/google-pay.png",
         className: "h-6"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.googlePayLabel)
-  ), /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.googlePayLabel)
+  ), /* @__PURE__ */ React91.createElement(
     Button,
     {
       variant: "outline",
@@ -9712,15 +9823,15 @@ var SelectPayment = (props) => {
       disabled: !props.viaPayPal,
       onClick: () => setSelectedMethod("paypal")
     },
-    /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement(
       "img",
       {
         src: "https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/paypal.png",
         className: "h-6"
       }
     ),
-    /* @__PURE__ */ React90.createElement("span", null, props.paypalLabel)
-  )), /* @__PURE__ */ React90.createElement(CardFooter, null, /* @__PURE__ */ React90.createElement(
+    /* @__PURE__ */ React91.createElement("span", null, props.paypalLabel)
+  )), /* @__PURE__ */ React91.createElement(CardFooter, null, /* @__PURE__ */ React91.createElement(
     Button,
     {
       onClick: () => props.handleContinue(selectedMethod),
@@ -9732,7 +9843,7 @@ var SelectPayment = (props) => {
 };
 
 // src/blocks/Payment/CreditCardForm.tsx
-import React91 from "react";
+import React92 from "react";
 import { Controller as Controller7, useForm as useForm7 } from "react-hook-form";
 var CreditCardForm = (props) => {
   const methods = useForm7();
@@ -9741,12 +9852,12 @@ var CreditCardForm = (props) => {
     handleSubmit,
     control
   } = methods;
-  return /* @__PURE__ */ React91.createElement(Card, null, /* @__PURE__ */ React91.createElement("form", { onSubmit: handleSubmit(props.handle) }, /* @__PURE__ */ React91.createElement(CardContent, { headless: true }, /* @__PURE__ */ React91.createElement("div", { className: "flex flex-row gap-4" }, /* @__PURE__ */ React91.createElement(
+  return /* @__PURE__ */ React92.createElement(Card, null, /* @__PURE__ */ React92.createElement("form", { onSubmit: handleSubmit(props.handle) }, /* @__PURE__ */ React92.createElement(CardContent, { headless: true }, /* @__PURE__ */ React92.createElement("div", { className: "flex flex-row gap-4" }, /* @__PURE__ */ React92.createElement(
     Controller7,
     {
       control,
       name: "cardName",
-      render: ({ field }) => /* @__PURE__ */ React91.createElement(
+      render: ({ field }) => /* @__PURE__ */ React92.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9761,12 +9872,12 @@ var CreditCardForm = (props) => {
         required: "Password is rquired"
       }
     }
-  ), /* @__PURE__ */ React91.createElement("div", { className: "w-1/4" }, /* @__PURE__ */ React91.createElement(
+  ), /* @__PURE__ */ React92.createElement("div", { className: "w-1/4" }, /* @__PURE__ */ React92.createElement(
     Controller7,
     {
       control,
       name: "cardName",
-      render: ({ field }) => /* @__PURE__ */ React91.createElement(
+      render: ({ field }) => /* @__PURE__ */ React92.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9783,12 +9894,12 @@ var CreditCardForm = (props) => {
         required: "Password is rquired"
       }
     }
-  ))), /* @__PURE__ */ React91.createElement(
+  ))), /* @__PURE__ */ React92.createElement(
     Controller7,
     {
       control,
       name: "cardName",
-      render: ({ field }) => /* @__PURE__ */ React91.createElement(
+      render: ({ field }) => /* @__PURE__ */ React92.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9803,12 +9914,12 @@ var CreditCardForm = (props) => {
         required: "Password is rquired"
       }
     }
-  ), /* @__PURE__ */ React91.createElement(
+  ), /* @__PURE__ */ React92.createElement(
     Controller7,
     {
       control,
       name: "cardName",
-      render: ({ field }) => /* @__PURE__ */ React91.createElement(
+      render: ({ field }) => /* @__PURE__ */ React92.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9823,24 +9934,24 @@ var CreditCardForm = (props) => {
         required: "Password is rquired"
       }
     }
-  )), /* @__PURE__ */ React91.createElement(CardFooter, null, /* @__PURE__ */ React91.createElement(Button, { className: "w-full", onClick: props.handlePayWithCreditCard }, "Pay with Credit Card"))));
+  )), /* @__PURE__ */ React92.createElement(CardFooter, null, /* @__PURE__ */ React92.createElement(Button, { className: "w-full", onClick: props.handlePayWithCreditCard }, "Pay with Credit Card"))));
 };
 
 // src/blocks/Payment/ChargeWalletForm.tsx
-import React92, { useState as useState45 } from "react";
+import React93, { useState as useState45 } from "react";
 var ChargeWalletForm = (props) => {
   const [walletAmount, setWalletAmount] = useState45(0);
-  return /* @__PURE__ */ React92.createElement(Card, null, /* @__PURE__ */ React92.createElement(CardContent, { headless: true }, /* @__PURE__ */ React92.createElement("div", { className: "p-4 text-center" }, /* @__PURE__ */ React92.createElement("div", { className: " text-5xl font-extrabold" }, Number(walletAmount).toLocaleString("en") || "0"), /* @__PURE__ */ React92.createElement("div", { className: "text-sm font-normal" }, props.currency || "SAR")), /* @__PURE__ */ React92.createElement("div", { className: "mb-2 flex w-full flex-col gap-4 text-center" }, /* @__PURE__ */ React92.createElement("div", { className: "mb-2 flex w-full flex-row gap-4 text-center" }, /* @__PURE__ */ React92.createElement(Button, { variant: "outline", className: "h-full w-full" }, "10 SAR"), /* @__PURE__ */ React92.createElement(Button, { variant: "outline", className: "h-full w-full" }, "50 SAR"), /* @__PURE__ */ React92.createElement(Button, { variant: "outline", className: "h-full w-full" }, "100 SAR")), /* @__PURE__ */ React92.createElement(Input, { placeholder: "Custom Amount", type: "number", name: "amount" })), /* @__PURE__ */ React92.createElement(Button, { className: "mt-6 w-full" }, props.texts.chargeWallet)));
+  return /* @__PURE__ */ React93.createElement(Card, null, /* @__PURE__ */ React93.createElement(CardContent, { headless: true }, /* @__PURE__ */ React93.createElement("div", { className: "p-4 text-center" }, /* @__PURE__ */ React93.createElement("div", { className: " text-5xl font-extrabold" }, Number(walletAmount).toLocaleString("en") || "0"), /* @__PURE__ */ React93.createElement("div", { className: "text-sm font-normal" }, props.currency || "SAR")), /* @__PURE__ */ React93.createElement("div", { className: "mb-2 flex w-full flex-col gap-4 text-center" }, /* @__PURE__ */ React93.createElement("div", { className: "mb-2 flex w-full flex-row gap-4 text-center" }, /* @__PURE__ */ React93.createElement(Button, { variant: "outline", className: "h-full w-full" }, "10 SAR"), /* @__PURE__ */ React93.createElement(Button, { variant: "outline", className: "h-full w-full" }, "50 SAR"), /* @__PURE__ */ React93.createElement(Button, { variant: "outline", className: "h-full w-full" }, "100 SAR")), /* @__PURE__ */ React93.createElement(Input, { placeholder: "Custom Amount", type: "number", name: "amount" })), /* @__PURE__ */ React93.createElement(Button, { className: "mt-6 w-full" }, props.texts.chargeWallet)));
 };
 
 // src/blocks/Payment/PayWithWallet.tsx
-import React93 from "react";
+import React94 from "react";
 var PayWithWallet = (props) => {
-  return /* @__PURE__ */ React93.createElement(Card, null, /* @__PURE__ */ React93.createElement(CardContent, { headless: true }, /* @__PURE__ */ React93.createElement("div", { className: "text-center text-5xl font-extrabold" }, props.walletBalance || "0", /* @__PURE__ */ React93.createElement("div", { className: "text-sm font-normal" }, props.currency || "SAR")), /* @__PURE__ */ React93.createElement(Button, { className: "mt-6 w-full", onClick: props.handlePayWithWallet }, "Pay Now")));
+  return /* @__PURE__ */ React94.createElement(Card, null, /* @__PURE__ */ React94.createElement(CardContent, { headless: true }, /* @__PURE__ */ React94.createElement("div", { className: "text-center text-5xl font-extrabold" }, props.walletBalance || "0", /* @__PURE__ */ React94.createElement("div", { className: "text-sm font-normal" }, props.currency || "SAR")), /* @__PURE__ */ React94.createElement(Button, { className: "mt-6 w-full", onClick: props.handlePayWithWallet }, "Pay Now")));
 };
 
 // src/blocks/Payment/CheckoutForm.tsx
-import React94 from "react";
+import React95 from "react";
 import { Controller as Controller8, FormProvider as FormProvider4, useForm as useForm8 } from "react-hook-form";
 var CheckoutForm = (props) => {
   let isArabic = props.lang === "ar";
@@ -9864,7 +9975,7 @@ var CheckoutForm = (props) => {
       xl: "row"
     }
   };
-  return /* @__PURE__ */ React94.createElement(Card, null, /* @__PURE__ */ React94.createElement(CardHeader, null, /* @__PURE__ */ React94.createElement(CardTitle, null, props.texts.orderDetails)), /* @__PURE__ */ React94.createElement(CardContent, null, /* @__PURE__ */ React94.createElement("div", null, /* @__PURE__ */ React94.createElement("div", { className: "rounded border border-gray-300" }, /* @__PURE__ */ React94.createElement(
+  return /* @__PURE__ */ React95.createElement(Card, null, /* @__PURE__ */ React95.createElement(CardHeader, null, /* @__PURE__ */ React95.createElement(CardTitle, null, props.texts.orderDetails)), /* @__PURE__ */ React95.createElement(CardContent, null, /* @__PURE__ */ React95.createElement("div", null, /* @__PURE__ */ React95.createElement("div", { className: "rounded border border-gray-300" }, /* @__PURE__ */ React95.createElement(
     HawaTable,
     {
       pagination: false,
@@ -9878,13 +9989,13 @@ var CheckoutForm = (props) => {
       rows: props.products,
       bordersWidth: "1"
     }
-  )))), /* @__PURE__ */ React94.createElement(CardHeader, null, /* @__PURE__ */ React94.createElement(CardTitle, null, props.texts.billingAddress)), /* @__PURE__ */ React94.createElement("form", { onSubmit: handleSubmit(props.handlePayNow) }, /* @__PURE__ */ React94.createElement(CardContent, null, /* @__PURE__ */ React94.createElement("div", null, /* @__PURE__ */ React94.createElement(FormProvider4, { ...methods }, /* @__PURE__ */ React94.createElement("div", null, /* @__PURE__ */ React94.createElement(
+  )))), /* @__PURE__ */ React95.createElement(CardHeader, null, /* @__PURE__ */ React95.createElement(CardTitle, null, props.texts.billingAddress)), /* @__PURE__ */ React95.createElement("form", { onSubmit: handleSubmit(props.handlePayNow) }, /* @__PURE__ */ React95.createElement(CardContent, null, /* @__PURE__ */ React95.createElement("div", null, /* @__PURE__ */ React95.createElement(FormProvider4, { ...methods }, /* @__PURE__ */ React95.createElement("div", null, /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "firstName",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           type: "text",
@@ -9895,13 +10006,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  ), /* @__PURE__ */ React94.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React94.createElement(
+  ), /* @__PURE__ */ React95.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "lastName",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9913,12 +10024,12 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  )), /* @__PURE__ */ React94.createElement(
+  )), /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "email",
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9937,13 +10048,13 @@ var CheckoutForm = (props) => {
         }
       }
     }
-  ), /* @__PURE__ */ React94.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React94.createElement(
+  ), /* @__PURE__ */ React95.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "streetAddress",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9955,13 +10066,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  )), /* @__PURE__ */ React94.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React94.createElement(
+  )), /* @__PURE__ */ React95.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "province",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9973,13 +10084,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  ), /* @__PURE__ */ React94.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React94.createElement(
+  ), /* @__PURE__ */ React95.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "city",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -9991,13 +10102,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  )), /* @__PURE__ */ React94.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React94.createElement(
+  )), /* @__PURE__ */ React95.createElement("div", { className: "flex flex-col md:flex-row" }, /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "buildingNumber",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -10009,13 +10120,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  ), /* @__PURE__ */ React94.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React94.createElement(
+  ), /* @__PURE__ */ React95.createElement("div", { style: { width: 20 } }), /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "zipCode",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaTextField,
         {
           width: "full",
@@ -10027,13 +10138,13 @@ var CheckoutForm = (props) => {
         }
       )
     }
-  )), /* @__PURE__ */ React94.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React94.createElement(
+  )), /* @__PURE__ */ React95.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React95.createElement(
     Controller8,
     {
       control,
       name: "country",
       rules: { required: props.texts?.required },
-      render: ({ field }) => /* @__PURE__ */ React94.createElement(
+      render: ({ field }) => /* @__PURE__ */ React95.createElement(
         HawaSelect,
         {
           native: true,
@@ -10044,18 +10155,18 @@ var CheckoutForm = (props) => {
           onChange: (e) => field.onChange(e.country_label),
           value: field.value ?? ""
         },
-        /* @__PURE__ */ React94.createElement("option", null),
-        props.countriesList.map((country, i) => /* @__PURE__ */ React94.createElement("option", { key: i }, country))
+        /* @__PURE__ */ React95.createElement("option", null),
+        props.countriesList.map((country, i) => /* @__PURE__ */ React95.createElement("option", { key: i }, country))
       )
     }
-  ))))), /* @__PURE__ */ React94.createElement(CardFooter, null, /* @__PURE__ */ React94.createElement(Button, { className: "w-full" }, props.texts.payNow)), " "));
+  ))))), /* @__PURE__ */ React95.createElement(CardFooter, null, /* @__PURE__ */ React95.createElement(Button, { className: "w-full" }, props.texts.payNow)), " "));
 };
 
 // src/blocks/Payment/Confirmation.tsx
-import React95 from "react";
+import React96 from "react";
 var ConfirmationPage = (props) => {
   let isArabic = props.lang === "ar";
-  return /* @__PURE__ */ React95.createElement(Card, null, /* @__PURE__ */ React95.createElement(CardContent, { headless: true }, " ", /* @__PURE__ */ React95.createElement("div", { className: "py-5 text-center text-3xl font-bold dark:text-white" }, props.confirmationTitle), /* @__PURE__ */ React95.createElement("div", { className: "py-5 dark:text-white" }, /* @__PURE__ */ React95.createElement("div", { className: "mb-2 text-center" }, props.texts.successMessage, " ", /* @__PURE__ */ React95.createElement("strong", null, props.userEmail)), /* @__PURE__ */ React95.createElement("div", { className: "text-center" }, props.texts.yourOrderNumber), /* @__PURE__ */ React95.createElement("div", { className: "text-center font-bold" }, props.orderNumber)), /* @__PURE__ */ React95.createElement("div", { className: "flex flex-col items-center justify-center gap-4 py-5 pt-0" }, /* @__PURE__ */ React95.createElement(Button, { className: "w-full", onClick: props.handlePrint }, props.texts.print), /* @__PURE__ */ React95.createElement(Button, { className: "w-full", onClick: props.handleHistory }, props.texts.history), /* @__PURE__ */ React95.createElement(Button, { className: "w-full", onClick: props.handleHome }, props.texts.homePage), /* @__PURE__ */ React95.createElement("div", { className: " text-center text-sm dark:text-white" }, props.texts.fasterPaymentNote), /* @__PURE__ */ React95.createElement(
+  return /* @__PURE__ */ React96.createElement(Card, null, /* @__PURE__ */ React96.createElement(CardContent, { headless: true }, " ", /* @__PURE__ */ React96.createElement("div", { className: "py-5 text-center text-3xl font-bold dark:text-white" }, props.confirmationTitle), /* @__PURE__ */ React96.createElement("div", { className: "py-5 dark:text-white" }, /* @__PURE__ */ React96.createElement("div", { className: "mb-2 text-center" }, props.texts.successMessage, " ", /* @__PURE__ */ React96.createElement("strong", null, props.userEmail)), /* @__PURE__ */ React96.createElement("div", { className: "text-center" }, props.texts.yourOrderNumber), /* @__PURE__ */ React96.createElement("div", { className: "text-center font-bold" }, props.orderNumber)), /* @__PURE__ */ React96.createElement("div", { className: "flex flex-col items-center justify-center gap-4 py-5 pt-0" }, /* @__PURE__ */ React96.createElement(Button, { className: "w-full", onClick: props.handlePrint }, props.texts.print), /* @__PURE__ */ React96.createElement(Button, { className: "w-full", onClick: props.handleHistory }, props.texts.history), /* @__PURE__ */ React96.createElement(Button, { className: "w-full", onClick: props.handleHome }, props.texts.homePage), /* @__PURE__ */ React96.createElement("div", { className: " text-center text-sm dark:text-white" }, props.texts.fasterPaymentNote), /* @__PURE__ */ React96.createElement(
     "a",
     {
       className: "clickable-link text-xs",
@@ -10066,9 +10177,9 @@ var ConfirmationPage = (props) => {
 };
 
 // src/blocks/Pricing/PricingPlans.tsx
-import React96 from "react";
+import React97 from "react";
 var PricingPlans = (props) => {
-  return /* @__PURE__ */ React96.createElement("div", null, /* @__PURE__ */ React96.createElement("div", { className: "mb-2 flex w-full justify-between" }, /* @__PURE__ */ React96.createElement(
+  return /* @__PURE__ */ React97.createElement("div", null, /* @__PURE__ */ React97.createElement("div", { className: "mb-2 flex w-full justify-between" }, /* @__PURE__ */ React97.createElement(
     HawaRadio,
     {
       design: "tabs",
@@ -10076,7 +10187,7 @@ var PricingPlans = (props) => {
       options: props.billingCycles,
       onChangeTab: (e) => props.onCycleChange(e)
     }
-  ), /* @__PURE__ */ React96.createElement(
+  ), /* @__PURE__ */ React97.createElement(
     HawaRadio,
     {
       design: "tabs",
@@ -10084,8 +10195,8 @@ var PricingPlans = (props) => {
       options: props.currencies,
       onChangeTab: (e) => props.onCurrencyChange(e)
     }
-  )), /* @__PURE__ */ React96.createElement("div", { className: "flex flex-row justify-between" }, props.plans.map((plan, index) => {
-    return /* @__PURE__ */ React96.createElement(
+  )), /* @__PURE__ */ React97.createElement("div", { className: "flex flex-row justify-between" }, props.plans.map((plan, index) => {
+    return /* @__PURE__ */ React97.createElement(
       HawaPricingCard,
       {
         key: index,
@@ -10102,8 +10213,8 @@ var PricingPlans = (props) => {
 };
 
 // src/blocks/Pricing/ComparingPlans.tsx
-import React97, { useState as useState46 } from "react";
-var CheckMark = () => /* @__PURE__ */ React97.createElement(
+import React98, { useState as useState46 } from "react";
+var CheckMark = () => /* @__PURE__ */ React98.createElement(
   "svg",
   {
     className: "h-5 w-5 text-green-500",
@@ -10111,7 +10222,7 @@ var CheckMark = () => /* @__PURE__ */ React97.createElement(
     fill: "currentColor",
     viewBox: "0 0 20 20"
   },
-  /* @__PURE__ */ React97.createElement(
+  /* @__PURE__ */ React98.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -10120,7 +10231,7 @@ var CheckMark = () => /* @__PURE__ */ React97.createElement(
     }
   )
 );
-var UncheckMark = () => /* @__PURE__ */ React97.createElement(
+var UncheckMark = () => /* @__PURE__ */ React98.createElement(
   "svg",
   {
     className: "h-5 w-5 text-red-500",
@@ -10128,7 +10239,7 @@ var UncheckMark = () => /* @__PURE__ */ React97.createElement(
     fill: "currentColor",
     viewBox: "0 0 20 20"
   },
-  /* @__PURE__ */ React97.createElement(
+  /* @__PURE__ */ React98.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -10140,7 +10251,7 @@ var UncheckMark = () => /* @__PURE__ */ React97.createElement(
 var ComparingPlans = (props) => {
   const [currentCurrency, setCurrentCurrency] = useState46("sar");
   const [currentCycle, setCurrentCycle] = useState46("month");
-  return /* @__PURE__ */ React97.createElement("div", { id: "detailed-pricing", className: "w-full overflow-x-auto" }, /* @__PURE__ */ React97.createElement("div", { className: "mb-2 flex w-full justify-between" }, /* @__PURE__ */ React97.createElement(
+  return /* @__PURE__ */ React98.createElement("div", { id: "detailed-pricing", className: "w-full overflow-x-auto" }, /* @__PURE__ */ React98.createElement("div", { className: "mb-2 flex w-full justify-between" }, /* @__PURE__ */ React98.createElement(
     HawaRadio,
     {
       design: "tabs",
@@ -10148,7 +10259,7 @@ var ComparingPlans = (props) => {
       options: props.billingCycles,
       onChangeTab: (e) => props.onCycleChange(e)
     }
-  ), /* @__PURE__ */ React97.createElement(
+  ), /* @__PURE__ */ React98.createElement(
     HawaRadio,
     {
       design: "tabs",
@@ -10156,9 +10267,9 @@ var ComparingPlans = (props) => {
       options: props.currencies,
       onChangeTab: (e) => props.onCurrencyChange(e)
     }
-  )), /* @__PURE__ */ React97.createElement("div", { className: " overflow-hidden rounded" }, /* @__PURE__ */ React97.createElement("div", { className: "grid grid-cols-4 gap-x-2 border-b border-t border-gray-200 bg-gray-100 p-4 text-sm font-medium text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-white" }, /* @__PURE__ */ React97.createElement("div", { className: "flex items-center" }), props.plans.map((plan) => /* @__PURE__ */ React97.createElement("div", null, /* @__PURE__ */ React97.createElement("h5", { className: "text-md 0 font-bold text-gray-500 dark:text-gray-400" }, plan.texts.title), /* @__PURE__ */ React97.createElement("div", { className: " flex items-baseline  text-gray-900 dark:text-white" }, /* @__PURE__ */ React97.createElement(React97.Fragment, null, /* @__PURE__ */ React97.createElement("span", { className: "text-5xl font-extrabold tracking-tight" }, plan.price), /* @__PURE__ */ React97.createElement("span", { className: "mx-1 text-sm font-semibold" }, plan.texts.currencyText)), /* @__PURE__ */ React97.createElement("span", { className: "ml-1 text-xl font-normal text-gray-500 dark:text-gray-400" }, "/ ", plan.texts.cycleText)), /* @__PURE__ */ React97.createElement("h5", { className: "text-md  font-normal text-gray-500 dark:text-gray-400" }, plan.texts.subtitle)))), props.plans?.map((plan) => {
+  )), /* @__PURE__ */ React98.createElement("div", { className: " overflow-hidden rounded" }, /* @__PURE__ */ React98.createElement("div", { className: "grid grid-cols-4 gap-x-2 border-b border-t border-gray-200 bg-gray-100 p-4 text-sm font-medium text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-white" }, /* @__PURE__ */ React98.createElement("div", { className: "flex items-center" }), props.plans.map((plan) => /* @__PURE__ */ React98.createElement("div", null, /* @__PURE__ */ React98.createElement("h5", { className: "text-md 0 font-bold text-gray-500 dark:text-gray-400" }, plan.texts.title), /* @__PURE__ */ React98.createElement("div", { className: " flex items-baseline  text-gray-900 dark:text-white" }, /* @__PURE__ */ React98.createElement(React98.Fragment, null, /* @__PURE__ */ React98.createElement("span", { className: "text-5xl font-extrabold tracking-tight" }, plan.price), /* @__PURE__ */ React98.createElement("span", { className: "mx-1 text-sm font-semibold" }, plan.texts.currencyText)), /* @__PURE__ */ React98.createElement("span", { className: "ml-1 text-xl font-normal text-gray-500 dark:text-gray-400" }, "/ ", plan.texts.cycleText)), /* @__PURE__ */ React98.createElement("h5", { className: "text-md  font-normal text-gray-500 dark:text-gray-400" }, plan.texts.subtitle)))), props.plans?.map((plan) => {
     return plan.features.map((feature) => {
-      return /* @__PURE__ */ React97.createElement("div", { className: "grid grid-cols-4 gap-x-16 border-b border-gray-200 px-4 py-5 text-sm text-gray-700 dark:border-gray-700" }, /* @__PURE__ */ React97.createElement("div", { className: "  flex flex-row items-center gap-2  text-gray-500 dark:text-gray-400" }, feature.text, feature.description && /* @__PURE__ */ React97.createElement(Tooltip, { side: "right", content: feature.description }, /* @__PURE__ */ React97.createElement(
+      return /* @__PURE__ */ React98.createElement("div", { className: "grid grid-cols-4 gap-x-16 border-b border-gray-200 px-4 py-5 text-sm text-gray-700 dark:border-gray-700" }, /* @__PURE__ */ React98.createElement("div", { className: "  flex flex-row items-center gap-2  text-gray-500 dark:text-gray-400" }, feature.text, feature.description && /* @__PURE__ */ React98.createElement(Tooltip, { side: "right", content: feature.description }, /* @__PURE__ */ React98.createElement(
         "svg",
         {
           stroke: "currentColor",
@@ -10168,14 +10279,14 @@ var ComparingPlans = (props) => {
           height: "1em",
           width: "1em"
         },
-        /* @__PURE__ */ React97.createElement("path", { d: "M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" })
-      ))), /* @__PURE__ */ React97.createElement(UncheckMark, null), /* @__PURE__ */ React97.createElement(CheckMark, null), /* @__PURE__ */ React97.createElement(UncheckMark, null));
+        /* @__PURE__ */ React98.createElement("path", { d: "M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" })
+      ))), /* @__PURE__ */ React98.createElement(UncheckMark, null), /* @__PURE__ */ React98.createElement(CheckMark, null), /* @__PURE__ */ React98.createElement(UncheckMark, null));
     });
   })));
 };
 
 // src/blocks/Pricing/HorizontalPricing.tsx
-import React98, { useState as useState47 } from "react";
+import React99, { useState as useState47 } from "react";
 import clsx35 from "clsx";
 var HorizontalPricing = (props) => {
   const [selectedCard, setSelectedCard] = useState47(null);
@@ -10184,28 +10295,28 @@ var HorizontalPricing = (props) => {
     { title: "business", price: "$99", cycle: "/mo" },
     { title: "enterprise", price: "$149", cycle: "/mo" }
   ];
-  return /* @__PURE__ */ React98.createElement("div", { className: "z-10 w-full max-w-screen-sm" }, /* @__PURE__ */ React98.createElement("div", { className: "max-w-2xl " }, /* @__PURE__ */ React98.createElement("div", { className: "flex flex-row justify-between" }, /* @__PURE__ */ React98.createElement(
+  return /* @__PURE__ */ React99.createElement("div", { className: "z-10 w-full max-w-screen-sm" }, /* @__PURE__ */ React99.createElement("div", { className: "max-w-2xl " }, /* @__PURE__ */ React99.createElement("div", { className: "flex flex-row justify-between" }, /* @__PURE__ */ React99.createElement(
     HawaRadio,
     {
       design: "tabs",
       options: props.currencies,
       defaultValue: props.currentCurrency
     }
-  ), /* @__PURE__ */ React98.createElement(
+  ), /* @__PURE__ */ React99.createElement(
     HawaRadio,
     {
       design: "tabs",
       options: props.billingCycles,
       defaultValue: props.currentCycle
     }
-  )), data.map((d) => /* @__PURE__ */ React98.createElement(
+  )), data.map((d) => /* @__PURE__ */ React99.createElement(
     "label",
     {
       htmlFor: d.title,
       className: "",
       onClick: () => setSelectedCard(d.title)
     },
-    /* @__PURE__ */ React98.createElement(
+    /* @__PURE__ */ React99.createElement(
       "input",
       {
         type: "radio",
@@ -10214,7 +10325,7 @@ var HorizontalPricing = (props) => {
         className: "peer appearance-none"
       }
     ),
-    /* @__PURE__ */ React98.createElement(
+    /* @__PURE__ */ React99.createElement(
       "div",
       {
         className: clsx35(
@@ -10222,18 +10333,18 @@ var HorizontalPricing = (props) => {
           "peer flex cursor-pointer items-center justify-between  rounded-xl border bg-background px-5   py-4 shadow dark:text-white  peer-checked:[&_.active]:block peer-checked:[&_.default]:hidden"
         )
       },
-      /* @__PURE__ */ React98.createElement("div", { className: "peer flex items-center gap-4" }, /* @__PURE__ */ React98.createElement(CheckIcons, null), /* @__PURE__ */ React98.createElement(
+      /* @__PURE__ */ React99.createElement("div", { className: "peer flex items-center gap-4" }, /* @__PURE__ */ React99.createElement(CheckIcons, null), /* @__PURE__ */ React99.createElement(
         CardText,
         {
           title: "Enterprise",
           subtitle: "For startups and new businesses"
         }
       )),
-      /* @__PURE__ */ React98.createElement(CardPrice, { amount: d.price, cycle: d.cycle })
+      /* @__PURE__ */ React99.createElement(CardPrice, { amount: d.price, cycle: d.cycle })
     )
   ))));
 };
-var CheckIcons = () => /* @__PURE__ */ React98.createElement(React98.Fragment, null, /* @__PURE__ */ React98.createElement(
+var CheckIcons = () => /* @__PURE__ */ React99.createElement(React99.Fragment, null, /* @__PURE__ */ React99.createElement(
   "svg",
   {
     fill: "none",
@@ -10242,7 +10353,7 @@ var CheckIcons = () => /* @__PURE__ */ React98.createElement(React98.Fragment, n
     stroke: "currentColor",
     className: "default h-8 w-8 text-neutral-500"
   },
-  /* @__PURE__ */ React98.createElement(
+  /* @__PURE__ */ React99.createElement(
     "path",
     {
       strokeLinecap: "round",
@@ -10250,14 +10361,14 @@ var CheckIcons = () => /* @__PURE__ */ React98.createElement(React98.Fragment, n
       d: "M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
     }
   )
-), /* @__PURE__ */ React98.createElement(
+), /* @__PURE__ */ React99.createElement(
   "svg",
   {
     viewBox: "0 0 24 24",
     fill: "currentColor",
     className: "active hidden h-8 w-8 text-blue-500"
   },
-  /* @__PURE__ */ React98.createElement(
+  /* @__PURE__ */ React99.createElement(
     "path",
     {
       fillRule: "evenodd",
@@ -10266,21 +10377,21 @@ var CheckIcons = () => /* @__PURE__ */ React98.createElement(React98.Fragment, n
     }
   )
 ));
-var CardText = (props) => /* @__PURE__ */ React98.createElement("div", { className: "peer flex flex-col items-start " }, /* @__PURE__ */ React98.createElement("h2", { className: "font-medium text-neutral-700 dark:text-gray-100 sm:text-xl" }, props.title), /* @__PURE__ */ React98.createElement("p", { className: "text-sm text-neutral-500 dark:text-gray-300" }, props.subtitle, " "));
-var CardPrice = (props) => /* @__PURE__ */ React98.createElement("h2", { className: "peer text-xl font-semibold text-neutral-900 dark:text-white sm:text-2xl" }, props.amount, /* @__PURE__ */ React98.createElement("span", { className: "text-base font-medium text-neutral-400" }, props.cycle));
+var CardText = (props) => /* @__PURE__ */ React99.createElement("div", { className: "peer flex flex-col items-start " }, /* @__PURE__ */ React99.createElement("h2", { className: "font-medium text-neutral-700 dark:text-gray-100 sm:text-xl" }, props.title), /* @__PURE__ */ React99.createElement("p", { className: "text-sm text-neutral-500 dark:text-gray-300" }, props.subtitle, " "));
+var CardPrice = (props) => /* @__PURE__ */ React99.createElement("h2", { className: "peer text-xl font-semibold text-neutral-900 dark:text-white sm:text-2xl" }, props.amount, /* @__PURE__ */ React99.createElement("span", { className: "text-base font-medium text-neutral-400" }, props.cycle));
 
 // src/blocks/Referral/ReferralAccount.tsx
-import React99 from "react";
+import React100 from "react";
 var ReferralAccount = ({
   referralLink,
   referralCode
 }) => {
-  return /* @__PURE__ */ React99.createElement(Card, null, /* @__PURE__ */ React99.createElement(CardContent, { headless: true }, /* @__PURE__ */ React99.createElement("div", { className: "my-2 mt-0" }, /* @__PURE__ */ React99.createElement("div", { className: "mb-1" }, "Referral Code"), /* @__PURE__ */ React99.createElement("div", { className: "flex flex-row items-center justify-between rounded border bg-background" }, /* @__PURE__ */ React99.createElement("span", { className: "ml-3 font-bold" }, referralCode), /* @__PURE__ */ React99.createElement(
+  return /* @__PURE__ */ React100.createElement(Card, null, /* @__PURE__ */ React100.createElement(CardContent, { headless: true }, /* @__PURE__ */ React100.createElement("div", { className: "my-2 mt-0" }, /* @__PURE__ */ React100.createElement("div", { className: "mb-1" }, "Referral Code"), /* @__PURE__ */ React100.createElement("div", { className: "flex flex-row items-center justify-between rounded border bg-background" }, /* @__PURE__ */ React100.createElement("span", { className: "ml-3 font-bold" }, referralCode), /* @__PURE__ */ React100.createElement(
     Button,
     {
       onClick: () => navigator.clipboard.writeText(referralCode)
     },
-    /* @__PURE__ */ React99.createElement("span", { className: "bg-red flex items-center justify-center" }, /* @__PURE__ */ React99.createElement(
+    /* @__PURE__ */ React100.createElement("span", { className: "bg-red flex items-center justify-center" }, /* @__PURE__ */ React100.createElement(
       "svg",
       {
         stroke: "currentColor",
@@ -10290,14 +10401,14 @@ var ReferralAccount = ({
         height: "1em",
         width: "1em"
       },
-      /* @__PURE__ */ React99.createElement("path", { d: "M464 0c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48H176c-26.51 0-48-21.49-48-48V48c0-26.51 21.49-48 48-48h288M176 416c-44.112 0-80-35.888-80-80V128H48c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h288c26.51 0 48-21.49 48-48v-48H176z" })
+      /* @__PURE__ */ React100.createElement("path", { d: "M464 0c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48H176c-26.51 0-48-21.49-48-48V48c0-26.51 21.49-48 48-48h288M176 416c-44.112 0-80-35.888-80-80V128H48c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h288c26.51 0 48-21.49 48-48v-48H176z" })
     ), " ")
-  ))), /* @__PURE__ */ React99.createElement("div", { className: "my-2 mt-0" }, /* @__PURE__ */ React99.createElement("div", { className: "mb-1" }, "Referral Link"), /* @__PURE__ */ React99.createElement("div", { className: "flex flex-row items-center justify-between rounded border bg-background" }, /* @__PURE__ */ React99.createElement("span", { className: "ml-3 font-bold" }, referralLink), /* @__PURE__ */ React99.createElement(
+  ))), /* @__PURE__ */ React100.createElement("div", { className: "my-2 mt-0" }, /* @__PURE__ */ React100.createElement("div", { className: "mb-1" }, "Referral Link"), /* @__PURE__ */ React100.createElement("div", { className: "flex flex-row items-center justify-between rounded border bg-background" }, /* @__PURE__ */ React100.createElement("span", { className: "ml-3 font-bold" }, referralLink), /* @__PURE__ */ React100.createElement(
     Button,
     {
       onClick: () => navigator.clipboard.writeText(referralLink)
     },
-    /* @__PURE__ */ React99.createElement("span", { className: "bg-red flex items-center justify-center" }, /* @__PURE__ */ React99.createElement(
+    /* @__PURE__ */ React100.createElement("span", { className: "bg-red flex items-center justify-center" }, /* @__PURE__ */ React100.createElement(
       "svg",
       {
         stroke: "currentColor",
@@ -10307,13 +10418,13 @@ var ReferralAccount = ({
         height: "1em",
         width: "1em"
       },
-      /* @__PURE__ */ React99.createElement("path", { d: "M464 0c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48H176c-26.51 0-48-21.49-48-48V48c0-26.51 21.49-48 48-48h288M176 416c-44.112 0-80-35.888-80-80V128H48c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h288c26.51 0 48-21.49 48-48v-48H176z" })
+      /* @__PURE__ */ React100.createElement("path", { d: "M464 0c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48H176c-26.51 0-48-21.49-48-48V48c0-26.51 21.49-48 48-48h288M176 416c-44.112 0-80-35.888-80-80V128H48c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h288c26.51 0 48-21.49 48-48v-48H176z" })
     ), " ")
   )))));
 };
 
 // src/blocks/Referral/ReferralSettlement.tsx
-import React100 from "react";
+import React101 from "react";
 import { Controller as Controller9, FormProvider as FormProvider5, useForm as useForm9 } from "react-hook-form";
 var ReferralSettlement = ({
   referralLink,
@@ -10326,12 +10437,12 @@ var ReferralSettlement = ({
     handleSubmit,
     control
   } = methods;
-  return /* @__PURE__ */ React100.createElement(Card, null, /* @__PURE__ */ React100.createElement(CardContent, { headless: true }, /* @__PURE__ */ React100.createElement("div", null, /* @__PURE__ */ React100.createElement(FormProvider5, { ...methods }, /* @__PURE__ */ React100.createElement(HawaTextField, { label: "IBAN" }), /* @__PURE__ */ React100.createElement(HawaTextField, { label: "Holder Name" }), /* @__PURE__ */ React100.createElement(
+  return /* @__PURE__ */ React101.createElement(Card, null, /* @__PURE__ */ React101.createElement(CardContent, { headless: true }, /* @__PURE__ */ React101.createElement("div", null, /* @__PURE__ */ React101.createElement(FormProvider5, { ...methods }, /* @__PURE__ */ React101.createElement(HawaTextField, { label: "IBAN" }), /* @__PURE__ */ React101.createElement(HawaTextField, { label: "Holder Name" }), /* @__PURE__ */ React101.createElement(
     Controller9,
     {
       control,
       name: "bank",
-      render: ({ field }) => /* @__PURE__ */ React100.createElement(
+      render: ({ field }) => /* @__PURE__ */ React101.createElement(
         HawaSelect,
         {
           label: "Bank",
@@ -10350,13 +10461,13 @@ var ReferralSettlement = ({
         }
       )
     }
-  ))), /* @__PURE__ */ React100.createElement("div", null, /* @__PURE__ */ React100.createElement(Button, { className: "mt-6 w-full" }, "Add Bank Account")), withdrawError && /* @__PURE__ */ React100.createElement("div", null, /* @__PURE__ */ React100.createElement(
+  ))), /* @__PURE__ */ React101.createElement("div", null, /* @__PURE__ */ React101.createElement(Button, { className: "mt-6 w-full" }, "Add Bank Account")), withdrawError && /* @__PURE__ */ React101.createElement("div", null, /* @__PURE__ */ React101.createElement(
     HawaAlert,
     {
       text: "Sorry can't withdraw the money at the moment. Please try again in 2022/11/20",
       severity: "warning"
     }
-  )), /* @__PURE__ */ React100.createElement("div", { className: "mt-3" }, /* @__PURE__ */ React100.createElement("div", { className: "mb-1" }, "Settlement Accounts"), /* @__PURE__ */ React100.createElement("div", { className: "rounded" }, /* @__PURE__ */ React100.createElement(
+  )), /* @__PURE__ */ React101.createElement("div", { className: "mt-3" }, /* @__PURE__ */ React101.createElement("div", { className: "mb-1" }, "Settlement Accounts"), /* @__PURE__ */ React101.createElement("div", { className: "rounded" }, /* @__PURE__ */ React101.createElement(
     SettlementAccountCard,
     {
       bank: "Al Inma Bank",
@@ -10364,14 +10475,14 @@ var ReferralSettlement = ({
       accountHolder: "Zakher Masri",
       default: true
     }
-  ), /* @__PURE__ */ React100.createElement(
+  ), /* @__PURE__ */ React101.createElement(
     SettlementAccountCard,
     {
       bank: "Al Rajihi Bank",
       iban: "SA10228094028098329119",
       accountHolder: "Zakher Masri"
     }
-  ), /* @__PURE__ */ React100.createElement(
+  ), /* @__PURE__ */ React101.createElement(
     SettlementAccountCard,
     {
       bank: "Al Inma Bank",
@@ -10381,13 +10492,13 @@ var ReferralSettlement = ({
   )))));
 };
 var SettlementAccountCard = (props) => {
-  return /* @__PURE__ */ React100.createElement("div", { className: "mb-3 flex flex-row items-center justify-between rounded border bg-background p-3" }, /* @__PURE__ */ React100.createElement("div", { className: "flex flex-col justify-between" }, /* @__PURE__ */ React100.createElement("div", { className: "text-xs" }, props.bank), /* @__PURE__ */ React100.createElement("div", null, props.accountHolder), /* @__PURE__ */ React100.createElement("div", { className: "text-xs" }, props.iban)), /* @__PURE__ */ React100.createElement("div", { className: "flex flex-row items-center justify-center gap-2" }, props.default && /* @__PURE__ */ React100.createElement(
+  return /* @__PURE__ */ React101.createElement("div", { className: "mb-3 flex flex-row items-center justify-between rounded border bg-background p-3" }, /* @__PURE__ */ React101.createElement("div", { className: "flex flex-col justify-between" }, /* @__PURE__ */ React101.createElement("div", { className: "text-xs" }, props.bank), /* @__PURE__ */ React101.createElement("div", null, props.accountHolder), /* @__PURE__ */ React101.createElement("div", { className: "text-xs" }, props.iban)), /* @__PURE__ */ React101.createElement("div", { className: "flex flex-row items-center justify-center gap-2" }, props.default && /* @__PURE__ */ React101.createElement(
     HawaChip,
     {
       label: "Default",
       size: "small"
     }
-  ), /* @__PURE__ */ React100.createElement(
+  ), /* @__PURE__ */ React101.createElement(
     HawaMenu,
     {
       size: "small",
@@ -10399,7 +10510,7 @@ var SettlementAccountCard = (props) => {
         ]
       ]
     },
-    /* @__PURE__ */ React100.createElement(Button, { variant: "outline", size: "icon" }, /* @__PURE__ */ React100.createElement(
+    /* @__PURE__ */ React101.createElement(Button, { variant: "outline", size: "icon" }, /* @__PURE__ */ React101.createElement(
       "svg",
       {
         "aria-label": "Vertical Three Dots Menu Icon",
@@ -10411,53 +10522,53 @@ var SettlementAccountCard = (props) => {
         height: "1em",
         width: "1em"
       },
-      /* @__PURE__ */ React100.createElement("path", { d: "M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z" })
+      /* @__PURE__ */ React101.createElement("path", { d: "M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z" })
     ))
   )));
 };
 
 // src/blocks/Referral/ReferralStats.tsx
-import React101 from "react";
+import React102 from "react";
 var ReferralStats = ({
   referralLink,
   referralCode,
   withdrawError
 }) => {
-  return /* @__PURE__ */ React101.createElement(Card, null, /* @__PURE__ */ React101.createElement(CardContent, { headless: true }, /* @__PURE__ */ React101.createElement("div", { className: "mb-1" }, "Stats"), /* @__PURE__ */ React101.createElement("div", { className: "justi flex flex-row gap-1" }, /* @__PURE__ */ React101.createElement(NumberCard, { title: "Clicks", number: 22 }), /* @__PURE__ */ React101.createElement(NumberCard, { title: "Sign-ups", number: 32 }), /* @__PURE__ */ React101.createElement(NumberCard, { title: "Commission", number: "213.22 SAR" })), /* @__PURE__ */ React101.createElement(Button, { className: "mt-6 w-full" }, "Withdraw Money"), withdrawError && /* @__PURE__ */ React101.createElement("div", null, /* @__PURE__ */ React101.createElement(
+  return /* @__PURE__ */ React102.createElement(Card, null, /* @__PURE__ */ React102.createElement(CardContent, { headless: true }, /* @__PURE__ */ React102.createElement("div", { className: "mb-1" }, "Stats"), /* @__PURE__ */ React102.createElement("div", { className: "justi flex flex-row gap-1" }, /* @__PURE__ */ React102.createElement(NumberCard, { title: "Clicks", number: 22 }), /* @__PURE__ */ React102.createElement(NumberCard, { title: "Sign-ups", number: 32 }), /* @__PURE__ */ React102.createElement(NumberCard, { title: "Commission", number: "213.22 SAR" })), /* @__PURE__ */ React102.createElement(Button, { className: "mt-6 w-full" }, "Withdraw Money"), withdrawError && /* @__PURE__ */ React102.createElement("div", null, /* @__PURE__ */ React102.createElement(
     HawaAlert,
     {
       text: "Sorry can't withdraw the money at the moment. Please try again in 2022/11/20",
       severity: "warning"
     }
-  )), /* @__PURE__ */ React101.createElement("div", { className: "mt-3" }, /* @__PURE__ */ React101.createElement("div", { className: "mb-1" }, "Sign ups"), /* @__PURE__ */ React101.createElement("div", { className: "rounded" }, /* @__PURE__ */ React101.createElement(
+  )), /* @__PURE__ */ React102.createElement("div", { className: "mt-3" }, /* @__PURE__ */ React102.createElement("div", { className: "mb-1" }, "Sign ups"), /* @__PURE__ */ React102.createElement("div", { className: "rounded" }, /* @__PURE__ */ React102.createElement(
     ReferralSignUpCard,
     {
       date: "2020/10/11 @ 9:45 pm",
       email: "zakher@sikka.io",
       amount: "3.4 SAR / Month"
     }
-  ), /* @__PURE__ */ React101.createElement(
+  ), /* @__PURE__ */ React102.createElement(
     ReferralSignUpCard,
     {
       date: "2022/10/11 @ 9:45 pm",
       email: "zakher@sikka.io",
       amount: "3.4 SAR / Month"
     }
-  ), /* @__PURE__ */ React101.createElement(
+  ), /* @__PURE__ */ React102.createElement(
     ReferralSignUpCard,
     {
       date: "2022/10/11 @ 9:45 pm",
       email: "zakher@sikka.io",
       amount: "3.4 SAR / Month"
     }
-  ), /* @__PURE__ */ React101.createElement(
+  ), /* @__PURE__ */ React102.createElement(
     ReferralSignUpCard,
     {
       date: "2022/10/11 @ 9:45 pm",
       email: "zakher@sikka.io",
       amount: "3.4 SAR / Month"
     }
-  ), /* @__PURE__ */ React101.createElement(
+  ), /* @__PURE__ */ React102.createElement(
     ReferralSignUpCard,
     {
       date: "2022/10/11 @ 9:45 pm",
@@ -10466,26 +10577,26 @@ var ReferralStats = ({
     }
   )))));
 };
-var NumberCard = (props) => /* @__PURE__ */ React101.createElement("div", { className: "w-full rounded border bg-background p-2" }, /* @__PURE__ */ React101.createElement("div", { className: "text-sm" }, props.title), /* @__PURE__ */ React101.createElement("div", { className: "font-bold" }, props.number));
-var ReferralSignUpCard = (props) => /* @__PURE__ */ React101.createElement("div", { className: "mb-3 rounded border-b bg-background p-2" }, /* @__PURE__ */ React101.createElement("div", { className: "text-xs" }, props.date), /* @__PURE__ */ React101.createElement("div", { className: "flex flex-row justify-between" }, /* @__PURE__ */ React101.createElement("div", null, props.email), /* @__PURE__ */ React101.createElement("div", null, props.amount)));
+var NumberCard = (props) => /* @__PURE__ */ React102.createElement("div", { className: "w-full rounded border bg-background p-2" }, /* @__PURE__ */ React102.createElement("div", { className: "text-sm" }, props.title), /* @__PURE__ */ React102.createElement("div", { className: "font-bold" }, props.number));
+var ReferralSignUpCard = (props) => /* @__PURE__ */ React102.createElement("div", { className: "mb-3 rounded border-b bg-background p-2" }, /* @__PURE__ */ React102.createElement("div", { className: "text-xs" }, props.date), /* @__PURE__ */ React102.createElement("div", { className: "flex flex-row justify-between" }, /* @__PURE__ */ React102.createElement("div", null, props.email), /* @__PURE__ */ React102.createElement("div", null, props.amount)));
 
 // src/blocks/Misc/NotFound.tsx
-import React102 from "react";
+import React103 from "react";
 var NotFound = ({
   variant = "contained",
   texts
 }) => {
-  return /* @__PURE__ */ React102.createElement(Card, null, /* @__PURE__ */ React102.createElement(CardContent, { headless: true }, /* @__PURE__ */ React102.createElement("div", { className: "flex flex-col items-center dark:text-white" }, /* @__PURE__ */ React102.createElement("div", { className: "text-center text-6xl font-bold " }, "404"), /* @__PURE__ */ React102.createElement("div", { className: "m-2 text-center text-xl font-bold " }, texts?.pageNotFound ?? "Page Not Found"), /* @__PURE__ */ React102.createElement("div", { className: "mb-4 text-center" }, texts?.ifLost ?? /* @__PURE__ */ React102.createElement(React102.Fragment, null, "If you're lost please contact us", " ", /* @__PURE__ */ React102.createElement("span", { className: "clickable-link" }, "help@sikka.io"))), /* @__PURE__ */ React102.createElement(Button, { className: "w-full" }, texts?.home ?? "Home"))));
+  return /* @__PURE__ */ React103.createElement(Card, null, /* @__PURE__ */ React103.createElement(CardContent, { headless: true }, /* @__PURE__ */ React103.createElement("div", { className: "flex flex-col items-center dark:text-white" }, /* @__PURE__ */ React103.createElement("div", { className: "text-center text-6xl font-bold " }, "404"), /* @__PURE__ */ React103.createElement("div", { className: "m-2 text-center text-xl font-bold " }, texts?.pageNotFound ?? "Page Not Found"), /* @__PURE__ */ React103.createElement("div", { className: "mb-4 text-center" }, texts?.ifLost ?? /* @__PURE__ */ React103.createElement(React103.Fragment, null, "If you're lost please contact us", " ", /* @__PURE__ */ React103.createElement("span", { className: "clickable-link" }, "help@sikka.io"))), /* @__PURE__ */ React103.createElement(Button, { className: "w-full" }, texts?.home ?? "Home"))));
 };
 
 // src/blocks/Misc/EmptyState.tsx
-import React103 from "react";
+import React104 from "react";
 var EmptyState = ({
   variant = "contained",
   texts,
   onActionClick
 }) => {
-  return /* @__PURE__ */ React103.createElement(Card, null, /* @__PURE__ */ React103.createElement(CardContent, { headless: true }, /* @__PURE__ */ React103.createElement("div", { className: "flex flex-col items-center justify-center text-center " }, /* @__PURE__ */ React103.createElement("div", { className: "flex h-10 w-10 flex-col items-center justify-center rounded-3xl bg-primary text-6xl font-bold text-primary-foreground" }, /* @__PURE__ */ React103.createElement(
+  return /* @__PURE__ */ React104.createElement(Card, null, /* @__PURE__ */ React104.createElement(CardContent, { headless: true }, /* @__PURE__ */ React104.createElement("div", { className: "flex flex-col items-center justify-center text-center " }, /* @__PURE__ */ React104.createElement("div", { className: "flex h-10 w-10 flex-col items-center justify-center rounded-3xl bg-primary text-6xl font-bold text-primary-foreground" }, /* @__PURE__ */ React104.createElement(
     "svg",
     {
       stroke: "currentColor",
@@ -10495,36 +10606,36 @@ var EmptyState = ({
       height: "0.35em",
       width: "0.35em"
     },
-    /* @__PURE__ */ React103.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
-  )), /* @__PURE__ */ React103.createElement("div", { className: "m-2 text-xl font-bold" }, texts?.youreCaughtUp ?? "You're all caught up"))), /* @__PURE__ */ React103.createElement(CardFooter, null, /* @__PURE__ */ React103.createElement(Button, { className: "w-full", onClick: () => onActionClick() }, texts?.actionText ?? "Go Home")));
+    /* @__PURE__ */ React104.createElement("path", { d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })
+  )), /* @__PURE__ */ React104.createElement("div", { className: "m-2 text-xl font-bold" }, texts?.youreCaughtUp ?? "You're all caught up"))), /* @__PURE__ */ React104.createElement(CardFooter, null, /* @__PURE__ */ React104.createElement(Button, { className: "w-full", onClick: () => onActionClick() }, texts?.actionText ?? "Go Home")));
 };
 
 // src/blocks/Misc/Testimonial.tsx
-import React104 from "react";
+import React105 from "react";
 var Testimonial = (props) => {
-  return /* @__PURE__ */ React104.createElement(Card, null, /* @__PURE__ */ React104.createElement(CardContent, { headless: true }, /* @__PURE__ */ React104.createElement("div", null, /* @__PURE__ */ React104.createElement("p", { className: "mb-4 max-w-sm" }, "The team at Sikka Software is simply amazing. The tech is easy to follow, easy to work with, and infinitely flexible. The solution opportunities created by Tines are endless.")), /* @__PURE__ */ React104.createElement("div", { className: "flex flex-row gap-4" }, /* @__PURE__ */ React104.createElement("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none" }, /* @__PURE__ */ React104.createElement("rect", { width: "48", height: "48", rx: "24", fill: "#45BE8B" }), /* @__PURE__ */ React104.createElement(
+  return /* @__PURE__ */ React105.createElement(Card, null, /* @__PURE__ */ React105.createElement(CardContent, { headless: true }, /* @__PURE__ */ React105.createElement("div", null, /* @__PURE__ */ React105.createElement("p", { className: "mb-4 max-w-sm" }, "The team at Sikka Software is simply amazing. The tech is easy to follow, easy to work with, and infinitely flexible. The solution opportunities created by Tines are endless.")), /* @__PURE__ */ React105.createElement("div", { className: "flex flex-row gap-4" }, /* @__PURE__ */ React105.createElement("svg", { width: "48", height: "48", viewBox: "0 0 48 48", fill: "none" }, /* @__PURE__ */ React105.createElement("rect", { width: "48", height: "48", rx: "24", fill: "#45BE8B" }), /* @__PURE__ */ React105.createElement(
     "path",
     {
       d: "M14.1412 22.4427L17.5803 16.5199C17.7671 16.1981 18.1112 16 18.4834 16H20.8581C21.653 16 22.1565 16.8528 21.7725 17.5488L19.3042 22.0225C19.2202 22.1747 19.1762 22.3458 19.1762 22.5196C19.1762 23.0879 19.6369 23.5486 20.2052 23.5486H21.5827C22.1594 23.5486 22.627 24.0162 22.627 24.5929V31.347C22.627 31.9237 22.1594 32.3913 21.5827 32.3913H15.0443C14.4676 32.3913 14 31.9237 14 31.347V22.9671C14 22.7829 14.0487 22.602 14.1412 22.4427Z",
       fill: "#FFFFFF"
     }
-  ), /* @__PURE__ */ React104.createElement(
+  ), /* @__PURE__ */ React105.createElement(
     "path",
     {
       d: "M25.356 22.4427L28.7951 16.5199C28.982 16.1981 29.326 16 29.6982 16H32.0729C32.8679 16 33.3713 16.8528 32.9873 17.5488L30.5191 22.0225C30.4351 22.1747 30.391 22.3458 30.391 22.5196C30.391 23.0879 30.8518 23.5486 31.4201 23.5486H32.7975C33.3743 23.5486 33.8418 24.0162 33.8418 24.5929V31.347C33.8418 31.9237 33.3743 32.3913 32.7975 32.3913H26.2592C25.6824 32.3913 25.2148 31.9237 25.2148 31.347V22.9671C25.2148 22.7829 25.2636 22.602 25.356 22.4427Z",
       fill: "#FFFFFF"
     }
-  )), /* @__PURE__ */ React104.createElement("span", { className: "border border-l " }), " ", /* @__PURE__ */ React104.createElement("div", null, /* @__PURE__ */ React104.createElement("strong", null, "Brent Lassi"), /* @__PURE__ */ React104.createElement("div", null, " Chief Information Security Officer")))));
+  )), /* @__PURE__ */ React105.createElement("span", { className: "border border-l " }), " ", /* @__PURE__ */ React105.createElement("div", null, /* @__PURE__ */ React105.createElement("strong", null, "Brent Lassi"), /* @__PURE__ */ React105.createElement("div", null, " Chief Information Security Officer")))));
 };
 
 // src/blocks/Misc/LeadGenerator.tsx
-import React105 from "react";
+import React106 from "react";
 var LeadGenerator = ({
   variant = "contained",
   texts,
   handleNewsletterSub
 }) => {
-  return /* @__PURE__ */ React105.createElement(Card, null, /* @__PURE__ */ React105.createElement(CardHeader, null, /* @__PURE__ */ React105.createElement(CardTitle, null, texts?.title), /* @__PURE__ */ React105.createElement(CardDescription, null, texts?.subtitle)), /* @__PURE__ */ React105.createElement(CardContent, null, /* @__PURE__ */ React105.createElement(
+  return /* @__PURE__ */ React106.createElement(Card, null, /* @__PURE__ */ React106.createElement(CardHeader, null, /* @__PURE__ */ React106.createElement(CardTitle, null, texts?.title), /* @__PURE__ */ React106.createElement(CardDescription, null, texts?.subtitle)), /* @__PURE__ */ React106.createElement(CardContent, null, /* @__PURE__ */ React106.createElement(
     "form",
     {
       className: "flex flex-row gap-2",
@@ -10533,36 +10644,36 @@ var LeadGenerator = ({
         handleNewsletterSub(e.target[0].value);
       }
     },
-    /* @__PURE__ */ React105.createElement(Input, { type: "email", name: "email", placeholder: "example@sikka.io" }),
-    /* @__PURE__ */ React105.createElement(Button, null, texts?.submit ?? "Submit")
+    /* @__PURE__ */ React106.createElement(Input, { type: "email", name: "email", placeholder: "example@sikka.io" }),
+    /* @__PURE__ */ React106.createElement(Button, null, texts?.submit ?? "Submit")
   )));
 };
 
 // src/blocks/Misc/Announcement.tsx
-import React106 from "react";
+import React107 from "react";
 var Announcement = ({
   variant = "contained",
   onActionClick,
   ...props
 }) => {
-  return /* @__PURE__ */ React106.createElement(Card, null, /* @__PURE__ */ React106.createElement(
+  return /* @__PURE__ */ React107.createElement(Card, null, /* @__PURE__ */ React107.createElement(
     CardContent,
     {
       headless: true,
       className: "flex flex-row items-center justify-between"
     },
-    /* @__PURE__ */ React106.createElement("div", { className: "flex flex-col items-start justify-center " }, /* @__PURE__ */ React106.createElement("span", { className: "text-lg font-bold" }, props.title), /* @__PURE__ */ React106.createElement("span", { className: "text-sm" }, props.subtitle)),
-    /* @__PURE__ */ React106.createElement(Button, { onClick: () => onActionClick() }, props.actionText)
+    /* @__PURE__ */ React107.createElement("div", { className: "flex flex-col items-start justify-center " }, /* @__PURE__ */ React107.createElement("span", { className: "text-lg font-bold" }, props.title), /* @__PURE__ */ React107.createElement("span", { className: "text-sm" }, props.subtitle)),
+    /* @__PURE__ */ React107.createElement(Button, { onClick: () => onActionClick() }, props.actionText)
   ));
 };
 
 // src/blocks/Misc/NoPermission.tsx
-import React107 from "react";
+import React108 from "react";
 var NoPermission = ({
   variant = "contained",
   texts
 }) => {
-  return /* @__PURE__ */ React107.createElement(Card, null, /* @__PURE__ */ React107.createElement(CardContent, { headless: true }, /* @__PURE__ */ React107.createElement("div", { className: "flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ React107.createElement("div", { className: "flex h-10 w-10 flex-col items-center justify-center rounded-3xl bg-primary text-6xl font-bold  text-primary-foreground" }, /* @__PURE__ */ React107.createElement(
+  return /* @__PURE__ */ React108.createElement(Card, null, /* @__PURE__ */ React108.createElement(CardContent, { headless: true }, /* @__PURE__ */ React108.createElement("div", { className: "flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ React108.createElement("div", { className: "flex h-10 w-10 flex-col items-center justify-center rounded-3xl bg-primary text-6xl font-bold  text-primary-foreground" }, /* @__PURE__ */ React108.createElement(
     "svg",
     {
       stroke: "currentColor",
@@ -10572,8 +10683,8 @@ var NoPermission = ({
       height: "0.35em",
       width: "0.35em"
     },
-    /* @__PURE__ */ React107.createElement("path", { d: "M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z" })
-  ), " "), /* @__PURE__ */ React107.createElement("div", { className: "m-2 text-xl font-bold" }, texts?.title ?? "You don't have permission"), /* @__PURE__ */ React107.createElement("div", null, texts?.subtitle ?? "If you think this is a problem please contact your administrator or our customer support"))));
+    /* @__PURE__ */ React108.createElement("path", { d: "M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z" })
+  ), " "), /* @__PURE__ */ React108.createElement("div", { className: "m-2 text-xl font-bold" }, texts?.title ?? "You don't have permission"), /* @__PURE__ */ React108.createElement("div", null, texts?.subtitle ?? "If you think this is a problem please contact your administrator or our customer support"))));
 };
 
 // src/hooks/useHover.ts
@@ -10600,6 +10711,13 @@ export {
   ComparingPlans,
   ConfirmationPage,
   CreditCardForm,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
   DragDropImages,
   DraggableCard,
   DropdownMenu,