@popgrids/ui 0.0.21 → 0.0.23

package/dist/index.js

@@ -4,7 +4,7 @@ import { twMerge } from 'tailwind-merge';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { Button as Button$1 } from '@base-ui/react/button';
 import { Dialog } from '@base-ui/react/dialog';
-import { XClose, CheckCircle, Circle, ChevronRight, Check, InfoCircle } from '@untitledui/icons';
+import { XClose, ChevronRight, Check, InfoCircle } from '@untitledui/icons';
 import { Menu } from '@base-ui/react/menu';
 import { Input as Input$1 } from '@base-ui/react/input';
 import { mergeProps } from '@base-ui/react/merge-props';
@@ -586,17 +586,6 @@ function DialogContent({
         "data-slot": "dialog-content",
         className: "group/popup pointer-events-none flex h-full max-h-full min-h-0 w-full max-w-full justify-center overflow-hidden transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0",
         children: [
-          showCloseButton && /* @__PURE__ */ jsxs(
-            DialogClose,
-            {
-              className: cn("pointer-events-auto fixed top-[15px] z-50 transition-all", { "left-5": closePosition === "top-left", "right-5": closePosition === "top-right", "group-data-closed/popup:duration-pop-hover group-data-open/popup:duration-pop-hover group-data-open/popup:ease-pop-hover group-data-closed/popup:ease-out group-data-ending-style/popup:scale-[0.96] group-data-ending-style/popup:opacity-0 group-data-starting-style/popup:scale-[0.96] group-data-starting-style/popup:opacity-0": !bottom, " group-data-starting-style/popup-scale-[0.96] group-data-ending-style/popup-scale-100 group-data-open/popup:animate-in group-data-closed/popup:animate-out group-data-closed/popup:duration-200 group-data-closed/popup:ease-[cubic-bezier(1,0,0.72,0.32)] group-data-ending-style/popup:translate-y-1/2 group-data-open/popup:duration-pop-hover group-data-open/popup:ease-[cubic-bezier(0.32,0.72,0,1)] group-data-starting-style/popup:translate-y-1/2": bottom }),
-              "aria-label": "Close",
-              children: [
-                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" }),
-                /* @__PURE__ */ jsx("span", { className: "before:bg-tint-700-reversed relative block before:absolute before:-inset-1.5 before:rounded-full before:backdrop-blur-sm", children: /* @__PURE__ */ jsx("span", { className: "bg-primary-foreground text-background relative z-10 flex size-10 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx(XClose, { className: "size-[18px]" }) }) })
-              ]
-            }
-          ),
           /* @__PURE__ */ jsx(
             "div",
             {
@@ -604,13 +593,24 @@ function DialogContent({
                 "bg-background pointer-events-auto fixed top-1/2 left-1/2 flex h-full max-h-[calc(100%-2rem)] w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 flex-col rounded-xl shadow-2xl transition-all",
                 {
                   "group-data-closed/popup:duration-pop-hover group-data-open/popup:duration-pop-hover group-data-open/popup:ease-pop-hover group-data-closed/popup:ease-out group-data-ending-style/popup:scale-[0.96] group-data-ending-style/popup:opacity-0 group-data-starting-style/popup:scale-[0.96] group-data-starting-style/popup:opacity-0": !bottom,
-                  "group-data-open/popup:slide-in-from-bottom group-data-closed/popup:slide-out-to-bottom group-data-starting-style/popup-scale-100 group-data-ending-style/popup-scale-100 group-data-open/popup:animate-in group-data-closed/popup:animate-out top-auto bottom-0 h-full translate-y-0 rounded-b-none group-data-closed/popup:duration-200 group-data-closed/popup:ease-[cubic-bezier(1,0,0.72,0.32)] group-data-ending-style/popup:translate-y-full group-data-open/popup:duration-300 group-data-open/popup:ease-[cubic-bezier(0.32,0.72,0,1)] group-data-starting-style/popup:translate-y-full": bottom
+                  "group-data-open/popup:slide-in-from-bottom group-data-closed/popup:slide-out-to-bottom group-data-starting-style/popup-scale-100 group-data-ending-style/popup-scale-100 group-data-open/popup:animate-in group-data-closed/popup:animate-out top-auto bottom-0 h-full translate-y-0 rounded-b-none group-data-closed/popup:duration-200 group-data-ending-style/popup:translate-y-full group-data-open/popup:duration-300 group-data-open/popup:ease-[cubic-bezier(0.32,0.72,0,1)] group-data-closed/popup:ease-[cubic-bezier(0.32,0.72,0,1)] group-data-starting-style/popup:translate-y-full": bottom
                 },
                 className
               ),
               ...props,
               children
             }
+          ),
+          showCloseButton && /* @__PURE__ */ jsxs(
+            DialogClose,
+            {
+              className: cn("pointer-events-auto fixed top-[7px] z-50 transition-all", { "left-4": closePosition === "top-left", "right-4": closePosition === "top-right", "group-data-closed/popup:duration-pop-hover group-data-open/popup:duration-pop-hover group-data-open/popup:ease-pop-hover group-data-closed/popup:ease-out group-data-ending-style/popup:scale-[0.96] group-data-ending-style/popup:opacity-0 group-data-starting-style/popup:scale-[0.96] group-data-starting-style/popup:opacity-0": !bottom, " group-data-starting-style/popup-scale-[0.96] group-data-ending-style/popup-scale-100 group-data-open/popup:animate-in group-data-closed/popup:animate-out group-data-closed/popup:duration-200 group-data-closed/popup:ease-[cubic-bezier(1,0,0.72,0.32)] group-data-ending-style/popup:translate-y-1/2 group-data-open/popup:duration-pop-hover group-data-open/popup:ease-[cubic-bezier(0.32,0.72,0,1)] group-data-starting-style/popup:translate-y-1/2": bottom }),
+              "aria-label": "Close",
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" }),
+                /* @__PURE__ */ jsx("span", { className: "before:bg-tint-700-reversed relative block before:absolute before:-inset-1.5 before:rounded-full before:backdrop-blur-sm", children: /* @__PURE__ */ jsx("span", { className: "bg-primary-foreground text-background relative z-10 flex size-10 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx(XClose, { className: "size-[18px]" }) }) })
+              ]
+            }
           )
         ]
       }
@@ -690,28 +690,53 @@ function DropdownMenuTrigger({ ...props }) {
   return /* @__PURE__ */ jsx(Menu.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
 }
 function DropdownMenuContent({
-  className,
+  align = "start",
+  alignOffset = 0,
+  side = "bottom",
   sideOffset = 4,
-  positionerProps,
-  children,
+  className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { sideOffset, ...positionerProps, children: /* @__PURE__ */ jsx(
-    Menu.Popup,
+  return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(
+    Menu.Positioner,
     {
-      "data-slot": "dropdown-menu-content",
-      className: cn(
-        "bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 border-border-border-edge-light z-50 max-h-(--available-height) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-2xl border p-1.5 shadow-xl",
-        className
-      ),
-      ...props,
-      children
+      className: "isolate z-50 outline-none",
+      align,
+      alignOffset,
+      side,
+      sideOffset,
+      children: /* @__PURE__ */ jsx(
+        Menu.Popup,
+        {
+          "data-slot": "dropdown-menu-content",
+          className: cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-white dark:ring-gray-700 bg-popover text-popover-foreground data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-xs p-1 shadow-xl ring-1 duration-100 outline-none data-closed:overflow-hidden", className),
+          ...props
+        }
+      )
     }
-  ) }) });
+  ) });
 }
 function DropdownMenuGroup({ ...props }) {
   return /* @__PURE__ */ jsx(Menu.Group, { "data-slot": "dropdown-menu-group", ...props });
 }
+function DropdownMenuLabel({
+  className,
+  inset,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Menu.GroupLabel,
+    {
+      "data-slot": "dropdown-menu-label",
+      "data-inset": inset,
+      className: cn(
+        "text-muted-foreground px-2 py-1.5 text-xs font-medium data-inset:pl-8",
+        className
+      ),
+      ...props
+    }
+  );
+}
 function DropdownMenuItem({
   className,
   inset,
@@ -725,91 +750,140 @@ function DropdownMenuItem({
       "data-inset": inset,
       "data-variant": variant,
       className: cn(
-        "data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-[variant=destructive]:data-highlighted:text-destructive data-[variant=destructive]:*:[svg]:text-destructive! [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-1.5 rounded-xs px-2 py-1.5 text-sm font-medium outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground group/dropdown-menu-item relative flex cursor-default items-center gap-2 rounded-xs px-2 py-1.5 text-sm font-medium outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       ...props
     }
   );
 }
+function DropdownMenuSub({ ...props }) {
+  return /* @__PURE__ */ jsx(Menu.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
+}
+function DropdownMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    Menu.SubmenuTrigger,
+    {
+      "data-slot": "dropdown-menu-sub-trigger",
+      "data-inset": inset,
+      className: cn(
+        "focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-popup-open:bg-accent data-popup-open:text-accent-foreground flex cursor-default items-center gap-2 rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto" })
+      ]
+    }
+  );
+}
+function DropdownMenuSubContent({
+  align = "start",
+  alignOffset = -3,
+  side = "right",
+  sideOffset = 0,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    DropdownMenuContent,
+    {
+      "data-slot": "dropdown-menu-sub-content",
+      className: cn(
+        "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-white dark:ring-gray-700 bg-popover text-popover-foreground w-auto min-w-[96px] rounded-sm p-1 shadow-lg ring-1 duration-100",
+        className
+      ),
+      align,
+      alignOffset,
+      side,
+      sideOffset,
+      ...props
+    }
+  );
+}
 function DropdownMenuCheckboxItem({
   className,
   children,
   checked,
+  inset,
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
     Menu.CheckboxItem,
     {
       "data-slot": "dropdown-menu-checkbox-item",
+      "data-inset": inset,
       className: cn(
-        "data-highlighted:bg-accent data-highlighted:text-accent-foreground relative flex cursor-default items-center gap-1.5 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       checked,
       ...props,
       children: [
-        /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(
-          Menu.CheckboxItemIndicator,
+        /* @__PURE__ */ jsx(
+          "span",
           {
-            keepMounted: true,
-            className: "transition data-checked:scale-100 data-checked:opacity-100 data-unchecked:scale-75 data-unchecked:opacity-0",
-            children: /* @__PURE__ */ jsx(CheckCircle, { className: "size-4" })
+            className: "pointer-events-none absolute right-2 flex items-center justify-center",
+            "data-slot": "dropdown-menu-checkbox-item-indicator",
+            children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(
+              Check,
+              {}
+            ) })
           }
-        ) }),
+        ),
         children
       ]
     }
   );
 }
 function DropdownMenuRadioGroup({ ...props }) {
-  return /* @__PURE__ */ jsx(Menu.RadioGroup, { "data-slot": "dropdown-menu-radio-group", ...props });
+  return /* @__PURE__ */ jsx(
+    Menu.RadioGroup,
+    {
+      "data-slot": "dropdown-menu-radio-group",
+      ...props
+    }
+  );
 }
 function DropdownMenuRadioItem({
   className,
   children,
+  inset,
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
     Menu.RadioItem,
     {
       "data-slot": "dropdown-menu-radio-item",
+      "data-inset": inset,
       className: cn(
-        "data-highlighted:bg-accent data-highlighted:text-accent-foreground relative flex cursor-default items-center gap-1.5 rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-xs py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(
-          Menu.RadioItemIndicator,
+        /* @__PURE__ */ jsx(
+          "span",
           {
-            keepMounted: true,
-            className: "transition data-checked:scale-100 data-checked:opacity-100 data-unchecked:scale-75 data-unchecked:opacity-0",
-            children: /* @__PURE__ */ jsx(Circle, { className: "size-2 fill-current" })
+            className: "pointer-events-none absolute right-2 flex items-center justify-center",
+            "data-slot": "dropdown-menu-radio-item-indicator",
+            children: /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { children: /* @__PURE__ */ jsx(
+              Check,
+              {}
+            ) })
           }
-        ) }),
+        ),
         children
       ]
     }
   );
 }
-function DropdownMenuLabel({
-  className,
-  inset,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Menu.GroupLabel,
-    {
-      "data-slot": "dropdown-menu-label",
-      "data-inset": inset,
-      className: cn("px-2 py-1.5 text-sm font-medium data-inset:pl-8", className),
-      ...props,
-      children
-    }
-  );
-}
 function DropdownMenuSeparator({
   className,
   ...props
@@ -823,62 +897,22 @@ function DropdownMenuSeparator({
     }
   );
 }
-function DropdownMenuShortcut({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "data-slot": "dropdown-menu-shortcut",
-      className: cn("text-muted-foreground ml-auto text-xs tracking-widest", className),
-      ...props
-    }
-  );
-}
-function DropdownMenuSub({ ...props }) {
-  return /* @__PURE__ */ jsx(Menu.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });
-}
-function DropdownMenuSubTrigger({
+function DropdownMenuShortcut({
   className,
-  inset,
-  children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs(
-    Menu.SubmenuTrigger,
+  return /* @__PURE__ */ jsx(
+    "span",
     {
-      "data-slot": "dropdown-menu-sub-trigger",
-      "data-inset": inset,
+      "data-slot": "dropdown-menu-shortcut",
       className: cn(
-        "data-highlighted:bg-accent data-highlighted:text-accent-foreground data-popup-open:bg-accent data-popup-open:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-1.5 rounded-xs px-2 py-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest",
         className
       ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto size-4" })
-      ]
+      ...props
     }
   );
 }
-function DropdownMenuSubContent({
-  className,
-  sideOffset = 4,
-  positionerProps,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { sideOffset, ...positionerProps, children: /* @__PURE__ */ jsx(
-    Menu.Popup,
-    {
-      "data-slot": "dropdown-menu-sub-content",
-      className: cn(
-        "bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 origin-(--transform-origin) overflow-hidden rounded-2xl border p-1 shadow-lg",
-        className
-      ),
-      ...props,
-      children
-    }
-  ) }) });
-}
 function Footer({
   theme = "template",
   logo,
@@ -1142,37 +1176,59 @@ function NotificationBadge({
   });
 }
 var SectionFlourish = () => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center self-stretch py-8 text-xl", children: "\u2726" });
-function TooltipProvider({ delay = 0, ...props }) {
-  return /* @__PURE__ */ jsx(Tooltip$1.Provider, { "data-slot": "tooltip-provider", delay, ...props });
+function TooltipProvider({
+  delay = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Tooltip$1.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delay,
+      ...props
+    }
+  );
 }
 function Tooltip({ ...props }) {
-  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(Tooltip$1.Root, { "data-slot": "tooltip", ...props }) });
+  return /* @__PURE__ */ jsx(Tooltip$1.Root, { "data-slot": "tooltip", ...props });
 }
 function TooltipTrigger({ ...props }) {
   return /* @__PURE__ */ jsx(Tooltip$1.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({
   className,
+  side = "top",
+  sideOffset = 4,
+  align = "center",
+  alignOffset = 0,
   children,
-  positionerProps,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { ...positionerProps, className: "isolate z-50", children: /* @__PURE__ */ jsxs(
-    Tooltip$1.Popup,
+  return /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(
+    Tooltip$1.Positioner,
     {
-      "data-slot": "tooltip-content",
-      className: cn(
-        "bg-foreground text-background z-50 w-fit max-w-xs origin-(--transform-origin) rounded-[8px] px-3 py-2 text-xs font-medium",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "flex data-[side=bottom]:-top-[6px] data-[side=bottom]:-translate-x-1/2 data-[side=bottom]:rotate-0 data-[side=left]:right-[-13px] data-[side=left]:-translate-y-1/2 data-[side=left]:rotate-90 data-[side=right]:left-[-13px] data-[side=right]:-translate-y-1/2 data-[side=right]:-rotate-90 data-[side=top]:-bottom-[6px] data-[side=top]:-translate-x-1/2 data-[side=top]:rotate-180", children: /* @__PURE__ */ jsx(TooltipArrow, {}) }),
-        children,
-        /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "cn-tooltip-arrow bg-foreground fill-foreground z-50 data-[side=bottom]:top-1 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })
-      ]
+      align,
+      alignOffset,
+      side,
+      sideOffset,
+      className: "isolate z-50",
+      children: /* @__PURE__ */ jsxs(
+        Tooltip$1.Popup,
+        {
+          "data-slot": "tooltip-content",
+          className: cn(
+            "data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 bg-foreground text-background z-50 w-fit max-w-xs origin-(--transform-origin) rounded-md px-3 py-1.5 text-xs",
+            className
+          ),
+          ...props,
+          children: [
+            children,
+            /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "flex data-[side=bottom]:-top-[6px] data-[side=bottom]:rotate-0 data-[side=left]:right-[-13px] data-[side=left]:rotate-90 data-[side=right]:left-[-13px] data-[side=right]:-rotate-90 data-[side=top]:-bottom-[6px] data-[side=top]:rotate-180", children: /* @__PURE__ */ jsx(TooltipArrow, {}) })
+          ]
+        }
+      )
     }
-  ) }) });
+  ) });
 }
 var TooltipArrow = (props) => {
   return /* @__PURE__ */ jsxs(
@@ -1257,16 +1313,8 @@ function SectionHeader({
             /* @__PURE__ */ jsx(
               TooltipContent,
               {
-                positionerProps: {
-                  sideOffset: 2,
-                  alignOffset: 5,
-                  collisionAvoidance: {
-                    side: "shift",
-                    align: "shift",
-                    fallbackAxisSide: "none"
-                  },
-                  collisionPadding: 16
-                },
+                sideOffset: 2,
+                alignOffset: 5,
                 children: /* @__PURE__ */ jsx("p", { children: description })
               }
             )