@sikka/hawa 0.39.0-next → 0.40.0-next

package/dist/{chunk-W3CF7BSC.mjs → chunk-UBUVHGW4.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
-  useMeasureDirty
-} from "./chunk-ZBUBNKF6.mjs";
+  useViewportSize
+} from "./chunk-XCW5YNMS.mjs";
 import {
   Button,
   Chip,
@@ -9,7 +9,7 @@ import {
   Label,
   Skeleton,
   cn
-} from "./chunk-VMVZM3QQ.mjs";
+} from "./chunk-GU2DOJ7Q.mjs";
 
 // elements/alert/Alert.tsx
 import React, { useRef, useState, useEffect } from "react";
@@ -2611,6 +2611,7 @@ var Radio = forwardRef7(
     tabsContainerClassName,
     forceHideHelperText = false,
     onChange,
+    containerClassNames,
     ...props
   }, ref) => {
     var _a, _b, _c;
@@ -2666,161 +2667,203 @@ var Radio = forwardRef7(
     ];
     switch (design) {
       case "tabs":
-        return /* @__PURE__ */ React9.createElement("div", { className: "hawa-gap-2 hawa-flex hawa-flex-col" }, props.label && /* @__PURE__ */ React9.createElement(Label, { ...labelProps }, props.label), /* @__PURE__ */ React9.createElement(
-          "ul",
+        return /* @__PURE__ */ React9.createElement(
+          "div",
           {
-            ref: parentRef,
             className: cn(
-              props.options && ((_a = props.options) == null ? void 0 : _a.length) > 2 ? "hawa-flex-wrap xs:hawa-max-w-full xs:hawa-flex-nowrap" : "",
-              "hawa-select-none hawa-whitespace-nowrap hawa-rounded hawa-border hawa-text-center hawa-font-medium hawa-h-[40px]",
-              orientationStyle[orientation],
-              widthStyle[width],
-              tabsContainerClassName
+              "hawa-gap-2 hawa-flex hawa-flex-col",
+              containerClassNames == null ? void 0 : containerClassNames.tabs
             )
           },
-          (_b = props.options) == null ? void 0 : _b.map((opt, o) => {
-            return opt.tooltip ? /* @__PURE__ */ React9.createElement(
-              PopoverRoot,
-              {
-                key: o,
-                open: o === openTooltip,
-                onOpenChange: (bool) => setOpenTooltip(bool ? o : null)
-              },
-              /* @__PURE__ */ React9.createElement(
-                PopoverTrigger,
+          props.label && /* @__PURE__ */ React9.createElement(Label, { ...labelProps }, props.label),
+          /* @__PURE__ */ React9.createElement(
+            "ul",
+            {
+              ref: parentRef,
+              className: cn(
+                props.options && ((_a = props.options) == null ? void 0 : _a.length) > 2 ? "hawa-flex-wrap xs:hawa-max-w-full xs:hawa-flex-nowrap" : "",
+                "hawa-select-none hawa-whitespace-nowrap hawa-rounded hawa-border hawa-text-center hawa-font-medium hawa-h-[40px]",
+                orientationStyle[orientation],
+                widthStyle[width],
+                tabsContainerClassName
+              )
+            },
+            (_b = props.options) == null ? void 0 : _b.map((opt, o) => {
+              return opt.tooltip ? /* @__PURE__ */ React9.createElement(
+                PopoverRoot,
                 {
-                  onMouseEnter: () => setOpenTooltip(o),
-                  onMouseLeave: () => setOpenTooltip(null),
-                  asChild: true
+                  key: o,
+                  open: o === openTooltip,
+                  onOpenChange: (bool) => setOpenTooltip(bool ? o : null)
                 },
                 /* @__PURE__ */ React9.createElement(
-                  "li",
+                  PopoverTrigger,
                   {
-                    "aria-current": "page",
-                    onClick: () => {
-                      if (props.disabled || opt.disabled)
-                        return;
-                      handleChange(opt);
+                    onMouseEnter: () => setOpenTooltip(o),
+                    onMouseLeave: () => setOpenTooltip(null),
+                    asChild: true
+                  },
+                  /* @__PURE__ */ React9.createElement(
+                    "li",
+                    {
+                      "aria-current": "page",
+                      onClick: () => {
+                        if (props.disabled || opt.disabled)
+                          return;
+                        handleChange(opt);
+                      },
+                      className: cn(
+                        ...radio_option_tabs_styling,
+                        selectedOption === opt.value ? activeTabStyle : inactiveTabStyle
+                      )
                     },
-                    className: cn(
-                      ...radio_option_tabs_styling,
-                      selectedOption === opt.value ? activeTabStyle : inactiveTabStyle
-                    )
+                    opt.icon && opt.icon,
+                    opt.label
+                  )
+                ),
+                /* @__PURE__ */ React9.createElement(PopoverContent, { ...opt.tooltipContentProps }, opt.tooltip)
+              ) : /* @__PURE__ */ React9.createElement(
+                "li",
+                {
+                  key: o,
+                  "aria-current": "page",
+                  onClick: () => {
+                    if (props.disabled || opt.disabled)
+                      return;
+                    handleChange(opt);
                   },
-                  opt.icon && opt.icon,
-                  opt.label
-                )
+                  className: cn(
+                    ...radio_option_tabs_styling,
+                    selectedOption === opt.value ? activeTabStyle : inactiveTabStyle
+                  )
+                },
+                opt.icon && opt.icon,
+                opt.label
+              );
+            })
+          ),
+          !forceHideHelperText && /* @__PURE__ */ React9.createElement(HelperText, { helperText: props.helperText })
+        );
+      case "bordered":
+        return /* @__PURE__ */ React9.createElement(
+          "div",
+          {
+            className: cn(
+              orientationStyle[orientation],
+              "hawa-gap-4",
+              containerClassNames == null ? void 0 : containerClassNames.bordered
+            )
+          },
+          props.options && props.options.map((opt, i) => /* @__PURE__ */ React9.createElement("div", { key: i, className: "hawa-w-full hawa-rounded hawa-border" }, /* @__PURE__ */ React9.createElement(
+            "div",
+            {
+              className: cn(
+                "radio-item radio-item-bordered hawa-flex hawa-items-center hawa-transition-all",
+                props.direction === "rtl" ? "margin-left right-19px" : "margin-right left-23px"
               ),
-              /* @__PURE__ */ React9.createElement(PopoverContent, { ...opt.tooltipContentProps }, opt.tooltip)
-            ) : /* @__PURE__ */ React9.createElement(
-              "li",
+              key: i + 1
+            },
+            /* @__PURE__ */ React9.createElement(
+              "input",
               {
-                key: o,
-                "aria-current": "page",
-                onClick: () => {
-                  if (props.disabled || opt.disabled)
-                    return;
-                  handleChange(opt);
-                },
+                disabled: opt.disabled,
+                id: opt.value.toString(),
+                type: "radio",
+                value: opt.value,
+                name,
+                onChange: () => handleChange(opt)
+              }
+            ),
+            /* @__PURE__ */ React9.createElement(
+              "label",
+              {
+                htmlFor: opt.value.toString(),
                 className: cn(
-                  ...radio_option_tabs_styling,
-                  selectedOption === opt.value ? activeTabStyle : inactiveTabStyle
+                  "hawa-ml-2 hawa-w-full hawa-select-none hawa-p-4 hawa-pl-3 hawa-text-sm hawa-font-medium hawa-text-black dark:hawa-text-white",
+                  opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hawa-text-gray-900"
                 )
               },
-              opt.icon && opt.icon,
               opt.label
-            );
-          })
-        ), !forceHideHelperText && /* @__PURE__ */ React9.createElement(HelperText, { helperText: props.helperText }));
-      case "bordered":
-        return /* @__PURE__ */ React9.createElement("div", { className: cn(orientationStyle[orientation], "hawa-gap-4") }, props.options && props.options.map((opt, i) => /* @__PURE__ */ React9.createElement("div", { key: i, className: "hawa-w-full hawa-rounded hawa-border" }, /* @__PURE__ */ React9.createElement(
-          "div",
+            )
+          )))
+        );
+      case "cards":
+        return /* @__PURE__ */ React9.createElement(
+          "ul",
           {
             className: cn(
-              "radio-item radio-item-bordered hawa-flex hawa-items-center hawa-transition-all",
-              props.direction === "rtl" ? "margin-left right-19px" : "margin-right left-23px"
-            ),
-            key: i + 1
+              orientationStyle[orientation],
+              "hawa-gap-4",
+              containerClassNames == null ? void 0 : containerClassNames.cards
+            )
           },
-          /* @__PURE__ */ React9.createElement(
+          (_c = props.options) == null ? void 0 : _c.map((opt, o) => /* @__PURE__ */ React9.createElement("li", { key: o, onClick: () => handleChange(opt) }, /* @__PURE__ */ React9.createElement(
             "input",
             {
-              disabled: opt.disabled,
-              id: opt.value.toString(),
               type: "radio",
-              value: opt.value,
+              id: opt.value.toString(),
               name,
-              onChange: () => handleChange(opt)
+              value: opt.value.toString(),
+              className: "hawa-peer hawa-hidden",
+              required: true,
+              disabled: opt.disabled
             }
-          ),
-          /* @__PURE__ */ React9.createElement(
+          ), /* @__PURE__ */ React9.createElement(
             "label",
             {
               htmlFor: opt.value.toString(),
               className: cn(
-                "hawa-ml-2 hawa-w-full hawa-select-none hawa-p-4 hawa-pl-3 hawa-text-sm hawa-font-medium hawa-text-black dark:hawa-text-white",
-                opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hawa-text-gray-900"
+                "hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all  hawa-items-center hawa-justify-between hawa-rounded-lg hawa-border hawa-border-foreground/10 hawa-bg-background hawa-p-5 hawa-text-gray-500  peer-checked:hawa-border-primary peer-checked:hawa-text-primary dark:hawa-border-foreground/10 dark:hawa-bg-foreground/5 dark:hawa-text-gray-400  dark:peer-checked:hawa-text-primary",
+                opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hover:hawa-bg-foreground/10 hover:hawa-text-gray-600 dark:hover:hawa-bg-foreground/20 dark:hover:hawa-text-gray-300"
               )
             },
-            opt.label
-          )
-        ))));
-      case "cards":
-        return /* @__PURE__ */ React9.createElement("ul", { className: cn(orientationStyle[orientation], "hawa-gap-4") }, (_c = props.options) == null ? void 0 : _c.map((opt, o) => /* @__PURE__ */ React9.createElement("li", { key: o, onClick: () => handleChange(opt) }, /* @__PURE__ */ React9.createElement(
-          "input",
-          {
-            type: "radio",
-            id: opt.value.toString(),
-            name,
-            value: opt.value.toString(),
-            className: "hawa-peer hawa-hidden",
-            required: true,
-            disabled: opt.disabled
-          }
-        ), /* @__PURE__ */ React9.createElement(
-          "label",
-          {
-            htmlFor: opt.value.toString(),
-            className: cn(
-              "hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all  hawa-items-center hawa-justify-between hawa-rounded-lg hawa-border hawa-border-foreground/10 hawa-bg-background hawa-p-5 hawa-text-gray-500  peer-checked:hawa-border-primary peer-checked:hawa-text-primary dark:hawa-border-foreground/10 dark:hawa-bg-foreground/5 dark:hawa-text-gray-400  dark:peer-checked:hawa-text-primary",
-              opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hover:hawa-bg-foreground/10 hover:hawa-text-gray-600 dark:hover:hawa-bg-foreground/20 dark:hover:hawa-text-gray-300"
-            )
-          },
-          /* @__PURE__ */ React9.createElement("div", { className: "hawa-block  hawa-h-full hawa-w-full" }, /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full hawa-text-lg hawa-font-semibold" }, opt.label), /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full" }, opt.sublabel))
-        ))));
+            /* @__PURE__ */ React9.createElement("div", { className: "hawa-block  hawa-h-full hawa-w-full" }, /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full hawa-text-lg hawa-font-semibold" }, opt.label), /* @__PURE__ */ React9.createElement("div", { className: "hawa-w-full" }, opt.sublabel))
+          )))
+        );
       default:
-        return /* @__PURE__ */ React9.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React9.createElement(Label, { ...labelProps }, props.label), /* @__PURE__ */ React9.createElement("div", { className: cn(orientationStyle[orientation], "hawa-gap-2") }, props.options && props.options.map((opt, i) => /* @__PURE__ */ React9.createElement(
+        return /* @__PURE__ */ React9.createElement(
           "div",
           {
             className: cn(
-              "radio-item radio-item-default hawa-flex hawa-items-center hawa-transition-all",
-              props.direction === "rtl" ? "margin-left right-3px" : "margin-right left-3px"
-            ),
-            key: i + 1
+              "hawa-flex hawa-flex-col hawa-gap-2",
+              containerClassNames == null ? void 0 : containerClassNames.default
+            )
           },
-          /* @__PURE__ */ React9.createElement(
-            "input",
+          props.label && /* @__PURE__ */ React9.createElement(Label, { ...labelProps }, props.label),
+          /* @__PURE__ */ React9.createElement("div", { className: cn(orientationStyle[orientation], "hawa-gap-2") }, props.options && props.options.map((opt, i) => /* @__PURE__ */ React9.createElement(
+            "div",
             {
-              disabled: opt.disabled,
-              id: opt.value.toString(),
-              type: "radio",
-              value: opt.value,
-              name,
-              onChange: () => handleChange(opt)
-            }
-          ),
-          /* @__PURE__ */ React9.createElement(
-            "label",
-            {
-              htmlFor: opt.value.toString(),
               className: cn(
-                "hawa-text-sm hawa-font-medium  dark:hawa-text-white",
-                opt.disabled ? "hawa-text-gray-400" : "hawa-cursor-pointer hawa-text-gray-900"
-              )
+                "radio-item radio-item-default hawa-flex hawa-items-center hawa-transition-all",
+                props.direction === "rtl" ? "margin-left right-3px" : "margin-right left-3px"
+              ),
+              key: i + 1
             },
-            opt.label
-          )
-        ))), /* @__PURE__ */ React9.createElement(HelperText, { helperText: props.helperText }));
+            /* @__PURE__ */ React9.createElement(
+              "input",
+              {
+                disabled: opt.disabled,
+                id: opt.value.toString(),
+                type: "radio",
+                value: opt.value,
+                name,
+                onChange: () => handleChange(opt)
+              }
+            ),
+            /* @__PURE__ */ React9.createElement(
+              "label",
+              {
+                htmlFor: opt.value.toString(),
+                className: cn(
+                  "hawa-text-sm hawa-font-medium  dark:hawa-text-white",
+                  opt.disabled ? "hawa-text-gray-400" : "hawa-cursor-pointer hawa-text-gray-900"
+                )
+              },
+              opt.label
+            )
+          ))),
+          /* @__PURE__ */ React9.createElement(HelperText, { helperText: props.helperText })
+        );
     }
   }
 );
@@ -2998,66 +3041,10 @@ var ScrollBar = React11.forwardRef(({ className, orientation = "vertical", ...pr
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // elements/tabs/Tabs.tsx
-import * as React13 from "react";
+import * as React12 from "react";
+import * as Popover2 from "@radix-ui/react-popover";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
 import { tv } from "tailwind-variants";
-
-// elements/floatBox/FloatBox.tsx
-import * as React12 from "react";
-var FloatBox = ({
-  className,
-  open,
-  side = "bottom",
-  sideOffset = 40,
-  align = "center",
-  withArrow = false,
-  ...props
-}) => {
-  let stylesMap = {
-    bottom: {
-      start: { top: sideOffset, insetInlineStart: 0 },
-      center: { top: sideOffset },
-      end: { top: sideOffset, insetInlineEnd: 0 }
-    },
-    top: {
-      start: { bottom: sideOffset, insetInlineStart: 0 },
-      center: { bottom: sideOffset },
-      end: { bottom: sideOffset, insetInlineEnd: 0 }
-    },
-    right: {
-      start: { left: sideOffset, top: -5 },
-      center: { left: sideOffset },
-      end: { left: sideOffset, bottom: 0 }
-    },
-    left: {
-      start: { right: sideOffset, top: 0 },
-      center: { right: sideOffset },
-      end: { right: sideOffset, bottom: 0 }
-    }
-  };
-  const arrowDirection = {
-    top: "hawa-arrow-default-bottom",
-    bottom: "hawa-arrow-default-top",
-    right: "hawa-arrow-default-left",
-    left: "hawa-arrow-default-right"
-  };
-  return /* @__PURE__ */ React12.createElement(
-    "div",
-    {
-      className: cn(
-        "data-[floatbox-state=closed]:hawa-invisible data-[floatbox-state=open]:hawa-visible hawa-absolute dark:dark-shadow hawa-z-50 hawa-rounded hawa-border  hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[floatbox-state=open]:hawa-animate-in data-[floatbox-state=closed]:hawa-animate-out data-[floatbox-state=closed]:hawa-fade-out-0 data-[floatbox-state=open]:hawa-fade-in-0 data-[floatbox-state=closed]:hawa-zoom-out-95 data-[floatbox-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 hawa-bg-popover",
-        className
-      ),
-      style: { ...stylesMap[side][align] },
-      "data-side": side,
-      "data-floatbox-state": open ? "open" : "closed"
-    },
-    withArrow && /* @__PURE__ */ React12.createElement("div", { className: cn(arrowDirection[side]) }),
-    /* @__PURE__ */ React12.createElement("span", null, props.children)
-  );
-};
-
-// elements/tabs/Tabs.tsx
 var tabsListVariant = tv({
   base: "",
   variants: {
@@ -3116,39 +3103,27 @@ var tabsTriggerVariant = tv({
   ],
   defaultVariants: { variant: "default", orientation: "horizontal" }
 });
-var TabsContext = React13.createContext({ orientation: "horizontal", variant: "default" });
-var Tabs = React13.forwardRef(({ className, orientation, variant = "default", ...props }, ref) => /* @__PURE__ */ React13.createElement(
-  TabsPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "hawa-flex hawa-gap-2",
-      orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
-      className
-    ),
-    ...props
-  },
-  /* @__PURE__ */ React13.createElement(TabsContext.Provider, { value: { orientation, variant } }, props.children)
-));
-var TabsList = React13.forwardRef(({ className, classNames, ...props }, ref) => {
-  const { orientation, variant } = React13.useContext(TabsContext);
-  const [size, setSize] = React13.useState(
-    typeof window !== "undefined" && window.innerWidth || 1200
-  );
-  React13.useEffect(() => {
-    if (typeof window !== "undefined") {
-      const resize = () => {
-        setSize(window.innerWidth);
-      };
-      resize();
-      window.addEventListener("resize", resize);
-      return () => {
-        window.removeEventListener("resize", resize);
-      };
-    }
-  }, []);
-  if (props.scrollable && size < 768 && orientation === "horizontal") {
-    return /* @__PURE__ */ React13.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React13.createElement(
+var TabsContext = React12.createContext({ orientation: "horizontal", variant: "default", scrollable: false });
+var Tabs = React12.forwardRef(
+  ({ className, orientation, scrollable, variant = "default", ...props }, ref) => /* @__PURE__ */ React12.createElement(
+    TabsPrimitive.Root,
+    {
+      ref,
+      className: cn(
+        "hawa-flex hawa-gap-2",
+        orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
+        className
+      ),
+      ...props
+    },
+    /* @__PURE__ */ React12.createElement(TabsContext.Provider, { value: { orientation, variant, scrollable } }, props.children)
+  )
+);
+var TabsList = React12.forwardRef(({ className, classNames, ...props }, ref) => {
+  const { orientation, variant, scrollable } = React12.useContext(TabsContext);
+  const { width } = useViewportSize();
+  if (scrollable && width < 768 && orientation === "horizontal") {
+    return /* @__PURE__ */ React12.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React12.createElement(
       TabsPrimitive.List,
       {
         ref,
@@ -3161,7 +3136,7 @@ var TabsList = React13.forwardRef(({ className, classNames, ...props }, ref) =>
       }
     ));
   } else {
-    return /* @__PURE__ */ React13.createElement(
+    return /* @__PURE__ */ React12.createElement(
       TabsPrimitive.List,
       {
         ref,
@@ -3176,37 +3151,52 @@ var TabsList = React13.forwardRef(({ className, classNames, ...props }, ref) =>
     );
   }
 });
-var TabsTrigger = React13.forwardRef(({ className, chipProps, ...props }, ref) => {
-  const { orientation, variant } = React13.useContext(TabsContext);
-  const tabTriggerRef = React13.useRef(null);
-  const { width } = useMeasureDirty(tabTriggerRef);
-  return /* @__PURE__ */ React13.createElement(
-    TabsPrimitive.Trigger,
-    {
-      ref: tabTriggerRef,
-      className: cn(
-        tabsTriggerVariant({ variant, orientation }),
-        "hawa-relative",
-        className
-      ),
-      ...props
-    },
-    props.children,
-    chipProps && /* @__PURE__ */ React13.createElement(Chip, { ...chipProps }),
-    /* @__PURE__ */ React13.createElement(
-      FloatBox,
-      {
-        withArrow: true,
-        align: orientation === "vertical" ? "start" : "start",
-        side: orientation === "vertical" ? "right" : "bottom",
-        sideOffset: orientation === "vertical" ? width + 30 : 45,
-        open: props.showPopover
-      },
-      props.popoverContent
-    )
-  );
-});
-var TabsContent = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React13.createElement(
+var TabsTrigger = React12.forwardRef(
+  ({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {
+    const { orientation, variant } = React12.useContext(TabsContext);
+    if (withPopover) {
+      return /* @__PURE__ */ React12.createElement(Popover2.Root, { open: props.showPopover }, /* @__PURE__ */ React12.createElement(Popover2.Anchor, { asChild: true }, /* @__PURE__ */ React12.createElement(
+        TabsPrimitive.Trigger,
+        {
+          className: cn(
+            tabsTriggerVariant({ variant, orientation }),
+            "hawa-relative",
+            className
+          ),
+          ...props
+        },
+        props.children,
+        chipProps && /* @__PURE__ */ React12.createElement(Chip, { ...chipProps })
+      )), /* @__PURE__ */ React12.createElement(
+        Popover2.Content,
+        {
+          onClick: onPopoverClick,
+          asChild: true,
+          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",
+            "hawa-arrow-default-top hawa-mt-2"
+          )
+        },
+        /* @__PURE__ */ React12.createElement("div", { className: "hawa-p-2" }, " ", props.popoverContent)
+      ));
+    } else {
+      return /* @__PURE__ */ React12.createElement(
+        TabsPrimitive.Trigger,
+        {
+          className: cn(
+            tabsTriggerVariant({ variant, orientation }),
+            "hawa-relative",
+            className
+          ),
+          ...props
+        },
+        props.children,
+        chipProps && /* @__PURE__ */ React12.createElement(Chip, { ...chipProps })
+      );
+    }
+  }
+);
+var TabsContent = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React12.createElement(
   TabsPrimitive.Content,
   {
     ref,
@@ -3223,12 +3213,12 @@ TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // elements/separator/Separator.tsx
-import * as React14 from "react";
+import * as React13 from "react";
 var Separator = ({
   className,
   orientation = "horizontal",
   ...props
-}) => /* @__PURE__ */ React14.createElement(
+}) => /* @__PURE__ */ React13.createElement(
   "div",
   {
     className: cn(
@@ -3241,9 +3231,9 @@ var Separator = ({
 );
 
 // elements/progress/Progress.tsx
-import * as React15 from "react";
+import * as React14 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-var Progress = React15.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React15.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React15.createElement(Label, { ...props.labelProps }, props.label), /* @__PURE__ */ React15.createElement(
+var Progress = React14.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ React14.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React14.createElement(Label, { ...props.labelProps }, props.label), /* @__PURE__ */ React14.createElement(
   ProgressPrimitive.Root,
   {
     ref,
@@ -3253,7 +3243,7 @@ var Progress = React15.forwardRef(({ className, value, ...props }, ref) => /* @_
     ),
     ...props
   },
-  /* @__PURE__ */ React15.createElement(
+  /* @__PURE__ */ React14.createElement(
     ProgressPrimitive.Indicator,
     {
       className: "hawa-h-full hawa-w-full hawa-flex-1 hawa-bg-primary hawa-transition-all",

package/dist/{chunk-ZBUBNKF6.mjs → chunk-XCW5YNMS.mjs}

@@ -483,6 +483,37 @@ function useShortcuts(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"], t
   }, [hotkeys]);
 }
 
+// hooks/useWindowEvent.ts
+import { useEffect as useEffect14 } from "react";
+function useWindowEvent(type, listener, options) {
+  useEffect14(() => {
+    window.addEventListener(type, listener, options);
+    return () => window.removeEventListener(type, listener, options);
+  }, [type, listener]);
+}
+
+// hooks/useViewportSize.ts
+import { useCallback, useEffect as useEffect15, useState as useState15 } from "react";
+var eventListerOptions = {
+  passive: true
+};
+function useViewportSize() {
+  const [windowSize, setWindowSize] = useState15({
+    width: 0,
+    height: 0
+  });
+  const setSize = useCallback(() => {
+    setWindowSize({
+      width: window.innerWidth || 0,
+      height: window.innerHeight || 0
+    });
+  }, []);
+  useWindowEvent("resize", setSize, eventListerOptions);
+  useWindowEvent("orientationchange", setSize, eventListerOptions);
+  useEffect15(setSize, []);
+  return windowSize;
+}
+
 export {
   useIsomorphicEffect,
   reducer,
@@ -499,5 +530,7 @@ export {
   parseHotkey,
   getHotkeyMatcher,
   getHotkeyHandler,
-  useShortcuts
+  useShortcuts,
+  useWindowEvent,
+  useViewportSize
 };