@sikka/hawa 0.29.13-next → 0.30.0-next

package/dist/index.js

@@ -1900,7 +1900,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) => {
@@ -3234,7 +3234,8 @@ var Radio = ({
     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";
-  let inactiveTabStyle = "hawa-inline-block hawa-w-full hawa-transition-all hover:hawa-bg-muted hawa-bg-primary-foreground dark:hover:hawa-text-white";
+  let inactiveTabStyle = `hawa-inline-block hawa-w-full hawa-transition-all  hawa-bg-primary-foreground dark:hover:hawa-text-white
+    ${props.disabled ? "" : "hover:hawa-bg-muted"}`;
   let orientationStyle = {
     horizontal: "hawa-flex hawa-flex-row",
     vertical: "hawa-flex hawa-flex-col"
@@ -3288,14 +3289,18 @@ var Radio = ({
           "li",
           {
             "aria-current": "page",
-            onClick: () => handleChange(opt),
+            onClick: () => {
+              if (props.disabled)
+                return;
+              handleChange(opt);
+            },
             className: cn(
-              "hawa-w-full hawa-cursor-pointer ",
+              "hawa-w-full hawa-last hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-2 ",
+              !props.disabled && "hawa-cursor-pointer",
               orientation === "horizontal" && parentDirection === "ltr" && "hawa-rounded-none first:hawa-rounded-l last:hawa-rounded-r",
               orientation === "horizontal" && parentDirection === "rtl" && "hawa-rounded-none first:hawa-rounded-r last:hawa-rounded-l",
               orientation === "vertical" && "hawa-rounded-none first:hawa-rounded-t last:hawa-rounded-b",
               tabSizeStyle[size],
-              "hawa-last hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-2 ",
               selectedOption === opt.value ? activeTabStyle : inactiveTabStyle
             ),
             key: o
@@ -3418,72 +3423,10 @@ var Radio = ({
 var React27 = __toESM(require("react"));
 var PopoverPrimitive2 = __toESM(require("@radix-ui/react-popover"));
 
-// elements/popover/Popover.tsx
-var React25 = __toESM(require("react"));
-var PopoverPrimitive = __toESM(require("@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
-var React26 = __toESM(require("react"));
+var React25 = __toESM(require("react"));
 var import_cmdk = require("cmdk");
-var Command = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var Command = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command,
   {
     ref,
@@ -3496,15 +3439,15 @@ var Command = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__
 ));
 Command.displayName = import_cmdk.Command.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",
@@ -3519,10 +3462,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(
     import_cmdk.Command.Input,
     {
       ref,
@@ -3535,7 +3478,7 @@ var CommandInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   )
 ));
 CommandInput.displayName = import_cmdk.Command.Input.displayName;
-var CommandList = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandList = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command.List,
   {
     ref,
@@ -3547,7 +3490,7 @@ var CommandList = React26.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CommandList.displayName = import_cmdk.Command.List.displayName;
-var CommandEmpty = React26.forwardRef((props, ref) => /* @__PURE__ */ React26.createElement(
+var CommandEmpty = React25.forwardRef((props, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command.Empty,
   {
     ref,
@@ -3556,7 +3499,7 @@ var CommandEmpty = React26.forwardRef((props, ref) => /* @__PURE__ */ React26.cr
   }
 ));
 CommandEmpty.displayName = import_cmdk.Command.Empty.displayName;
-var CommandGroup = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandGroup = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command.Group,
   {
     ref,
@@ -3568,7 +3511,7 @@ var CommandGroup = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 CommandGroup.displayName = import_cmdk.Command.Group.displayName;
-var CommandSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command.Separator,
   {
     ref,
@@ -3577,7 +3520,7 @@ var CommandSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CommandSeparator.displayName = import_cmdk.Command.Separator.displayName;
-var CommandItem = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React26.createElement(
+var CommandItem = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React25.createElement(
   import_cmdk.Command.Item,
   {
     ref,
@@ -3593,7 +3536,7 @@ var CommandShortcut = ({
   className,
   ...props
 }) => {
-  return /* @__PURE__ */ React26.createElement(
+  return /* @__PURE__ */ React25.createElement(
     "span",
     {
       className: cn(
@@ -3606,6 +3549,70 @@ var CommandShortcut = ({
 };
 CommandShortcut.displayName = "CommandShortcut";
 
+// elements/popover/Popover.tsx
+var React26 = __toESM(require("react"));
+var PopoverPrimitive = __toESM(require("@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(
   ({
@@ -3616,11 +3623,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];
     }
@@ -3635,7 +3644,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(
@@ -3693,7 +3703,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,
@@ -3701,7 +3712,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,
@@ -3737,7 +3748,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)
         ))))
       ))
     );
@@ -8458,16 +8469,8 @@ var AppLayout = ({
   let closeDrawerWidth = 56;
   let openDrawerWidth = 200;
   let drawerSizeStyle = {
-    opened: {
-      sm: "100",
-      md: openDrawerWidth,
-      lg: "250"
-    },
-    closed: {
-      sm: closeDrawerWidth,
-      md: closeDrawerWidth,
-      lg: closeDrawerWidth
-    }
+    opened: { sm: "100", md: openDrawerWidth, lg: "250" },
+    closed: { sm: closeDrawerWidth, md: closeDrawerWidth, lg: closeDrawerWidth }
   };
   const ref = (0, import_react40.useRef)(null);
   const isRTL = direction === "rtl";