@sikka/hawa 0.30.23-next → 0.30.25-next

package/dist/index.mjs

@@ -657,6 +657,9 @@ var DropdownMenu = ({
     default: "hawa-px-2 hawa-py-3 ",
     sm: "hawa-text-xs hawa-px-1.5 hawa-py-1.5 "
   };
+  let [values, setValues] = React5.useState(
+    items.map((item) => item.currentOption)
+  );
   return /* @__PURE__ */ React5.createElement(
     DropdownMenuRoot,
     {
@@ -684,11 +687,38 @@ var DropdownMenu = ({
       },
       header && header,
       items && items.map((item, index) => {
+        var _a;
         const ItemLinkComponent = item.slug ? LinkComponent : "a";
         if (item.itemType === "separator") {
           return /* @__PURE__ */ React5.createElement(DropdownMenuSeparator, { key: index });
         } else if (item.itemType === "label") {
           return /* @__PURE__ */ React5.createElement(DropdownMenuLabel, { key: index }, item.label);
+        } else if (item.itemType === "radio") {
+          let dd = item.currentOption;
+          return /* @__PURE__ */ React5.createElement(DropdownMenuSub, { key: index }, /* @__PURE__ */ React5.createElement(
+            DropdownMenuSubTrigger,
+            {
+              dir: direction,
+              className: cn(sizeStyles2[size])
+            },
+            item.icon && item.icon,
+            item.label && item.label
+          ), /* @__PURE__ */ React5.createElement(DropdownMenuSubContent, null, /* @__PURE__ */ React5.createElement(
+            DropdownMenuRadioGroup,
+            {
+              value: values[index],
+              onValueChange: (e) => {
+                let newValues = [...values];
+                newValues[index] = e;
+                setValues(newValues);
+                console.log("changing to ", e);
+                if (item.onOptionChange) {
+                  item.onOptionChange(e);
+                }
+              }
+            },
+            (_a = item.options) == null ? void 0 : _a.map((opt, i) => /* @__PURE__ */ React5.createElement(DropdownMenuRadioItem, { key: i, value: opt.value }, opt.label))
+          )));
         } else if (item.itemType === "custom") {
           return /* @__PURE__ */ React5.createElement("div", { key: index }, item.content);
         } else {
@@ -1949,7 +1979,7 @@ DialogContent.displayName = DialogPrimitive.Content.displayName;
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 // elements/alert/Alert.tsx
-import React16, { useRef, useState as useState2, useEffect as useEffect2 } from "react";
+import React16, { useRef, useState as useState3, useEffect as useEffect2 } from "react";
 
 // elements/button/Button.tsx
 import * as React15 from "react";
@@ -2035,7 +2065,7 @@ var Alert = ({
   ...props
 }) => {
   const alertRef = useRef(null);
-  const [closed, setClosed] = useState2(false);
+  const [closed, setClosed] = useState3(false);
   useEffect2(() => {
     if (duration) {
       const timeoutHide = setTimeout(() => {
@@ -2936,10 +2966,10 @@ var DataTable = ({
 };
 
 // elements/backToTop/BackToTop.tsx
-import React23, { useState as useState4, useEffect as useEffect4, useRef as useRef3 } from "react";
+import React23, { useState as useState5, useEffect as useEffect4, useRef as useRef3 } from "react";
 var BackToTop = ({ ...props }) => {
-  const [visible, setVisible] = useState4(false);
-  const [rect, _setRect] = useState4(null);
+  const [visible, setVisible] = useState5(false);
+  const [rect, _setRect] = useState5(null);
   const self = useRef3(null);
   const _rect = useRef3(rect);
   const setRect = (data) => {
@@ -3033,7 +3063,7 @@ var BackToTop = ({ ...props }) => {
 };
 
 // elements/radio/Radio.tsx
-import React24, { useState as useState5, useRef as useRef4, useEffect as useEffect5, forwardRef as forwardRef14 } from "react";
+import React24, { useState as useState6, useRef as useRef4, useEffect as useEffect5, forwardRef as forwardRef14 } from "react";
 var Radio = forwardRef14(
   ({
     design = "default",
@@ -3048,7 +3078,7 @@ var Radio = forwardRef14(
     ...props
   }, ref) => {
     var _a, _b, _c;
-    const [selectedOption, setSelectedOption] = useState5(
+    const [selectedOption, setSelectedOption] = useState6(
       props.defaultValue || props.value
     );
     let activeTabStyle = "hawa-inline-block hawa-w-full hawa-text-primary-foreground hawa-bg-primary  hawa-active dark:hawa-bg-primary";
@@ -3544,46 +3574,55 @@ var Combobox = React27.forwardRef(
             }
           ),
           /* @__PURE__ */ React27.createElement(CommandEmpty, null, ((_c = props.texts) == null ? void 0 : _c.noItems) || "No items found."),
-          /* @__PURE__ */ React27.createElement(CommandList, null, /* @__PURE__ */ React27.createElement(CommandGroup, { className: "hawa-max-h-[200px] hawa-overflow-y-scroll" }, data.map((item, i) => /* @__PURE__ */ React27.createElement(
-            CommandItem,
+          /* @__PURE__ */ React27.createElement(CommandList, null, /* @__PURE__ */ React27.createElement(
+            CommandGroup,
             {
-              key: i,
-              onSelect: () => {
-                const newValue = getProperty(item, valueKey);
-                setValue(
-                  newValue === value ? "" : newValue
-                );
-                if (props.onChange) {
-                  props.onChange(
+              className: cn(
+                "hawa-max-h-[200px]",
+                data.length > 0 && "hawa-overflow-y-scroll"
+              )
+            },
+            data.map((item, i) => /* @__PURE__ */ React27.createElement(
+              CommandItem,
+              {
+                key: i,
+                onSelect: () => {
+                  const newValue = getProperty(item, valueKey);
+                  setValue(
                     newValue === value ? "" : newValue
                   );
+                  if (props.onChange) {
+                    props.onChange(
+                      newValue === value ? "" : newValue
+                    );
+                  }
+                  setOpen(false);
                 }
-                setOpen(false);
-              }
-            },
-            /* @__PURE__ */ React27.createElement(
-              "svg",
-              {
-                "aria-label": "Check Icon",
-                xmlns: "http://www.w3.org/2000/svg",
-                width: "24",
-                height: "24",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                className: cn(
-                  "hawa-icon",
-                  value === getProperty(item, valueKey) ? "hawa-opacity-100" : "hawa-opacity-0"
-                ),
-                style: { marginInlineEnd: "0.5rem" }
               },
-              /* @__PURE__ */ React27.createElement("polyline", { points: "20 6 9 17 4 12" })
-            ),
-            renderOption ? renderOption(item) : getProperty(item, labelKey)
-          ))))
+              /* @__PURE__ */ React27.createElement(
+                "svg",
+                {
+                  "aria-label": "Check Icon",
+                  xmlns: "http://www.w3.org/2000/svg",
+                  width: "24",
+                  height: "24",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  className: cn(
+                    "hawa-icon",
+                    value === getProperty(item, valueKey) ? "hawa-opacity-100" : "hawa-opacity-0"
+                  ),
+                  style: { marginInlineEnd: "0.5rem" }
+                },
+                /* @__PURE__ */ React27.createElement("polyline", { points: "20 6 9 17 4 12" })
+              ),
+              renderOption ? renderOption(item) : getProperty(item, labelKey)
+            ))
+          ))
         )
       ))
     );
@@ -3649,7 +3688,7 @@ var Textarea = React28.forwardRef(
 Textarea.displayName = "Textarea";
 
 // elements/fileDropzone/FileDropzone.tsx
-import React29, { useEffect as useEffect6, useState as useState7 } from "react";
+import React29, { useEffect as useEffect6, useState as useState8 } from "react";
 import { useDropzone } from "react-dropzone";
 import clsx2 from "clsx";
 var FileDropzone = ({
@@ -3671,8 +3710,8 @@ var FileDropzone = ({
   privacyLink
 }) => {
   var _a, _b, _c, _d, _e, _f;
-  const [cmp, setCmp] = useState7(0);
-  const [max, setMax] = useState7(0);
+  const [cmp, setCmp] = useState8(0);
+  const [max, setMax] = useState8(0);
   const {
     getRootProps,
     getInputProps,
@@ -4430,24 +4469,39 @@ Progress.displayName = ProgressPrimitive.Root.displayName;
 import React36 from "react";
 var Breadcrumb = ({
   breadcrumbLinks,
-  separator = ">"
+  separator = ">",
+  size = "normal"
 }) => {
-  return /* @__PURE__ */ React36.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-text-sm" }, breadcrumbLinks.map((singleBreadcrumbLink, index) => /* @__PURE__ */ React36.createElement(
+  const textStyles = {
+    normal: "",
+    small: "hawa-text-sm",
+    xs: "hawa-text-xs"
+  };
+  return /* @__PURE__ */ React36.createElement(
     "div",
     {
-      key: index,
-      className: "hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-2"
+      className: cn(
+        "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2 hawa-text-sm",
+        textStyles[size]
+      )
     },
-    /* @__PURE__ */ React36.createElement(
-      "a",
+    breadcrumbLinks.map((singleBreadcrumbLink, index) => /* @__PURE__ */ React36.createElement(
+      "div",
       {
-        href: singleBreadcrumbLink.href,
-        className: index + 1 === breadcrumbLinks.length ? "hawa-pointer-events-none" : "hawa-underline-offset-4 hawa-transition-all hover:hawa-text-primary hover:hawa-underline hover:hawa-decoration-2"
+        key: index,
+        className: "hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-2"
       },
-      singleBreadcrumbLink.label
-    ),
-    index != breadcrumbLinks.length - 1 ? typeof separator == "string" ? /* @__PURE__ */ React36.createElement("div", null, separator) : /* @__PURE__ */ React36.createElement("div", null, separator) : null
-  )));
+      /* @__PURE__ */ React36.createElement(
+        "a",
+        {
+          href: singleBreadcrumbLink.href,
+          className: index + 1 === breadcrumbLinks.length ? "hawa-pointer-events-none" : "hawa-underline-offset-4 hawa-transition-all hover:hawa-text-primary hover:hawa-underline hover:hawa-decoration-2"
+        },
+        singleBreadcrumbLink.label
+      ),
+      index != breadcrumbLinks.length - 1 ? typeof separator == "string" ? /* @__PURE__ */ React36.createElement("div", null, separator) : /* @__PURE__ */ React36.createElement("div", null, separator) : null
+    ))
+  );
 };
 
 // elements/appStores/AppStores.tsx
@@ -4487,7 +4541,7 @@ var AppStores = (props) => {
 };
 
 // elements/badge/Badge.tsx
-import React38, { useEffect as useEffect8, useState as useState9, useRef as useRef7 } from "react";
+import React38, { useEffect as useEffect8, useState as useState10, useRef as useRef7 } from "react";
 var Badge = ({
   anchor,
   position = "right",
@@ -4495,7 +4549,7 @@ var Badge = ({
   text,
   className
 }) => {
-  const [badgePosition, setBadgePosition] = useState9(null);
+  const [badgePosition, setBadgePosition] = useState10(null);
   const indicatorRef = useRef7(null);
   const sizeStyles2 = {
     small: { top: 4, left: 6, right: 7, classes: "hawa-w-3 hawa-h-3" },
@@ -4564,7 +4618,7 @@ var BadgedComponent = ({
 };
 
 // elements/phoneInput/PhoneInput.tsx
-import React39, { useState as useState10, useRef as useRef8, useEffect as useEffect9 } from "react";
+import React39, { useState as useState11, useRef as useRef8, useEffect as useEffect9 } from "react";
 
 // countries.ts
 var countries = [
@@ -6261,8 +6315,8 @@ var countries_default = countries;
 
 // elements/phoneInput/PhoneInput.tsx
 var PhoneInput = ({ labelProps, ...props }) => {
-  const [phoneNumber, setPhoneNumber] = useState10("");
-  const [countryCode, setCountryCode] = useState10(props.preferredCountry);
+  const [phoneNumber, setPhoneNumber] = useState11("");
+  const [countryCode, setCountryCode] = useState11(props.preferredCountry);
   const inputRef = useRef8(null);
   useEffect9(() => {
     var _a;
@@ -6324,7 +6378,7 @@ var PhoneInput = ({ labelProps, ...props }) => {
 };
 
 // elements/pinInput/PinInput.tsx
-import React40, { useEffect as useEffect10, useState as useState11 } from "react";
+import React40, { useEffect as useEffect10, useState as useState12 } from "react";
 var PinInput = ({
   label,
   icon,
@@ -6334,7 +6388,7 @@ var PinInput = ({
   inputProps,
   ...props
 }) => {
-  const [pin, setPin] = useState11(Array.from(Array(digits)));
+  const [pin, setPin] = useState12(Array.from(Array(digits)));
   const handleKeyDown = (e, index) => {
     let backTo = 0;
     if (e.key === "Backspace") {
@@ -6457,7 +6511,7 @@ ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // elements/colorPicker/ColorPicker.tsx
 import React43, {
-  useState as useState12,
+  useState as useState13,
   useEffect as useEffect11
 } from "react";
 var ColorPicker = ({
@@ -6470,7 +6524,7 @@ var ColorPicker = ({
   preview = false,
   ...props
 }) => {
-  const [selectedColor, setSelectedColor] = useState12(props.color);
+  const [selectedColor, setSelectedColor] = useState13(props.color);
   useEffect11(() => {
     if (selectedColor && selectedColor[0] !== "#") {
       setSelectedColor(`#${selectedColor}`);
@@ -6753,7 +6807,7 @@ var Pagination = ({
 };
 
 // elements/passwordInput/PasswordInput.tsx
-import React49, { useEffect as useEffect12, useState as useState13 } from "react";
+import React49, { useEffect as useEffect12, useState as useState14 } from "react";
 
 // icons/Emojis.tsx
 import React46 from "react";
@@ -6969,15 +7023,15 @@ var PasswordInput = ({
   hidePopover,
   ...props
 }) => {
-  const [inputValue, setInputValue] = useState13("");
-  const [isInputFocused, setIsInputFocused] = useState13(false);
-  const [currentStr, setCurrentStr] = useState13(0);
-  const [passwordVisible, setPasswordVisible] = useState13(false);
-  const [lengthCriteriaMet, setLengthCriteriaMet] = useState13(false);
-  const [numberCriteriaMet, setNumberCriteriaMet] = useState13(false);
-  const [specialCharCriteriaMet, setSpecialCharCriteriaMet] = useState13(false);
-  const [lowercaseCriteriaMet, setLowercaseCriteriaMet] = useState13(false);
-  const [uppercaseCriteriaMet, setUppercaseCriteriaMet] = useState13(false);
+  const [inputValue, setInputValue] = useState14("");
+  const [isInputFocused, setIsInputFocused] = useState14(false);
+  const [currentStr, setCurrentStr] = useState14(0);
+  const [passwordVisible, setPasswordVisible] = useState14(false);
+  const [lengthCriteriaMet, setLengthCriteriaMet] = useState14(false);
+  const [numberCriteriaMet, setNumberCriteriaMet] = useState14(false);
+  const [specialCharCriteriaMet, setSpecialCharCriteriaMet] = useState14(false);
+  const [lowercaseCriteriaMet, setLowercaseCriteriaMet] = useState14(false);
+  const [uppercaseCriteriaMet, setUppercaseCriteriaMet] = useState14(false);
   useEffect12(() => {
     const calculateStrength = () => {
       let strengthScore = 0;
@@ -7179,12 +7233,12 @@ var Separator2 = ({
 );
 
 // elements/scrollIndicator/ScrollIndicator.tsx
-import React53, { useState as useState14, useEffect as useEffect13 } from "react";
+import React53, { useState as useState15, useEffect as useEffect13 } from "react";
 var ScrollIndicator = ({
   anchor,
   inContainer = false
 }) => {
-  const [scrollPercentage, setScrollPercentage] = useState14(0);
+  const [scrollPercentage, setScrollPercentage] = useState15(0);
   const onScroll = () => {
     const scrollElement = anchor.current;
     if (scrollElement) {
@@ -7220,15 +7274,15 @@ var ScrollIndicator = ({
 };
 
 // elements/codeBlock/CodeBlock.tsx
-import React54, { useState as useState16 } from "react";
+import React54, { useState as useState17 } from "react";
 import { Highlight, themes, Prism } from "prism-react-renderer";
 
 // hooks/useClipboard.ts
-import { useState as useState15 } from "react";
+import { useState as useState16 } from "react";
 function useClipboard({ timeout = 2e3 } = {}) {
-  const [error, setError] = useState15(null);
-  const [copied, setCopied] = useState15(false);
-  const [copyTimeout, setCopyTimeout] = useState15(null);
+  const [error, setError] = useState16(null);
+  const [copied, setCopied] = useState16(false);
+  const [copyTimeout, setCopyTimeout] = useState16(null);
   const handleCopyResult = (value) => {
     clearTimeout(copyTimeout);
     setCopyTimeout(setTimeout(() => setCopied(false), timeout));
@@ -7280,7 +7334,7 @@ var CodeBlock = ({
   ...props
 }) => {
   const clipboard = useClipboard();
-  const [selectedTab, setSelectedTab] = useState16(0);
+  const [selectedTab, setSelectedTab] = useState17(0);
   const theme = themes.oceanicNext;
   let widthStyles = {
     full: "hawa-w-full",
@@ -7408,7 +7462,7 @@ var CodeBlock = ({
 };
 
 // elements/carousel/Carousel.tsx
-import React55, { useEffect as useEffect14, useState as useState17 } from "react";
+import React55, { useEffect as useEffect14, useState as useState18 } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 var Carousel = ({
   items,
@@ -7424,7 +7478,7 @@ var Carousel = ({
     direction,
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
-  const [selectedIndex, setSelectedIndex] = useState17(0);
+  const [selectedIndex, setSelectedIndex] = useState18(0);
   useEffect14(() => {
     function selectHandler() {
       const index = emblaApi == null ? void 0 : emblaApi.selectedScrollSnap();
@@ -7739,14 +7793,14 @@ function Toaster(props) {
 }
 
 // elements/destroyableCard/DestroyableCard.tsx
-import React59, { useRef as useRef9, useState as useState18 } from "react";
+import React59, { useRef as useRef9, useState as useState19 } from "react";
 var DestroyableCard = ({
   position = "bottom-right",
   fixed,
   direction,
   ...props
 }) => {
-  const [closed, setClosed] = useState18(false);
+  const [closed, setClosed] = useState19(false);
   const popUpRef = useRef9(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4 hawa-bottom-4",
@@ -7813,7 +7867,7 @@ var DestroyableCard = ({
 };
 
 // elements/interfaceSettings/InterfaceSettings.tsx
-import React60, { useState as useState19 } from "react";
+import React60, { useState as useState20 } from "react";
 var InterfaceSettings = ({
   orientation = "horizontal",
   width = "default",
@@ -7821,8 +7875,8 @@ var InterfaceSettings = ({
   handleLanguage,
   ...props
 }) => {
-  const [color, setColor] = useState19(props.currentColorMode);
-  const [language, setLanguage] = useState19(props.currentLanguage);
+  const [color, setColor] = useState20(props.currentColorMode);
+  const [language, setLanguage] = useState20(props.currentLanguage);
   let orientationStyle = {
     horizontal: "hawa-flex hawa-flex-row hawa-justify-between",
     vertical: "hawa-flex hawa-flex-col hawa-items-center hawa-gap-2"
@@ -8163,7 +8217,7 @@ var Copyrights = (props) => {
 };
 
 // layout/navbar/Navbar.tsx
-import React65, { useState as useState20 } from "react";
+import React65, { useState as useState21 } from "react";
 
 // elements/collapsible/Collapsible.tsx
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
@@ -8179,7 +8233,7 @@ var Navbar = ({
   ...props
 }) => {
   var _a, _b;
-  const [isOpen, setIsOpen] = useState20(false);
+  const [isOpen, setIsOpen] = useState21(false);
   return /* @__PURE__ */ React65.createElement("nav", { className: " hawa-sticky hawa-top-2 hawa-transition-all" }, /* @__PURE__ */ React65.createElement(
     Collapsible,
     {
@@ -8283,7 +8337,7 @@ var Navbar = ({
 };
 
 // layout/appLayout/AppLayout.tsx
-import React66, { useEffect as useEffect15, useRef as useRef10, useState as useState21 } from "react";
+import React66, { useEffect as useEffect15, useRef as useRef10, useState as useState22 } from "react";
 var AppLayout = ({
   profileMenuWidth = "default",
   DrawerFooterActions,
@@ -8312,9 +8366,9 @@ var AppLayout = ({
   };
   const ref = useRef10(null);
   const isRTL = direction === "rtl";
-  const [openedSidebarItem, setOpenedSidebarItem] = useState21("");
-  const [size, setSize] = useState21(1200);
-  const [openSideMenu, setOpenSideMenu] = useState21(true);
+  const [openedSidebarItem, setOpenedSidebarItem] = useState22("");
+  const [size, setSize] = useState22(1200);
+  const [openSideMenu, setOpenSideMenu] = useState22(true);
   const drawerSizeCondition = size > 600 ? drawerSizeStyle[keepOpen ? "opened" : "closed"][drawerSize] : 0;
   useEffect15(() => {
     if (typeof window !== "undefined") {
@@ -8950,9 +9004,9 @@ var MenubarShortcut = ({
 MenubarShortcut.displayname = "MenubarShortcut";
 
 // layout/appTabs/AppTabs.tsx
-import React69, { useState as useState22 } from "react";
+import React69, { useState as useState23 } from "react";
 var AppTabs = ({ tabs, className }) => {
-  const [selectedIndex, setSelectedIndex] = useState22(0);
+  const [selectedIndex, setSelectedIndex] = useState23(0);
   return /* @__PURE__ */ React69.createElement(
     "div",
     {
@@ -8994,12 +9048,12 @@ var AppTabs = ({ tabs, className }) => {
 };
 
 // layout/docsLayout/DocsLayout.tsx
-import React72, { useEffect as useEffect17, useRef as useRef11, useState as useState24 } from "react";
+import React72, { useEffect as useEffect17, useRef as useRef11, useState as useState25 } from "react";
 
 // hooks/useBreakpoint.ts
-import { useState as useState23, useEffect as useEffect16 } from "react";
+import { useState as useState24, useEffect as useEffect16 } from "react";
 var useBreakpoint = () => {
-  const [breakpoint, setBreakpoint] = useState23(null);
+  const [breakpoint, setBreakpoint] = useState24(null);
   useEffect16(() => {
     if (typeof window !== "undefined") {
       const resize = () => {
@@ -9109,8 +9163,8 @@ var DocsLayout = ({
   if (typeof window == "undefined") {
     size = 1200;
   }
-  const [currentPage, setCurrentPage] = useState24("Introduction");
-  const [openSideMenu, setOpenSideMenu] = useState24(true);
+  const [currentPage, setCurrentPage] = useState25("Introduction");
+  const [openSideMenu, setOpenSideMenu] = useState25(true);
   useEffect17(() => {
     const handleClickOutside = (event) => {
       if (ref.current && !ref.current.contains(event.target) && !openSideMenu) {
@@ -9380,7 +9434,7 @@ var AuthButtons = (props) => {
 };
 
 // blocks/auth/LoginForm.tsx
-import React74, { useState as useState25 } from "react";
+import React74, { useState as useState26 } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { parsePhoneNumber } from "libphonenumber-js";
@@ -9392,7 +9446,7 @@ var LoginForm = ({
   ...props
 }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
-  const [passwordVisible, setPasswordVisible] = useState25(false);
+  const [passwordVisible, setPasswordVisible] = useState26(false);
   const thirdPartyAuthTexts = {
     continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
     continueWithTwitter: texts == null ? void 0 : texts.continueWithTwitter,
@@ -9697,7 +9751,7 @@ var LoginForm = ({
 };
 
 // blocks/auth/RegisterForm.tsx
-import React75, { useState as useState26 } from "react";
+import React75, { useState as useState27 } from "react";
 import { Controller as Controller2, FormProvider, useForm as useForm2 } from "react-hook-form";
 import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
 import * as z2 from "zod";
@@ -9709,7 +9763,7 @@ var RegisterForm = ({
   ...props
 }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h;
-  const [passwordVisible, setPasswordVisible] = useState26(false);
+  const [passwordVisible, setPasswordVisible] = useState27(false);
   const thirdPartyAuthTexts = {
     continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
     continueWithTwitter: texts == null ? void 0 : texts.continueWithTwitter,
@@ -10146,7 +10200,7 @@ var CheckEmail = ({ texts, handleResend }) => {
 };
 
 // blocks/auth/NewPassword.tsx
-import React78, { useState as useState27 } from "react";
+import React78, { useState as useState28 } from "react";
 import { Controller as Controller3, useForm as useForm3 } from "react-hook-form";
 import { zodResolver as zodResolver3 } from "@hookform/resolvers/zod";
 import * as z3 from "zod";
@@ -10164,7 +10218,7 @@ var NewPasswordForm = ({ texts, ...props }) => {
   const { handleSubmit, control, formState } = useForm3({
     resolver: zodResolver3(formSchema)
   });
-  const [matchError, setMatchError] = useState27(false);
+  const [matchError, setMatchError] = useState28(false);
   return /* @__PURE__ */ React78.createElement(Card, { dir: props.direction }, matchError && /* @__PURE__ */ React78.createElement(Alert, { text: (_g = texts == null ? void 0 : texts.confirm) == null ? void 0 : _g.dontMatch, severity: "error" }), props.passwordChanged ? /* @__PURE__ */ React78.createElement(CardContent, { headless: true }, /* @__PURE__ */ React78.createElement("div", { className: "hawa-text-center" }, texts == null ? void 0 : texts.passwordChanged)) : /* @__PURE__ */ React78.createElement(
     "form",
     {
@@ -10304,7 +10358,7 @@ var ResetPasswordForm = ({
 };
 
 // blocks/auth/CodeConfirmation.tsx
-import React80, { useEffect as useEffect18, useState as useState28 } from "react";
+import React80, { useEffect as useEffect18, useState as useState29 } from "react";
 import { Controller as Controller5, useForm as useForm5 } from "react-hook-form";
 import { zodResolver as zodResolver5 } from "@hookform/resolvers/zod";
 import * as z5 from "zod";
@@ -10316,9 +10370,9 @@ var CodeConfirmation = (props) => {
   const { handleSubmit, control, formState, setValue } = useForm5({
     resolver: zodResolver5(formSchema)
   });
-  const [resendTimer, setResendTimer] = useState28(null);
-  const [remainingTime, setRemainingTime] = useState28(0);
-  const [showResendTimer, setShowResendTimer] = useState28(false);
+  const [resendTimer, setResendTimer] = useState29(null);
+  const [remainingTime, setRemainingTime] = useState29(0);
+  const [showResendTimer, setShowResendTimer] = useState29(false);
   const startResendTimer = () => {
     if (resendTimer !== null) {
       clearInterval(resendTimer);
@@ -10403,7 +10457,7 @@ var CodeConfirmation = (props) => {
 };
 
 // blocks/feedback/UserReferralSource.tsx
-import React81, { useRef as useRef12, useState as useState29 } from "react";
+import React81, { useRef as useRef12, useState as useState30 } from "react";
 import { Controller as Controller6, useForm as useForm6 } from "react-hook-form";
 import { zodResolver as zodResolver6 } from "@hookform/resolvers/zod";
 import * as z6 from "zod";
@@ -10413,7 +10467,7 @@ var UserReferralSource = ({
   ...props
 }) => {
   var _a, _b;
-  const [closed, setClosed] = useState29(false);
+  const [closed, setClosed] = useState30(false);
   const popUpRef = useRef12(null);
   const formSchema = z6.object({
     source: z6.string({ required_error: (_a = props.texts) == null ? void 0 : _a.pleaseSelectOption }),
@@ -10561,15 +10615,15 @@ var UserReferralSource = ({
 };
 
 // blocks/feedback/FeedbackRating.tsx
-import React82, { useEffect as useEffect19, useRef as useRef13, useState as useState30 } from "react";
+import React82, { useEffect as useEffect19, useRef as useRef13, useState as useState31 } from "react";
 var FeedbackRating = ({
   position = "bottom-right",
   ...props
 }) => {
-  const [closed, setClosed] = useState30(false);
-  const [answered, setAnswered] = useState30(false);
-  const [clickedOption, setClickedOption] = useState30(null);
-  const [closingTimer, setClosingTimer] = useState30(5);
+  const [closed, setClosed] = useState31(false);
+  const [answered, setAnswered] = useState31(false);
+  const [clickedOption, setClickedOption] = useState31(null);
+  const [closingTimer, setClosingTimer] = useState31(5);
   const popUpRef = useRef13(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4",
@@ -10675,12 +10729,12 @@ var FeedbackRating = ({
 };
 
 // blocks/feedback/FeedbackEmoji.tsx
-import React83, { useState as useState31 } from "react";
+import React83, { useState as useState32 } from "react";
 var FeedbackEmoji = (props) => {
-  const [selectedEmoji, setSelectedEmoji] = useState31(null);
-  const [loadingSubmit, setLoadingSubmit] = useState31(false);
-  const [feedbackText, setFeedbackText] = useState31("");
-  const [helperText, setHelperText] = useState31(false);
+  const [selectedEmoji, setSelectedEmoji] = useState32(null);
+  const [loadingSubmit, setLoadingSubmit] = useState32(false);
+  const [feedbackText, setFeedbackText] = useState32("");
+  const [helperText, setHelperText] = useState32(false);
   let emojis = [
     { icon: /* @__PURE__ */ React83.createElement(VeryGoodEmoji, null), value: "very-good" },
     { icon: /* @__PURE__ */ React83.createElement(GoodEmoji, null), value: "good" },
@@ -11243,9 +11297,9 @@ var ContactForm = ({
 import React98 from "react";
 
 // blocks/cards/ActionCard.tsx
-import React93, { useState as useState32 } from "react";
+import React93, { useState as useState33 } from "react";
 var ActionCard = (props) => {
-  const [hovered, setHovered] = useState32(false);
+  const [hovered, setHovered] = useState33(false);
   return /* @__PURE__ */ React93.createElement("div", { className: "hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-gap-1" }, /* @__PURE__ */ React93.createElement(
     "div",
     {
@@ -11282,13 +11336,13 @@ var ActionCard = (props) => {
 };
 
 // blocks/cards/AdCard.tsx
-import React94, { useState as useState33, useEffect as useEffect20, useRef as useRef14 } from "react";
+import React94, { useState as useState34, useEffect as useEffect20, useRef as useRef14 } from "react";
 var AdCard = ({
   orientation = "vertical",
   ...props
 }) => {
   const adRef = useRef14(null);
-  const [closed, setClosed] = useState33(false);
+  const [closed, setClosed] = useState34(false);
   let duration = 0;
   useEffect20(() => {
     if (duration) {
@@ -11478,7 +11532,7 @@ var PricingCard = ({
 };
 
 // blocks/cards/ItemCard.tsx
-import React96, { useEffect as useEffect21, useState as useState34 } from "react";
+import React96, { useEffect as useEffect21, useState as useState35 } from "react";
 var ItemCard = ({
   actions,
   counts,
@@ -11507,7 +11561,7 @@ var ItemCard = ({
     )
   };
   let headerActionsButtonStyle = "hawa-inline-block hawa-rounded hawa-p-1 hawa-text-sm hawa-text-gray-500 hover:hawa-bg-gray-100 focus:hawa-outline-none focus:hawa-ring-4 focus:hawa-ring-gray-200 dark:hawa-text-gray-400 dark:hover:hawa-bg-gray-700 dark:focus:hawa-ring-gray-700";
-  const [openActionHeader, setOpenActionHeader] = useState34(false);
+  const [openActionHeader, setOpenActionHeader] = useState35(false);
   function handleOpenActionHeader(e) {
     e.stopPropagation();
     setOpenActionHeader(!openActionHeader);
@@ -11839,9 +11893,9 @@ var ComparingPlans = (props) => {
 };
 
 // blocks/pricing/HorizontalPricing.tsx
-import React100, { useState as useState35 } from "react";
+import React100, { useState as useState36 } from "react";
 var HorizontalPricing = (props) => {
-  const [selectedCard, setSelectedCard] = useState35("");
+  const [selectedCard, setSelectedCard] = useState36("");
   let data = [
     { title: "basic", price: "$49", cycle: "/mo" },
     { title: "business", price: "$99", cycle: "/mo" },
@@ -11959,10 +12013,10 @@ import { useEffect as useEffect22, useLayoutEffect } from "react";
 var useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect22;
 
 // hooks/useDiscloser.ts
-import { useState as useState36 } from "react";
+import { useState as useState37 } from "react";
 
 // hooks/useHover.ts
-import { useEffect as useEffect23, useRef as useRef15, useState as useState37 } from "react";
+import { useEffect as useEffect23, useRef as useRef15, useState as useState38 } from "react";
 
 // hooks/useToast.ts
 import * as React104 from "react";
@@ -12069,10 +12123,10 @@ function useToast() {
 }
 
 // hooks/useCarousel.ts
-import { useState as useState39, useRef as useRef16 } from "react";
+import { useState as useState40, useRef as useRef16 } from "react";
 
 // hooks/useDialogCarousel.ts
-import { useEffect as useEffect25, useState as useState40 } from "react";
+import { useEffect as useEffect25, useState as useState41 } from "react";
 import AutoHeight from "embla-carousel-auto-height";
 import useEmblaCarousel2 from "embla-carousel-react";
 var useDialogCarousel = (options) => {
@@ -12080,7 +12134,7 @@ var useDialogCarousel = (options) => {
     { loop: false, watchDrag: false, startIndex: 0, ...options },
     [AutoHeight({ destroyHeight: "fit", active: true })]
   );
-  const [canScrollPrev, setCanScrollPrev] = useState40(false);
+  const [canScrollPrev, setCanScrollPrev] = useState41(false);
   const checkCanScrollPrev = () => {
     if (emblaApi) {
       setCanScrollPrev(emblaApi.canScrollPrev());
@@ -12115,10 +12169,10 @@ var useDialogCarousel = (options) => {
 };
 
 // hooks/useDialogSteps.ts
-import { useState as useState41, useEffect as useEffect26, useRef as useRef17 } from "react";
+import { useState as useState42, useEffect as useEffect26, useRef as useRef17 } from "react";
 var useMultiStepDialog = (initialStep, stepIds, setOpenDialog) => {
-  const [currentStep, setCurrentStep] = useState41(initialStep);
-  const [dialogHeight, setDialogHeight] = useState41(null);
+  const [currentStep, setCurrentStep] = useState42(initialStep);
+  const [dialogHeight, setDialogHeight] = useState42(null);
   const visibleStepRef = useRef17(null);
   useEffect26(() => {
     if (visibleStepRef.current) {
@@ -12151,9 +12205,9 @@ var useMultiStepDialog = (initialStep, stepIds, setOpenDialog) => {
 };
 
 // hooks/useWindowSize.ts
-import { useEffect as useEffect27, useState as useState42 } from "react";
+import { useEffect as useEffect27, useState as useState43 } from "react";
 var useWindowSize = () => {
-  const [windowSize, setWindowSize] = useState42({
+  const [windowSize, setWindowSize] = useState43({
     width: void 0,
     height: void 0
   });
@@ -12172,7 +12226,7 @@ var useWindowSize = () => {
 };
 
 // hooks/useFocusWithin.ts
-import { useRef as useRef18, useState as useState43, useEffect as useEffect28 } from "react";
+import { useRef as useRef18, useState as useState44, useEffect as useEffect28 } from "react";
 function containsRelatedTarget(event) {
   if (event.currentTarget instanceof HTMLElement && event.relatedTarget instanceof HTMLElement) {
     return event.currentTarget.contains(event.relatedTarget);
@@ -12184,7 +12238,7 @@ function useFocusWithin({
   onFocus
 } = {}) {
   const ref = useRef18(null);
-  const [focused, _setFocused] = useState43(false);
+  const [focused, _setFocused] = useState44(false);
   const focusedRef = useRef18(false);
   const setFocused = (value) => {
     _setFocused(value);
@@ -12218,7 +12272,7 @@ function useFocusWithin({
 }
 
 // hooks/useMediaQuery.ts
-import { useState as useState44, useEffect as useEffect29, useRef as useRef19 } from "react";
+import { useState as useState45, useEffect as useEffect29, useRef as useRef19 } from "react";
 function attachMediaListener(query, callback) {
   try {
     query.addEventListener("change", callback);
@@ -12240,7 +12294,7 @@ function getInitialValue(query, initialValue) {
 function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
   getInitialValueInEffect: true
 }) {
-  const [matches, setMatches] = useState44(
+  const [matches, setMatches] = useState45(
     getInitialValueInEffect ? initialValue : getInitialValue(query, initialValue)
   );
   const queryRef = useRef19();
@@ -12259,15 +12313,15 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
 }
 
 // hooks/useScrollPosition.ts
-import { useState as useState45, useEffect as useEffect30 } from "react";
+import { useState as useState46, useEffect as useEffect30 } from "react";
 
 // hooks/useTable.ts
-import { useState as useState46, useEffect as useEffect31 } from "react";
+import { useState as useState47, useEffect as useEffect31 } from "react";
 
 // hooks/useTabs.ts
-import { useEffect as useEffect32, useState as useState47 } from "react";
+import { useEffect as useEffect32, useState as useState48 } from "react";
 function useTabs(initialTab = "") {
-  const [activeTab, setActiveTab] = useState47(initialTab);
+  const [activeTab, setActiveTab] = useState48(initialTab);
   useEffect32(() => {
     const handleHashChange = () => {
       const hash = window.location.hash.substring(1);