@dmsi/wedgekit-react 0.0.185 → 0.0.186

package/dist/{chunk-FFU6FB3K.js → chunk-4BGVBVKV.js}

@@ -1,9 +1,9 @@
-import {
-  useMatchesMobile
-} from "./chunk-WNQ53SVY.js";
 import {
   Label
 } from "./chunk-JWCT72WR.js";
+import {
+  useMatchesMobile
+} from "./chunk-WNQ53SVY.js";
 import {
   Paragraph
 } from "./chunk-HVI3CL7Y.js";
@@ -47,7 +47,8 @@ var MenuOption = ({
   activeMenu,
   mobilePositionTo,
   highlightMatchingText = false,
-  menuValue
+  menuValue,
+  onMouseMove
 }) => {
   const uniqueId = useId();
   const internalRef = useRef(null);
@@ -64,6 +65,11 @@ var MenuOption = ({
       onSubMenuLeave(subMenuLevel);
     }
   };
+  const handleMouseMove = () => {
+    if (subMenu && onMouseMove && !disabled) {
+      onMouseMove();
+    }
+  };
   const handleSubMenuEnter = () => {
     if (onSubMenuEnter) {
       onSubMenuEnter();
@@ -122,7 +128,8 @@ var MenuOption = ({
           }
         },
         onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave
+        onMouseLeave: handleMouseLeave,
+        onMouseMove: handleMouseMove
       }, additionalAttributes), {
         tabIndex: -1,
         role: "menuitem",

package/dist/{chunk-5GUW4DUY.js → chunk-AEDQLVKH.js}

@@ -19,6 +19,10 @@ function useSubMenuSystem(mobilePositionTo) {
   const subMenuRefs = useRef({});
   const hoverTimeoutRef = useRef(null);
   const closeTimeoutRef = useRef(null);
+  const mouseStopTimeoutRef = useRef(null);
+  const isMouseMovingRef = useRef(false);
+  const pendingOpenActionRef = useRef(null);
+  const pendingCloseActionRef = useRef(null);
   const isMobile = useMatchesMobile();
   const toggleMenu = (menuId, level) => {
     if (closeTimeoutRef.current) {
@@ -58,36 +62,67 @@ function useSubMenuSystem(mobilePositionTo) {
       return newActiveMenus;
     });
   };
+  const executePendingActions = useCallback(() => {
+    if (pendingCloseActionRef.current) {
+      pendingCloseActionRef.current();
+      pendingCloseActionRef.current = null;
+    }
+    if (pendingOpenActionRef.current) {
+      pendingOpenActionRef.current();
+      pendingOpenActionRef.current = null;
+    }
+  }, []);
   const openMenuWithDelay = (menuId, level, delay = 150) => {
     if (isMobile) {
       return;
     }
-    if (hoverTimeoutRef.current) {
-      clearTimeout(hoverTimeoutRef.current);
+    pendingOpenActionRef.current = () => {
+      if (hoverTimeoutRef.current) {
+        clearTimeout(hoverTimeoutRef.current);
+      }
+      hoverTimeoutRef.current = setTimeout(() => {
+        openMenu(menuId, level);
+      }, delay);
+    };
+    if (!isMouseMovingRef.current) {
+      executePendingActions();
     }
-    hoverTimeoutRef.current = setTimeout(() => {
-      openMenu(menuId, level);
-    }, delay);
   };
   const closeMenuWithDelay = (level, delay = 500) => {
     if (isMobile) {
       return;
     }
-    if (hoverTimeoutRef.current) {
-      clearTimeout(hoverTimeoutRef.current);
-      hoverTimeoutRef.current = null;
+    pendingCloseActionRef.current = () => {
+      if (hoverTimeoutRef.current) {
+        clearTimeout(hoverTimeoutRef.current);
+        hoverTimeoutRef.current = null;
+      }
+      closeTimeoutRef.current = setTimeout(() => {
+        closeSubMenuLevel(level);
+      }, delay);
+    };
+    if (!isMouseMovingRef.current) {
+      executePendingActions();
+    }
+  };
+  const handleMouseMove = () => {
+    isMouseMovingRef.current = true;
+    if (mouseStopTimeoutRef.current) {
+      clearTimeout(mouseStopTimeoutRef.current);
     }
-    closeTimeoutRef.current = setTimeout(() => {
-      closeSubMenuLevel(level);
-    }, delay);
+    mouseStopTimeoutRef.current = setTimeout(() => {
+      isMouseMovingRef.current = false;
+      executePendingActions();
+    }, 200);
   };
   const cancelCloseTimeout = () => {
     if (isMobile) {
       return;
     }
-    if (closeTimeoutRef.current) {
-      clearTimeout(closeTimeoutRef.current);
-      closeTimeoutRef.current = null;
+    if (mouseStopTimeoutRef.current) {
+      clearTimeout(mouseStopTimeoutRef.current);
+      mouseStopTimeoutRef.current = null;
+      isMouseMovingRef.current = false;
     }
   };
   const closeSubMenuLevel = (level) => {
@@ -203,6 +238,7 @@ function useSubMenuSystem(mobilePositionTo) {
       onSubMenuHover: openMenuWithDelay,
       onSubMenuLeave: closeMenuWithDelay,
       onSubMenuEnter: cancelCloseTimeout,
+      onMouseMove: handleMouseMove,
       toggleMenu,
       mobilePositionTo,
       activeMenu,
@@ -217,9 +253,9 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     left: 0,
     minWidth: 0
   });
-  const isMobile = useMatchesMobile();
+  const isMobile = options == null ? void 0 : options.isMobile;
   const updatePosition = useCallback(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+    var _a, _b, _c;
     if (!(elementRef == null ? void 0 : elementRef.current)) return;
     const triggerRect = elementRef.current.getBoundingClientRect();
     const menuRect = (_b = (_a = options == null ? void 0 : options.menuRef) == null ? void 0 : _a.current) == null ? void 0 : _b.getBoundingClientRect();
@@ -238,15 +274,27 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     } else if (position === "bottom-right") {
       left = triggerRect.right + window.scrollX - menuWidth;
     } else if (position === "right") {
-      left = triggerRect.right + window.scrollX;
+      if (isMobile) {
+        left = triggerRect.left + window.scrollX;
+      } else {
+        left = triggerRect.right + window.scrollX;
+      }
+    }
+    const overflowsRightViewport = left + menuWidth > viewportWidth;
+    if (overflowsRightViewport) {
+      const newLeft = triggerRect.left - menuWidth;
+      const overflowsLeftViewport = newLeft < 0;
+      if (overflowsLeftViewport) {
+        left = (viewportWidth - menuWidth) / 2;
+      } else {
+        left = newLeft;
+      }
     }
-    const overflowsLeftViewport = left + menuWidth > viewportWidth;
-    if (overflowsLeftViewport) {
-      left = triggerRect.left - menuWidth;
+    if (isMobile && position === "right") {
+      top = triggerRect.top + triggerRect.height + topOffset;
     }
-    if (isMobile) {
-      left = triggerRect.left + menuWidth > viewportWidth ? Math.max(viewportWidth - menuWidth, 0) - 8 : triggerRect.left;
-      top = ((_f = (_e = (_d = elementRef.current.parentElement) == null ? void 0 : _d.getBoundingClientRect()) == null ? void 0 : _e.top) != null ? _f : 0) + ((_i = (_h = (_g = elementRef.current.parentElement) == null ? void 0 : _g.getBoundingClientRect()) == null ? void 0 : _h.height) != null ? _i : 0) + topOffset;
+    if (isMobile && menuWidth > viewportWidth) {
+      left = 0;
     }
     setMenuPosition({
       top,

package/dist/{chunk-Z2KZO4J3.js → chunk-GKYKZGS7.js}

@@ -1,18 +1,18 @@
 import {
   Menu
-} from "./chunk-UBU6IJML.js";
+} from "./chunk-M4LOHASV.js";
 import {
   useSubMenuSystem
-} from "./chunk-5GUW4DUY.js";
+} from "./chunk-AEDQLVKH.js";
 import {
   MenuOption
-} from "./chunk-FFU6FB3K.js";
-import {
-  Search
-} from "./chunk-PMBEIP24.js";
+} from "./chunk-4BGVBVKV.js";
 import {
   CSS
 } from "./chunk-WVUIIBRR.js";
+import {
+  Search
+} from "./chunk-IDSFWKOR.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-PMBEIP24.js → chunk-IDSFWKOR.js}

@@ -1,6 +1,6 @@
 import {
   Input
-} from "./chunk-4T3DRGLF.js";
+} from "./chunk-MVGOAMTP.js";
 import {
   __objRest,
   __spreadValues

package/dist/{chunk-XH65MD2C.js → chunk-KADNOKNW.js}

@@ -1,6 +1,6 @@
 import {
   InputBase
-} from "./chunk-4T3DRGLF.js";
+} from "./chunk-MVGOAMTP.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-UBU6IJML.js → chunk-M4LOHASV.js}

@@ -1,12 +1,12 @@
 import {
   useMenuPosition
-} from "./chunk-5GUW4DUY.js";
-import {
-  useMatchesMobile
-} from "./chunk-WNQ53SVY.js";
+} from "./chunk-AEDQLVKH.js";
 import {
   findDocumentRoot
 } from "./chunk-6LN6QT6M.js";
+import {
+  useMatchesMobile
+} from "./chunk-WNQ53SVY.js";
 import {
   __objRest,
   __spreadProps,
@@ -73,7 +73,8 @@ var Menu = (_a) => {
       isOpen: show,
       setIsOpen: setShow,
       menuRef: internalRef,
-      topOffset
+      topOffset,
+      isMobile: !!(isMobile && mobilePositionTo)
     }
   );
   useEffect(() => {
@@ -146,6 +147,7 @@ var Menu = (_a) => {
           "shadow-4 rounded-base bg-background-grouped-primary-normal overflow-x-hidden overflow-y-auto flex flex-col outline-0",
           "fixed",
           "z-50",
+          "max-w-screen",
           mobileHide && "opacity-0 pointer-events-none",
           className
         )

package/dist/components/DataGridCell.cjs

@@ -907,6 +907,10 @@ function useSubMenuSystem(mobilePositionTo) {
   const subMenuRefs = (0, import_react7.useRef)({});
   const hoverTimeoutRef = (0, import_react7.useRef)(null);
   const closeTimeoutRef = (0, import_react7.useRef)(null);
+  const mouseStopTimeoutRef = (0, import_react7.useRef)(null);
+  const isMouseMovingRef = (0, import_react7.useRef)(false);
+  const pendingOpenActionRef = (0, import_react7.useRef)(null);
+  const pendingCloseActionRef = (0, import_react7.useRef)(null);
   const isMobile = useMatchesMobile();
   const toggleMenu = (menuId, level) => {
     if (closeTimeoutRef.current) {
@@ -946,36 +950,67 @@ function useSubMenuSystem(mobilePositionTo) {
       return newActiveMenus;
     });
   };
+  const executePendingActions = (0, import_react7.useCallback)(() => {
+    if (pendingCloseActionRef.current) {
+      pendingCloseActionRef.current();
+      pendingCloseActionRef.current = null;
+    }
+    if (pendingOpenActionRef.current) {
+      pendingOpenActionRef.current();
+      pendingOpenActionRef.current = null;
+    }
+  }, []);
   const openMenuWithDelay = (menuId, level, delay = 150) => {
     if (isMobile) {
       return;
     }
-    if (hoverTimeoutRef.current) {
-      clearTimeout(hoverTimeoutRef.current);
+    pendingOpenActionRef.current = () => {
+      if (hoverTimeoutRef.current) {
+        clearTimeout(hoverTimeoutRef.current);
+      }
+      hoverTimeoutRef.current = setTimeout(() => {
+        openMenu(menuId, level);
+      }, delay);
+    };
+    if (!isMouseMovingRef.current) {
+      executePendingActions();
     }
-    hoverTimeoutRef.current = setTimeout(() => {
-      openMenu(menuId, level);
-    }, delay);
   };
   const closeMenuWithDelay = (level, delay = 500) => {
     if (isMobile) {
       return;
     }
-    if (hoverTimeoutRef.current) {
-      clearTimeout(hoverTimeoutRef.current);
-      hoverTimeoutRef.current = null;
+    pendingCloseActionRef.current = () => {
+      if (hoverTimeoutRef.current) {
+        clearTimeout(hoverTimeoutRef.current);
+        hoverTimeoutRef.current = null;
+      }
+      closeTimeoutRef.current = setTimeout(() => {
+        closeSubMenuLevel(level);
+      }, delay);
+    };
+    if (!isMouseMovingRef.current) {
+      executePendingActions();
     }
-    closeTimeoutRef.current = setTimeout(() => {
-      closeSubMenuLevel(level);
-    }, delay);
+  };
+  const handleMouseMove = () => {
+    isMouseMovingRef.current = true;
+    if (mouseStopTimeoutRef.current) {
+      clearTimeout(mouseStopTimeoutRef.current);
+    }
+    mouseStopTimeoutRef.current = setTimeout(() => {
+      isMouseMovingRef.current = false;
+      executePendingActions();
+    }, 200);
   };
   const cancelCloseTimeout = () => {
     if (isMobile) {
       return;
     }
-    if (closeTimeoutRef.current) {
-      clearTimeout(closeTimeoutRef.current);
-      closeTimeoutRef.current = null;
+    if (mouseStopTimeoutRef.current) {
+      clearTimeout(mouseStopTimeoutRef.current);
+      mouseStopTimeoutRef.current = null;
+      isMouseMovingRef.current = false;
     }
   };
   const closeSubMenuLevel = (level) => {
@@ -1091,6 +1126,7 @@ function useSubMenuSystem(mobilePositionTo) {
       onSubMenuHover: openMenuWithDelay,
       onSubMenuLeave: closeMenuWithDelay,
       onSubMenuEnter: cancelCloseTimeout,
+      onMouseMove: handleMouseMove,
       toggleMenu,
       mobilePositionTo,
       activeMenu,
@@ -1105,9 +1141,9 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     left: 0,
     minWidth: 0
   });
-  const isMobile = useMatchesMobile();
+  const isMobile = options == null ? void 0 : options.isMobile;
   const updatePosition = (0, import_react7.useCallback)(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+    var _a, _b, _c;
     if (!(elementRef == null ? void 0 : elementRef.current)) return;
     const triggerRect = elementRef.current.getBoundingClientRect();
     const menuRect = (_b = (_a = options == null ? void 0 : options.menuRef) == null ? void 0 : _a.current) == null ? void 0 : _b.getBoundingClientRect();
@@ -1126,15 +1162,27 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     } else if (position === "bottom-right") {
       left = triggerRect.right + window.scrollX - menuWidth;
     } else if (position === "right") {
-      left = triggerRect.right + window.scrollX;
+      if (isMobile) {
+        left = triggerRect.left + window.scrollX;
+      } else {
+        left = triggerRect.right + window.scrollX;
+      }
+    }
+    const overflowsRightViewport = left + menuWidth > viewportWidth;
+    if (overflowsRightViewport) {
+      const newLeft = triggerRect.left - menuWidth;
+      const overflowsLeftViewport = newLeft < 0;
+      if (overflowsLeftViewport) {
+        left = (viewportWidth - menuWidth) / 2;
+      } else {
+        left = newLeft;
+      }
     }
-    const overflowsLeftViewport = left + menuWidth > viewportWidth;
-    if (overflowsLeftViewport) {
-      left = triggerRect.left - menuWidth;
+    if (isMobile && position === "right") {
+      top = triggerRect.top + triggerRect.height + topOffset;
     }
-    if (isMobile) {
-      left = triggerRect.left + menuWidth > viewportWidth ? Math.max(viewportWidth - menuWidth, 0) - 8 : triggerRect.left;
-      top = ((_f = (_e = (_d = elementRef.current.parentElement) == null ? void 0 : _d.getBoundingClientRect()) == null ? void 0 : _e.top) != null ? _f : 0) + ((_i = (_h = (_g = elementRef.current.parentElement) == null ? void 0 : _g.getBoundingClientRect()) == null ? void 0 : _h.height) != null ? _i : 0) + topOffset;
+    if (isMobile && menuWidth > viewportWidth) {
+      left = 0;
     }
     setMenuPosition({
       top,
@@ -1261,7 +1309,8 @@ var Menu = (_a) => {
       isOpen: show,
       setIsOpen: setShow,
       menuRef: internalRef,
-      topOffset
+      topOffset,
+      isMobile: !!(isMobile && mobilePositionTo)
     }
   );
   (0, import_react8.useEffect)(() => {
@@ -1334,6 +1383,7 @@ var Menu = (_a) => {
           "shadow-4 rounded-base bg-background-grouped-primary-normal overflow-x-hidden overflow-y-auto flex flex-col outline-0",
           "fixed",
           "z-50",
+          "max-w-screen",
           mobileHide && "opacity-0 pointer-events-none",
           className
         )
@@ -1540,7 +1590,8 @@ var MenuOption = ({
   activeMenu,
   mobilePositionTo,
   highlightMatchingText = false,
-  menuValue
+  menuValue,
+  onMouseMove
 }) => {
   const uniqueId = (0, import_react9.useId)();
   const internalRef = (0, import_react9.useRef)(null);
@@ -1557,6 +1608,11 @@ var MenuOption = ({
       onSubMenuLeave(subMenuLevel);
     }
   };
+  const handleMouseMove = () => {
+    if (subMenu && onMouseMove && !disabled) {
+      onMouseMove();
+    }
+  };
   const handleSubMenuEnter = () => {
     if (onSubMenuEnter) {
       onSubMenuEnter();
@@ -1615,7 +1671,8 @@ var MenuOption = ({
           }
         },
         onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave
+        onMouseLeave: handleMouseLeave,
+        onMouseMove: handleMouseMove
       }, additionalAttributes), {
         tabIndex: -1,
         role: "menuitem",

package/dist/components/DataGridCell.js

@@ -4,17 +4,17 @@ import {
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "../chunk-Z2KZO4J3.js";
-import "../chunk-UBU6IJML.js";
-import "../chunk-5GUW4DUY.js";
-import "../chunk-FFU6FB3K.js";
-import "../chunk-WNQ53SVY.js";
+} from "../chunk-GKYKZGS7.js";
+import "../chunk-M4LOHASV.js";
+import "../chunk-AEDQLVKH.js";
+import "../chunk-4BGVBVKV.js";
+import "../chunk-WVUIIBRR.js";
 import "../chunk-6LN6QT6M.js";
-import "../chunk-PMBEIP24.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+import "../chunk-IDSFWKOR.js";
+import "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
-import "../chunk-WVUIIBRR.js";
+import "../chunk-WNQ53SVY.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-HVI3CL7Y.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";

package/dist/components/DateInput.js

@@ -1,21 +1,21 @@
-import {
-  calculateCursorPosition,
-  formatDate,
-  formatInputValue,
-  isValidDate,
-  parseInputDate
-} from "../chunk-M3433XEJ.js";
 import {
   findDocumentRoot
 } from "../chunk-6LN6QT6M.js";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
 import {
   CalendarRange
 } from "../chunk-4XA32LKR.js";
+import {
+  calculateCursorPosition,
+  formatDate,
+  formatInputValue,
+  isValidDate,
+  parseInputDate
+} from "../chunk-M3433XEJ.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/DateRangeInput.js

@@ -1,22 +1,22 @@
-import {
-  calculateCursorPosition,
-  formatDate,
-  formatInputValue,
-  isValidDate,
-  isValidDateRangeOrder,
-  parseInputDate
-} from "../chunk-M3433XEJ.js";
 import {
   findDocumentRoot
 } from "../chunk-6LN6QT6M.js";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
 import {
   CalendarRange
 } from "../chunk-4XA32LKR.js";
+import {
+  calculateCursorPosition,
+  formatDate,
+  formatInputValue,
+  isValidDate,
+  isValidDateRangeOrder,
+  parseInputDate
+} from "../chunk-M3433XEJ.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/FilterGroup.js

@@ -2,22 +2,22 @@
 import {
   OptionPill
 } from "../chunk-LM5MKBPM.js";
-import {
-  Checkbox
-} from "../chunk-WFQEE2OO.js";
 import {
   Search
-} from "../chunk-PMBEIP24.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-IDSFWKOR.js";
+import "../chunk-MVGOAMTP.js";
 import {
   Label
 } from "../chunk-JWCT72WR.js";
+import {
+  Checkbox
+} from "../chunk-WFQEE2OO.js";
+import "../chunk-FKMKHLQH.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-HVI3CL7Y.js";
 import {
   Link
 } from "../chunk-I6GEUF6Y.js";
-import "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Input.js

@@ -6,9 +6,9 @@ import {
   InputBase,
   Percentage,
   UOM
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";
 import "../chunk-ORMEWXMH.js";

package/dist/components/Menu.cjs

@@ -98,9 +98,9 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     left: 0,
     minWidth: 0
   });
-  const isMobile = useMatchesMobile();
+  const isMobile = options == null ? void 0 : options.isMobile;
   const updatePosition = (0, import_react4.useCallback)(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+    var _a, _b, _c;
     if (!(elementRef == null ? void 0 : elementRef.current)) return;
     const triggerRect = elementRef.current.getBoundingClientRect();
     const menuRect = (_b = (_a = options == null ? void 0 : options.menuRef) == null ? void 0 : _a.current) == null ? void 0 : _b.getBoundingClientRect();
@@ -119,15 +119,27 @@ function useMenuPosition(elementRef, position = "bottom", options) {
     } else if (position === "bottom-right") {
       left = triggerRect.right + window.scrollX - menuWidth;
     } else if (position === "right") {
-      left = triggerRect.right + window.scrollX;
+      if (isMobile) {
+        left = triggerRect.left + window.scrollX;
+      } else {
+        left = triggerRect.right + window.scrollX;
+      }
     }
-    const overflowsLeftViewport = left + menuWidth > viewportWidth;
-    if (overflowsLeftViewport) {
-      left = triggerRect.left - menuWidth;
+    const overflowsRightViewport = left + menuWidth > viewportWidth;
+    if (overflowsRightViewport) {
+      const newLeft = triggerRect.left - menuWidth;
+      const overflowsLeftViewport = newLeft < 0;
+      if (overflowsLeftViewport) {
+        left = (viewportWidth - menuWidth) / 2;
+      } else {
+        left = newLeft;
+      }
+    }
+    if (isMobile && position === "right") {
+      top = triggerRect.top + triggerRect.height + topOffset;
     }
-    if (isMobile) {
-      left = triggerRect.left + menuWidth > viewportWidth ? Math.max(viewportWidth - menuWidth, 0) - 8 : triggerRect.left;
-      top = ((_f = (_e = (_d = elementRef.current.parentElement) == null ? void 0 : _d.getBoundingClientRect()) == null ? void 0 : _e.top) != null ? _f : 0) + ((_i = (_h = (_g = elementRef.current.parentElement) == null ? void 0 : _g.getBoundingClientRect()) == null ? void 0 : _h.height) != null ? _i : 0) + topOffset;
+    if (isMobile && menuWidth > viewportWidth) {
+      left = 0;
     }
     setMenuPosition({
       top,
@@ -254,7 +266,8 @@ var Menu = (_a) => {
       isOpen: show,
       setIsOpen: setShow,
       menuRef: internalRef,
-      topOffset
+      topOffset,
+      isMobile: !!(isMobile && mobilePositionTo)
     }
   );
   (0, import_react5.useEffect)(() => {
@@ -327,6 +340,7 @@ var Menu = (_a) => {
           "shadow-4 rounded-base bg-background-grouped-primary-normal overflow-x-hidden overflow-y-auto flex flex-col outline-0",
           "fixed",
           "z-50",
+          "max-w-screen",
           mobileHide && "opacity-0 pointer-events-none",
           className
         )

package/dist/components/Menu.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   Menu
-} from "../chunk-UBU6IJML.js";
-import "../chunk-5GUW4DUY.js";
-import "../chunk-WNQ53SVY.js";
+} from "../chunk-M4LOHASV.js";
+import "../chunk-AEDQLVKH.js";
 import "../chunk-6LN6QT6M.js";
+import "../chunk-WNQ53SVY.js";
 import "../chunk-ORMEWXMH.js";
 export {
   Menu