@sikka/hawa 0.29.14-next → 0.30.0-next

package/dist/index.mjs

@@ -1665,7 +1665,7 @@ var DialogOverlay = React14.forwardRef(({ className, ...props }, ref) => /* @__P
     ...props
   }
 ));
-var DialogContent = React14.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, null, /* @__PURE__ */ React14.createElement(DialogOverlay, null), /* @__PURE__ */ React14.createElement(
+var DialogContent = React14.forwardRef(({ className, children, persist, hideCloseButton, ...props }, ref) => /* @__PURE__ */ React14.createElement(DialogPortal, { container: props.container }, /* @__PURE__ */ React14.createElement(DialogOverlay, null), /* @__PURE__ */ React14.createElement(
   DialogPrimitive.Content,
   {
     onPointerDownOutside: (e) => {
@@ -3196,72 +3196,10 @@ var Radio = ({
 import * as React27 from "react";
 import * as PopoverPrimitive2 from "@radix-ui/react-popover";
 
-// elements/popover/Popover.tsx
-import * as React25 from "react";
-import * as PopoverPrimitive from "@radix-ui/react-popover";
-var PopoverContent = React25.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React25.createElement(PopoverPrimitive.Portal, null, /* @__PURE__ */ React25.createElement(
-  PopoverPrimitive.Content,
-  {
-    ref,
-    align,
-    sideOffset,
-    className: cn(
-      "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
-      className
-    ),
-    ...props
-  }
-)));
-PopoverContent.displayName = PopoverPrimitive.Content.displayName;
-var Popover = ({
-  trigger,
-  children,
-  className,
-  align = "center",
-  side,
-  sideOffset = 4,
-  open,
-  width = "default",
-  disableTrigger,
-  contentProps,
-  triggerProps,
-  ...props
-}) => {
-  let widthStyles = {
-    trigger: "var(--radix-popover-trigger-width)",
-    default: "auto"
-  };
-  return /* @__PURE__ */ React25.createElement(PopoverPrimitive.Root, { open, ...props }, /* @__PURE__ */ React25.createElement(
-    PopoverPrimitive.Trigger,
-    {
-      className: "hawa-w-full",
-      disabled: disableTrigger,
-      ...triggerProps
-    },
-    trigger
-  ), /* @__PURE__ */ React25.createElement(
-    PopoverContent,
-    {
-      side,
-      className,
-      align,
-      sideOffset,
-      style: {
-        width: widthStyles[width],
-        maxWidth: "var(--radix-popover-content-available-width)",
-        maxHeight: "var(--radix-popover-content-available-height)"
-      },
-      ...contentProps
-    },
-    children
-  ));
-};
-var PopoverTrigger = PopoverPrimitive.Trigger;
-
 // elements/command/Command.tsx
-import * as React26 from "react";
+import * as React25 from "react";
 import { Command as CommandPrimitive } from "cmdk";
-var Command = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var Command = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive,
   {
     ref,
@@ -3274,15 +3212,15 @@ var Command = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__
 ));
 Command.displayName = CommandPrimitive.displayName;
 var CommandDialog = ({ children, ...props }) => {
-  return /* @__PURE__ */ React26.createElement(Dialog, { ...props }, /* @__PURE__ */ React26.createElement(DialogContent, { className: "hawa-overflow-hidden hawa-p-0 hawa-shadow-lg" }, /* @__PURE__ */ React26.createElement(Command, { className: "[&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:hawa-pt-0 [&_[cmdk-group]]:hawa-px-2 [&_[cmdk-input-wrapper]_svg]:hawa-h-5 [&_[cmdk-input-wrapper]_svg]:hawa-w-5 [&_[cmdk-input]]:hawa-h-12 [&_[cmdk-item]]:hawa-px-2 [&_[cmdk-item]]:hawa-py-3 [&_[cmdk-item]_svg]:hawa-h-5 [&_[cmdk-item]_svg]:hawa-w-5" }, children)));
+  return /* @__PURE__ */ React25.createElement(Dialog, { ...props }, /* @__PURE__ */ React25.createElement(DialogContent, { className: "hawa-overflow-hidden hawa-p-0 hawa-shadow-lg" }, /* @__PURE__ */ React25.createElement(Command, { className: "[&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:hawa-pt-0 [&_[cmdk-group]]:hawa-px-2 [&_[cmdk-input-wrapper]_svg]:hawa-h-5 [&_[cmdk-input-wrapper]_svg]:hawa-w-5 [&_[cmdk-input]]:hawa-h-12 [&_[cmdk-item]]:hawa-px-2 [&_[cmdk-item]]:hawa-py-3 [&_[cmdk-item]_svg]:hawa-h-5 [&_[cmdk-item]_svg]:hawa-w-5" }, children)));
 };
-var CommandInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandInput = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   "div",
   {
     className: "hawa-flex hawa-items-center hawa-border-b hawa-px-3",
     "cmdk-input-wrapper": ""
   },
-  /* @__PURE__ */ React26.createElement(
+  /* @__PURE__ */ React25.createElement(
     "svg",
     {
       "aria-label": "Search Icon",
@@ -3297,10 +3235,10 @@ var CommandInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
       strokeLinejoin: "round",
       className: "hawa-icon hawa-me-2 hawa-shrink-0 hawa-opacity-50"
     },
-    /* @__PURE__ */ React26.createElement("circle", { cx: "11", cy: "11", r: "8" }),
-    /* @__PURE__ */ React26.createElement("path", { d: "m21 21-4.3-4.3" })
+    /* @__PURE__ */ React25.createElement("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ React25.createElement("path", { d: "m21 21-4.3-4.3" })
   ),
-  /* @__PURE__ */ React26.createElement(
+  /* @__PURE__ */ React25.createElement(
     CommandPrimitive.Input,
     {
       ref,
@@ -3313,7 +3251,7 @@ var CommandInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   )
 ));
 CommandInput.displayName = CommandPrimitive.Input.displayName;
-var CommandList = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandList = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive.List,
   {
     ref,
@@ -3325,7 +3263,7 @@ var CommandList = React26.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandList.displayName = CommandPrimitive.List.displayName;
-var CommandEmpty = React26.forwardRef((props, ref) => /* @__PURE__ */ React26.createElement(
+var CommandEmpty = React25.forwardRef((props, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive.Empty,
   {
     ref,
@@ -3334,7 +3272,7 @@ var CommandEmpty = React26.forwardRef((props, ref) => /* @__PURE__ */ React26.cr
   }
 ));
 CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
-var CommandGroup = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandGroup = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive.Group,
   {
     ref,
@@ -3346,7 +3284,7 @@ var CommandGroup = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 CommandGroup.displayName = CommandPrimitive.Group.displayName;
-var CommandSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive.Separator,
   {
     ref,
@@ -3355,7 +3293,7 @@ var CommandSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
-var CommandItem = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandItem = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   CommandPrimitive.Item,
   {
     ref,
@@ -3371,7 +3309,7 @@ var CommandShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ React26.createElement(
+  return /* @__PURE__ */ React25.createElement(
     "span",
     {
       className: cn(
@@ -3384,6 +3322,70 @@ var CommandShortcut = ({
 };
 CommandShortcut.displayName = "CommandShortcut";
 
+// elements/popover/Popover.tsx
+import * as React26 from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+var PopoverContent = React26.forwardRef(
+  ({ className, align = "center", sideOffset = 4, container, ...props }, ref) => /* @__PURE__ */ React26.createElement(PopoverPrimitive.Portal, { container }, /* @__PURE__ */ React26.createElement(
+    PopoverPrimitive.Content,
+    {
+      ref,
+      align,
+      sideOffset,
+      className: cn(
+        "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
+        className
+      ),
+      ...props
+    }
+  ))
+);
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+var Popover = ({
+  trigger,
+  children,
+  className,
+  align = "center",
+  side,
+  sideOffset = 4,
+  open,
+  width = "default",
+  disableTrigger,
+  contentProps,
+  triggerProps,
+  ...props
+}) => {
+  let widthStyles = {
+    trigger: "var(--radix-popover-trigger-width)",
+    default: "auto"
+  };
+  return /* @__PURE__ */ React26.createElement(PopoverPrimitive.Root, { open, ...props }, /* @__PURE__ */ React26.createElement(
+    PopoverPrimitive.Trigger,
+    {
+      className: "hawa-w-full",
+      disabled: disableTrigger,
+      ...triggerProps
+    },
+    trigger
+  ), /* @__PURE__ */ React26.createElement(
+    PopoverContent,
+    {
+      side,
+      className,
+      align,
+      sideOffset,
+      style: {
+        width: widthStyles[width],
+        maxWidth: "var(--radix-popover-content-available-width)",
+        maxHeight: "var(--radix-popover-content-available-height)"
+      },
+      ...contentProps
+    },
+    children
+  ));
+};
+var PopoverTrigger = PopoverPrimitive.Trigger;
+
 // elements/combobox/Combobox.tsx
 var Combobox = React27.forwardRef(
   ({
@@ -3394,11 +3396,13 @@ var Combobox = React27.forwardRef(
     direction,
     labelProps,
     data,
+    renderOption,
     ...props
   }, ref) => {
     var _a, _b, _c;
     const [open, setOpen] = React27.useState(false);
     const [value, setValue] = React27.useState(defaultValue);
+    const containerRef = React27.useRef(null);
     function getProperty(obj, key) {
       return obj[key];
     }
@@ -3413,7 +3417,8 @@ var Combobox = React27.forwardRef(
         className: cn(
           "hawa-relative hawa-flex hawa-h-fit hawa-flex-col hawa-gap-2",
           props.width === "fit" ? "hawa-w-fit" : "hawa-w-full"
-        )
+        ),
+        ref: containerRef
       },
       props.label && /* @__PURE__ */ React27.createElement(Label2, { ...labelProps }, props.label),
       /* @__PURE__ */ React27.createElement(PopoverPrimitive2.Root, { open, onOpenChange: handleOpenChange }, /* @__PURE__ */ React27.createElement(PopoverTrigger, { asChild: true }, props.isLoading ? /* @__PURE__ */ React27.createElement("div", { className: "hawa-pb-2" }, /* @__PURE__ */ React27.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" })) : /* @__PURE__ */ React27.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-start hawa-gap-2 " }, /* @__PURE__ */ React27.createElement(
@@ -3471,7 +3476,8 @@ var Combobox = React27.forwardRef(
         {
           sideOffset: 0,
           className: cn("popover-w-parent", props.helperText && "-hawa-mt-4"),
-          dir: direction
+          dir: direction,
+          container: containerRef.current
         },
         /* @__PURE__ */ React27.createElement(Command, null, !props.hideInput && /* @__PURE__ */ React27.createElement(
           CommandInput,
@@ -3479,7 +3485,7 @@ var Combobox = React27.forwardRef(
             dir: direction,
             placeholder: ((_b = props.texts) == null ? void 0 : _b.searchPlaceholder) || "Search"
           }
-        ), /* @__PURE__ */ React27.createElement(CommandEmpty, null, ((_c = props.texts) == null ? void 0 : _c.noItems) || "No items found."), /* @__PURE__ */ React27.createElement(CommandGroup, { className: "hawa-max-h-[200px] hawa-overflow-y-auto" }, data.map((item, i) => /* @__PURE__ */ React27.createElement(
+        ), /* @__PURE__ */ React27.createElement(CommandEmpty, null, ((_c = props.texts) == null ? void 0 : _c.noItems) || "No items found."), /* @__PURE__ */ React27.createElement(CommandGroup, { className: "hawa-max-h-[200px] hawa-overflow-y-scroll" }, data.map((item, i) => /* @__PURE__ */ React27.createElement(
           CommandItem,
           {
             key: i,
@@ -3515,7 +3521,7 @@ var Combobox = React27.forwardRef(
             },
             /* @__PURE__ */ React27.createElement("polyline", { points: "20 6 9 17 4 12" })
           ),
-          getProperty(item, labelKey)
+          renderOption ? renderOption(item) : getProperty(item, labelKey)
         ))))
       ))
     );
@@ -4419,7 +4425,7 @@ var AppStores = (props) => {
 };
 
 // elements/badge/Badge.tsx
-import React38, { useEffect as useEffect7, useState as useState9, useRef as useRef6 } from "react";
+import React38, { useEffect as useEffect7, useState as useState9, useRef as useRef7 } from "react";
 var Badge = ({
   anchor,
   position = "right",
@@ -4428,7 +4434,7 @@ var Badge = ({
   className
 }) => {
   const [badgePosition, setBadgePosition] = useState9(null);
-  const indicatorRef = useRef6(null);
+  const indicatorRef = useRef7(null);
   const sizeStyles2 = {
     small: { top: 4, left: 6, right: 7, classes: "hawa-w-3 hawa-h-3" },
     default: { top: 4, left: 7, right: 5, classes: "hawa-w-3 hawa-h-3" },
@@ -4482,7 +4488,7 @@ var BadgedComponent = ({
   size,
   text
 }) => {
-  const ref = useRef6(null);
+  const ref = useRef7(null);
   return /* @__PURE__ */ React38.createElement("div", { className: cn("hawa-relative hawa-w-fit", className), ref }, !hideBadge && /* @__PURE__ */ React38.createElement(
     Badge,
     {
@@ -4496,7 +4502,7 @@ var BadgedComponent = ({
 };
 
 // elements/phoneInput/PhoneInput.tsx
-import React39, { useState as useState10, useRef as useRef7, useEffect as useEffect8 } from "react";
+import React39, { useState as useState10, useRef as useRef8, useEffect as useEffect8 } from "react";
 
 // countries.ts
 var countries = [
@@ -6195,7 +6201,7 @@ var countries_default = countries;
 var PhoneInput = ({ labelProps, ...props }) => {
   const [phoneNumber, setPhoneNumber] = useState10("");
   const [countryCode, setCountryCode] = useState10(props.preferredCountry);
-  const inputRef = useRef7(null);
+  const inputRef = useRef8(null);
   useEffect8(() => {
     var _a;
     if (inputRef.current) {
@@ -7679,7 +7685,7 @@ function Toaster(props) {
 }
 
 // elements/destroyableCard/DestroyableCard.tsx
-import React59, { useRef as useRef8, useState as useState18 } from "react";
+import React59, { useRef as useRef9, useState as useState18 } from "react";
 var DestroyableCard = ({
   position = "bottom-right",
   fixed,
@@ -7687,7 +7693,7 @@ var DestroyableCard = ({
   ...props
 }) => {
   const [closed, setClosed] = useState18(false);
-  const popUpRef = useRef8(null);
+  const popUpRef = useRef9(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4 hawa-bottom-4",
     "bottom-left": "hawa-left-4 hawa-bottom-4"
@@ -8223,7 +8229,7 @@ var Navbar = ({
 };
 
 // layout/appLayout/AppLayout.tsx
-import React66, { useEffect as useEffect14, useRef as useRef9, useState as useState21 } from "react";
+import React66, { useEffect as useEffect14, useRef as useRef10, useState as useState21 } from "react";
 var AppLayout = ({
   profileMenuWidth = "default",
   DrawerFooterActions,
@@ -8246,7 +8252,7 @@ var AppLayout = ({
     opened: { sm: "100", md: openDrawerWidth, lg: "250" },
     closed: { sm: closeDrawerWidth, md: closeDrawerWidth, lg: closeDrawerWidth }
   };
-  const ref = useRef9(null);
+  const ref = useRef10(null);
   const isRTL = direction === "rtl";
   const [openedSidebarItem, setOpenedSidebarItem] = useState21("");
   const [size, setSize] = useState21(1200);
@@ -8930,7 +8936,7 @@ var AppTabs = ({ tabs, className }) => {
 };
 
 // layout/docsLayout/DocsLayout.tsx
-import React72, { useEffect as useEffect16, useRef as useRef10, useState as useState24 } from "react";
+import React72, { useEffect as useEffect16, useRef as useRef11, useState as useState24 } from "react";
 
 // hooks/useBreakpoint.ts
 import { useState as useState23, useEffect as useEffect15 } from "react";
@@ -9039,7 +9045,7 @@ var DocsLayout = ({
       lg: closeDrawerWidth
     }
   };
-  const ref = useRef10(null);
+  const ref = useRef11(null);
   const isRTL = direction === "rtl";
   let size = useBreakpoint();
   if (typeof window == "undefined") {
@@ -10310,7 +10316,7 @@ var CodeConfirmation = (props) => {
 };
 
 // blocks/feedback/UserReferralSource.tsx
-import React81, { useRef as useRef11, useState as useState29 } from "react";
+import React81, { useRef as useRef12, useState as useState29 } 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";
@@ -10321,7 +10327,7 @@ var UserReferralSource = ({
 }) => {
   var _a, _b;
   const [closed, setClosed] = useState29(false);
-  const popUpRef = useRef11(null);
+  const popUpRef = useRef12(null);
   const formSchema = z6.object({
     source: z6.string({ required_error: (_a = props.texts) == null ? void 0 : _a.pleaseSelectOption }),
     feedback: z6.string().optional()
@@ -10468,7 +10474,7 @@ var UserReferralSource = ({
 };
 
 // blocks/feedback/FeedbackRating.tsx
-import React82, { useEffect as useEffect18, useRef as useRef12, useState as useState30 } from "react";
+import React82, { useEffect as useEffect18, useRef as useRef13, useState as useState30 } from "react";
 var FeedbackRating = ({
   position = "bottom-right",
   ...props
@@ -10477,7 +10483,7 @@ var FeedbackRating = ({
   const [answered, setAnswered] = useState30(false);
   const [clickedOption, setClickedOption] = useState30(null);
   const [closingTimer, setClosingTimer] = useState30(5);
-  const popUpRef = useRef12(null);
+  const popUpRef = useRef13(null);
   const boxPosition = {
     "bottom-right": "hawa-right-4",
     "bottom-left": "hawa-left-4"
@@ -11189,12 +11195,12 @@ var ActionCard = (props) => {
 };
 
 // blocks/cards/AdCard.tsx
-import React94, { useState as useState33, useEffect as useEffect19, useRef as useRef13 } from "react";
+import React94, { useState as useState33, useEffect as useEffect19, useRef as useRef14 } from "react";
 var AdCard = ({
   orientation = "vertical",
   ...props
 }) => {
-  const adRef = useRef13(null);
+  const adRef = useRef14(null);
   const [closed, setClosed] = useState33(false);
   let duration = 0;
   useEffect19(() => {
@@ -11869,7 +11875,7 @@ var useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : us
 import { useState as useState36 } from "react";
 
 // hooks/useHover.ts
-import { useEffect as useEffect22, useRef as useRef14, useState as useState37 } from "react";
+import { useEffect as useEffect22, useRef as useRef15, useState as useState37 } from "react";
 
 // hooks/useToast.ts
 import * as React104 from "react";
@@ -11976,7 +11982,7 @@ function useToast() {
 }
 
 // hooks/useCarousel.ts
-import { useState as useState39, useRef as useRef15 } from "react";
+import { useState as useState39, useRef as useRef16 } from "react";
 
 // hooks/useDialogCarousel.ts
 import { useEffect as useEffect24, useState as useState40 } from "react";
@@ -12022,11 +12028,11 @@ var useDialogCarousel = (options) => {
 };
 
 // hooks/useDialogSteps.ts
-import { useState as useState41, useEffect as useEffect25, useRef as useRef16 } from "react";
+import { useState as useState41, useEffect as useEffect25, useRef as useRef17 } from "react";
 var useMultiStepDialog = (initialStep, stepIds, setOpenDialog) => {
   const [currentStep, setCurrentStep] = useState41(initialStep);
   const [dialogHeight, setDialogHeight] = useState41(null);
-  const visibleStepRef = useRef16(null);
+  const visibleStepRef = useRef17(null);
   useEffect25(() => {
     if (visibleStepRef.current) {
       setDialogHeight(visibleStepRef.current.offsetHeight);
@@ -12079,7 +12085,7 @@ var useWindowSize = () => {
 };
 
 // hooks/useFocusWithin.ts
-import { useRef as useRef17, useState as useState43, useEffect as useEffect27 } from "react";
+import { useRef as useRef18, useState as useState43, useEffect as useEffect27 } from "react";
 function containsRelatedTarget(event) {
   if (event.currentTarget instanceof HTMLElement && event.relatedTarget instanceof HTMLElement) {
     return event.currentTarget.contains(event.relatedTarget);
@@ -12090,9 +12096,9 @@ function useFocusWithin({
   onBlur,
   onFocus
 } = {}) {
-  const ref = useRef17(null);
+  const ref = useRef18(null);
   const [focused, _setFocused] = useState43(false);
-  const focusedRef = useRef17(false);
+  const focusedRef = useRef18(false);
   const setFocused = (value) => {
     _setFocused(value);
     focusedRef.current = value;
@@ -12125,7 +12131,7 @@ function useFocusWithin({
 }
 
 // hooks/useMediaQuery.ts
-import { useState as useState44, useEffect as useEffect28, useRef as useRef18 } from "react";
+import { useState as useState44, useEffect as useEffect28, useRef as useRef19 } from "react";
 function attachMediaListener(query, callback) {
   try {
     query.addEventListener("change", callback);
@@ -12150,7 +12156,7 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
   const [matches, setMatches] = useState44(
     getInitialValueInEffect ? initialValue : getInitialValue(query, initialValue)
   );
-  const queryRef = useRef18();
+  const queryRef = useRef19();
   useEffect28(() => {
     if ("matchMedia" in window) {
       queryRef.current = window.matchMedia(query);

package/dist/passwordInput/index.js

@@ -411,19 +411,21 @@ var Input = (0, import_react6.forwardRef)(
 // elements/popover/Popover.tsx
 var React8 = __toESM(require("react"));
 var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"));
-var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React8.createElement(PopoverPrimitive.Portal, null, /* @__PURE__ */ React8.createElement(
-  PopoverPrimitive.Content,
-  {
-    ref,
-    align,
-    sideOffset,
-    className: cn(
-      "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
-      className
-    ),
-    ...props
-  }
-)));
+var PopoverContent = React8.forwardRef(
+  ({ className, align = "center", sideOffset = 4, container, ...props }, ref) => /* @__PURE__ */ React8.createElement(PopoverPrimitive.Portal, { container }, /* @__PURE__ */ React8.createElement(
+    PopoverPrimitive.Content,
+    {
+      ref,
+      align,
+      sideOffset,
+      className: cn(
+        "dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
+        className
+      ),
+      ...props
+    }
+  ))
+);
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 var Popover = ({
   trigger,