@muraldevkit/ui-toolkit 4.68.0-dev-NFbt.1 → 4.68.0-dev-nPeA.1

package/dist/cjs/components/menu/context/MrlMenuContext.js

@@ -2,7 +2,8 @@
 
 var React = require('react');
 
-function _interopNamespaceDefault(e) {
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -19,7 +20,7 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 /**
  * Adds context for the MrlMenu component

package/dist/cjs/components/menu/context/MrlMenuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MrlMenuContext.js","sources":["../../../../../src/components/menu/context/MrlMenuContext.ts"],"sourcesContent":["import * as React from 'react';\n\ntype MrlMenuContext = {\n\t/**\n\t * Close menu is shared in context to allow for closing the menu from a child component\n\t *\n\t * @returns {void}\n\t */\n\tcloseMenu: (shouldCloseParent?: boolean) => void;\n\n\t/**\n\t * Close parent is shared in context to allow for closing the parent menu from a submenu\n\t *\n\t * @returns {void}\n\t */\n\tcloseParent?: () => void;\n\n\t/**\n\t * Reference to the menu trigger button for focus restoration\n\t */\n\ttriggerRef?: React.RefObject<HTMLElement>;\n};\n\n/**\n * Adds context for the MrlMenu component\n */\nexport const MrlMenuContext = React.createContext<MrlMenuContext | undefined>(undefined);\n"],"names":["MrlMenuContext","React","createContext","undefined"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA;AACA;AACA;AACO,IAAMA,cAAc,gBAAGC,gBAAK,CAACC,aAAa,CAA6BC,SAAS;;;;"}
+{"version":3,"file":"MrlMenuContext.js","sources":["../../../../../src/components/menu/context/MrlMenuContext.ts"],"sourcesContent":["import * as React from 'react';\n\ntype MrlMenuContext = {\n\t/**\n\t * Close menu is shared in context to allow for closing the menu from a child component\n\t *\n\t * @returns {void}\n\t */\n\tcloseMenu: (shouldCloseParent?: boolean) => void;\n\n\t/**\n\t * Close parent is shared in context to allow for closing the parent menu from a submenu\n\t *\n\t * @returns {void}\n\t */\n\tcloseParent?: () => void;\n\n\t/**\n\t * Reference to the menu trigger button for focus restoration\n\t */\n\ttriggerRef?: React.RefObject<HTMLElement>;\n};\n\n/**\n * Adds context for the MrlMenu component\n */\nexport const MrlMenuContext = React.createContext<MrlMenuContext | undefined>(undefined);\n"],"names":["MrlMenuContext","React","createContext","undefined"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAuBA;AACA;AACA;AACO,IAAMA,cAAc,gBAAGC,gBAAK,CAACC,aAAa,CAA6BC,SAAS;;;;"}

package/dist/cjs/components/menu/hooks/useBrowserEdgeScroll.js

@@ -4,6 +4,10 @@ var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHel
 var React = require('react');
 var debounce = require('lodash.debounce');
 
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var debounce__default = /*#__PURE__*/_interopDefault(debounce);
+
 /**
  * useBrowserEdgeScroll hook
  *
@@ -31,7 +35,7 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
 
   // Use a ref to store the initial dimensions of the menu
   var menuRectSizeRef = React.useRef(null);
-  var updateMenuStyle = React.useCallback(function () {
+  var updateMenuStyle = React.useCallback(() => {
     if (disable || !elementRef.current || elementPosition === 'static') return;
     if (elementRef.current) {
       if (!menuRectSizeRef.current) {
@@ -49,8 +53,8 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
       }
     }
   }, [disable, elementRef, elementAlign, elementPosition]);
-  var updateMenuStyleDebounced = debounce(updateMenuStyle, 10);
-  React.useLayoutEffect(function () {
+  var updateMenuStyleDebounced = debounce__default.default(updateMenuStyle, 10);
+  React.useLayoutEffect(() => {
     if (disable || !elementRef.current || elementPosition === 'static') return;
 
     /**
@@ -64,7 +68,7 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
     if (elementRef.current) {
       updateMenuStyle();
     }
-    return function () {
+    return () => {
       observer.disconnect();
       window.removeEventListener('resize', updateMenuStyleDebounced);
       menuRectSizeRef.current = null;
@@ -76,7 +80,7 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
     // is allowing the menu to wait before initializing the menu style without a setTimeout
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [elementRef.current, elementPosition, updateMenuStyle]);
-  var updateOnImageLoad = function updateOnImageLoad() {
+  var updateOnImageLoad = () => {
     var _elementRef$current;
     var elementRect = (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.getBoundingClientRect();
     if (elementRect) {
@@ -88,17 +92,17 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
   /**
    * Listen for image additions to the element and update the menu style when they load
    */
-  React.useEffect(function () {
+  React.useEffect(() => {
     var _elementRef$current2;
     var images = (_elementRef$current2 = elementRef.current) === null || _elementRef$current2 === void 0 ? void 0 : _elementRef$current2.querySelectorAll('img');
     if (images) {
-      images.forEach(function (img) {
+      images.forEach(img => {
         img.addEventListener('load', updateOnImageLoad);
       });
     }
-    return function () {
+    return () => {
       if (images) {
-        images.forEach(function (img) {
+        images.forEach(img => {
           img.removeEventListener('load', updateOnImageLoad);
         });
       }
@@ -106,7 +110,7 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [elementRef.current, updateMenuStyleDebounced]);
   return {
-    isScrolling: isScrolling,
+    isScrolling,
     styles: heightStyle
   };
 };
@@ -121,7 +125,7 @@ var useBrowserEdgeScroll = function useBrowserEdgeScroll(elementRef) {
  * @param viewportHeight - the height of the viewport
  * @returns {string} - the new max height of the menu
  */
-var calculateNewMaxHeight = function calculateNewMaxHeight(elementPosition, elementAlign, elementRef, menuRect, viewportHeight) {
+var calculateNewMaxHeight = (elementPosition, elementAlign, elementRef, menuRect, viewportHeight) => {
   var scrollBuffer = 35;
   var scrollThreshold = 20;
   switch (elementPosition) {
@@ -138,7 +142,7 @@ var calculateNewMaxHeight = function calculateNewMaxHeight(elementPosition, elem
       return null;
   }
 };
-var calculateBottomAlignment = function calculateBottomAlignment(menuRect, viewportHeight, scrollBuffer, scrollThreshold) {
+var calculateBottomAlignment = (menuRect, viewportHeight, scrollBuffer, scrollThreshold) => {
   // Evaluate from the bottom of the viewport to the top of the menu
   if (menuRect.bottom > viewportHeight - scrollThreshold) {
     var calculatedHeight = Math.max(0, viewportHeight - menuRect.top - scrollBuffer);
@@ -146,7 +150,7 @@ var calculateBottomAlignment = function calculateBottomAlignment(menuRect, viewp
   }
   return null;
 };
-var calculateTopAlignment = function calculateTopAlignment(menuRect, elementRef, scrollBuffer, scrollThreshold) {
+var calculateTopAlignment = (menuRect, elementRef, scrollBuffer, scrollThreshold) => {
   var _elementRef$current3;
   var currentRect = (_elementRef$current3 = elementRef.current) === null || _elementRef$current3 === void 0 ? void 0 : _elementRef$current3.getBoundingClientRect();
   // Evaluate distance from the top of the viewport to the bottom of the menu
@@ -156,7 +160,7 @@ var calculateTopAlignment = function calculateTopAlignment(menuRect, elementRef,
   }
   return null;
 };
-var calculateSideAlignment = function calculateSideAlignment(elementAlign, menuRect, viewportHeight, scrollThreshold, scrollBuffer) {
+var calculateSideAlignment = (elementAlign, menuRect, viewportHeight, scrollThreshold, scrollBuffer) => {
   // Evaluate distance from the top of the viewport to the bottom of the menu
   if (elementAlign === 'end' && menuRect.top < scrollThreshold) {
     var calculatedHeight = Math.max(0, menuRect.bottom - scrollBuffer);
@@ -170,7 +174,7 @@ var calculateSideAlignment = function calculateSideAlignment(elementAlign, menuR
   }
   return null;
 };
-var checkElementIsScrolling = function checkElementIsScrolling(elementRef) {
+var checkElementIsScrolling = elementRef => {
   var el = elementRef.current;
   if (el && el.scrollTop > 0) {
     return 'scrolling';

package/dist/cjs/components/menu/hooks/useBrowserEdgeScroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBrowserEdgeScroll.js","sources":["../../../../../src/components/menu/hooks/useBrowserEdgeScroll.ts"],"sourcesContent":["import { useState, useLayoutEffect, useCallback, useRef, useEffect } from 'react';\nimport { MenuAlignment, MenuPosition } from '../constants';\nimport debounce from 'lodash.debounce';\n\ninterface ElementScrollStyles {\n\tisScrolling: boolean;\n\tstyles: AdjustedElementStyle;\n}\n\nexport interface AdjustedElementStyle {\n\tmaxHeight?: string;\n}\n\n/**\n * useBrowserEdgeScroll hook\n *\n * This hook will calculate if an element's top or bottom edge bleed over the viewport edge\n * and will provide a max height value for the element to allow it to scroll instead of bleed over\n *\n * @param elementRef - reference to the DOM element that is the menu\n * @param elementPosition - the position of the menu\n * @param elementAlign - the alignment of the menu\n * @param disable - disable the hook from running\n * @returns AdjustedElementStyle - returns the new updated style for scrolling the menu\n */\nexport const useBrowserEdgeScroll = (\n\telementRef: React.RefObject<HTMLElement>,\n\telementPosition: MenuPosition = 'bottom',\n\telementAlign: MenuAlignment,\n\tdisable?: boolean\n): ElementScrollStyles | null => {\n\tconst [heightStyle, setHeightStyle] = useState<AdjustedElementStyle>({});\n\n\tconst [isScrolling, setIsScrolling] = useState<boolean>(false);\n\n\t// Use a ref to store the initial dimensions of the menu\n\tconst menuRectSizeRef = useRef<DOMRect | null>(null);\n\n\tconst updateMenuStyle = useCallback(() => {\n\t\tif (disable || !elementRef.current || elementPosition === 'static') return;\n\n\t\tif (elementRef.current) {\n\t\t\tif (!menuRectSizeRef.current) {\n\t\t\t\tmenuRectSizeRef.current = elementRef.current.getBoundingClientRect();\n\t\t\t}\n\n\t\t\tconst newMaxHeight = calculateNewMaxHeight(\n\t\t\t\telementPosition,\n\t\t\t\telementAlign,\n\t\t\t\telementRef,\n\t\t\t\tmenuRectSizeRef.current,\n\t\t\t\twindow.innerHeight\n\t\t\t);\n\n\t\t\tif (newMaxHeight !== null) {\n\t\t\t\tsetIsScrolling(true);\n\t\t\t\tsetHeightStyle({ maxHeight: newMaxHeight });\n\t\t\t} else {\n\t\t\t\tsetIsScrolling(false);\n\t\t\t\tsetHeightStyle({});\n\t\t\t}\n\t\t}\n\t}, [\n\t\tdisable,\n\t\telementRef,\n\t\telementAlign,\n\t\telementPosition\n\t]);\n\n\tconst updateMenuStyleDebounced = debounce(updateMenuStyle, 10);\n\n\tuseLayoutEffect(() => {\n\t\tif (disable || !elementRef.current || elementPosition === 'static') return;\n\n\t\t/**\n\t\t * Resize observer is setup to watch for changes in the element's size or position\n\t\t *\n\t\t * If a resize is detected, the element's style will be updated to allow for scrolling if necessary\n\t\t */\n\t\tconst observer = new ResizeObserver(updateMenuStyleDebounced);\n\t\tobserver.observe(elementRef.current);\n\n\t\twindow.addEventListener('resize', updateMenuStyleDebounced);\n\n\t\tif (elementRef.current) {\n\t\t\tupdateMenuStyle();\n\t\t}\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t\twindow.removeEventListener('resize', updateMenuStyleDebounced);\n\t\t\tmenuRectSizeRef.current = null;\n\t\t};\n\n\t\t// Passing a ref in shouldn't make things work, but in this scenario\n\t\t// it's the only way to get the menu to update when it's ref becomes available\n\t\t// this is used for when the menu initializes, the ref may not be available so this\n\t\t// is allowing the menu to wait before initializing the menu style without a setTimeout\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [elementRef.current, elementPosition, updateMenuStyle]);\n\n\tconst updateOnImageLoad = () => {\n\t\tconst elementRect = elementRef.current?.getBoundingClientRect();\n\t\tif (elementRect) {\n\t\t\tmenuRectSizeRef.current = elementRect;\n\t\t\tupdateMenuStyleDebounced();\n\t\t}\n\t};\n\n\t/**\n\t * Listen for image additions to the element and update the menu style when they load\n\t */\n\tuseEffect(() => {\n\t\tconst images = elementRef.current?.querySelectorAll('img');\n\t\tif (images) {\n\t\t\timages.forEach((img) => {\n\t\t\t\timg.addEventListener('load', updateOnImageLoad);\n\t\t\t});\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (images) {\n\t\t\t\timages.forEach((img) => {\n\t\t\t\t\timg.removeEventListener('load', updateOnImageLoad);\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [elementRef.current, updateMenuStyleDebounced]);\n\n\treturn { isScrolling, styles: heightStyle };\n};\n\n/**\n * Calculates the new max height of the menu based on the menu alignment and the viewport height\n *\n * @param elementPosition - the alignment of the menu\n * @param elementAlign - the alignment of the menu\n * @param elementRef - reference to the DOM element that is the menu\n * @param menuRect - the bounding client rect of the menu\n * @param viewportHeight - the height of the viewport\n * @returns {string} - the new max height of the menu\n */\nconst calculateNewMaxHeight = (\n\telementPosition: MenuPosition,\n\telementAlign: MenuAlignment,\n\telementRef: React.RefObject<HTMLElement>,\n\tmenuRect: DOMRect,\n\tviewportHeight: number\n): string | null => {\n\tconst scrollBuffer = 35;\n\tconst scrollThreshold = 20;\n\n\tswitch (elementPosition) {\n\tcase 'bottom':\n\t\treturn calculateBottomAlignment(menuRect, viewportHeight, scrollBuffer, scrollThreshold);\n\tcase 'top':\n\t\treturn calculateTopAlignment(menuRect, elementRef, scrollBuffer, scrollThreshold);\n\tcase 'left':\n\tcase 'right':\n\t\treturn calculateSideAlignment(\n\t\t\telementAlign,\n\t\t\tmenuRect,\n\t\t\tviewportHeight,\n\t\t\tscrollThreshold,\n\t\t\tscrollBuffer\n\t\t);\n\tcase 'ignore':\n\t\treturn checkElementIsScrolling(elementRef);\n\tdefault:\n\t\treturn null;\n\t}\n};\n\nconst calculateBottomAlignment = (\n\tmenuRect: DOMRect,\n\tviewportHeight: number,\n\tscrollBuffer: number,\n\tscrollThreshold: number\n): string | null => {\n\t// Evaluate from the bottom of the viewport to the top of the menu\n\tif (menuRect.bottom > viewportHeight - scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, viewportHeight - menuRect.top - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\treturn null;\n};\n\nconst calculateTopAlignment = (\n\tmenuRect: DOMRect,\n\telementRef: React.RefObject<HTMLElement>,\n\tscrollBuffer: number,\n\tscrollThreshold: number\n): string | null => {\n\tconst currentRect = elementRef.current?.getBoundingClientRect();\n\t// Evaluate distance from the top of the viewport to the bottom of the menu\n\tif (currentRect && currentRect.top <= scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, currentRect.bottom - scrollThreshold);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\treturn null;\n};\n\nconst calculateSideAlignment = (\n\telementAlign: MenuAlignment,\n\tmenuRect: DOMRect,\n\tviewportHeight: number,\n\tscrollThreshold: number,\n\tscrollBuffer: number\n): string | null => {\n\t// Evaluate distance from the top of the viewport to the bottom of the menu\n\tif (elementAlign === 'end' && menuRect.top < scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, menuRect.bottom - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\n\t// Evaluate from the bottom of the viewport to the top of the menu\n\tif (elementAlign === 'start' && menuRect.bottom > viewportHeight - scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, viewportHeight - menuRect.top - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\n\treturn null;\n};\n\nconst checkElementIsScrolling = (elementRef: React.RefObject<HTMLElement>): string | null => {\n\tconst el = elementRef.current;\n\n\tif (el && el.scrollTop > 0) {\n\t\treturn 'scrolling';\n\t}\n\n\treturn null;\n};\n"],"names":["useBrowserEdgeScroll","elementRef","elementPosition","arguments","length","undefined","elementAlign","disable","_useState","useState","_useState2","_slicedToArray","heightStyle","setHeightStyle","_useState3","_useState4","isScrolling","setIsScrolling","menuRectSizeRef","useRef","updateMenuStyle","useCallback","current","getBoundingClientRect","newMaxHeight","calculateNewMaxHeight","window","innerHeight","maxHeight","updateMenuStyleDebounced","debounce","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","disconnect","removeEventListener","updateOnImageLoad","_elementRef$current","elementRect","useEffect","_elementRef$current2","images","querySelectorAll","forEach","img","styles","menuRect","viewportHeight","scrollBuffer","scrollThreshold","calculateBottomAlignment","calculateTopAlignment","calculateSideAlignment","checkElementIsScrolling","bottom","calculatedHeight","Math","max","top","concat","floor","_elementRef$current3","currentRect","el","scrollTop"],"mappings":"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"}
+{"version":3,"file":"useBrowserEdgeScroll.js","sources":["../../../../../src/components/menu/hooks/useBrowserEdgeScroll.ts"],"sourcesContent":["import { useState, useLayoutEffect, useCallback, useRef, useEffect } from 'react';\nimport { MenuAlignment, MenuPosition } from '../constants';\nimport debounce from 'lodash.debounce';\n\ninterface ElementScrollStyles {\n\tisScrolling: boolean;\n\tstyles: AdjustedElementStyle;\n}\n\nexport interface AdjustedElementStyle {\n\tmaxHeight?: string;\n}\n\n/**\n * useBrowserEdgeScroll hook\n *\n * This hook will calculate if an element's top or bottom edge bleed over the viewport edge\n * and will provide a max height value for the element to allow it to scroll instead of bleed over\n *\n * @param elementRef - reference to the DOM element that is the menu\n * @param elementPosition - the position of the menu\n * @param elementAlign - the alignment of the menu\n * @param disable - disable the hook from running\n * @returns AdjustedElementStyle - returns the new updated style for scrolling the menu\n */\nexport const useBrowserEdgeScroll = (\n\telementRef: React.RefObject<HTMLElement>,\n\telementPosition: MenuPosition = 'bottom',\n\telementAlign: MenuAlignment,\n\tdisable?: boolean\n): ElementScrollStyles | null => {\n\tconst [heightStyle, setHeightStyle] = useState<AdjustedElementStyle>({});\n\n\tconst [isScrolling, setIsScrolling] = useState<boolean>(false);\n\n\t// Use a ref to store the initial dimensions of the menu\n\tconst menuRectSizeRef = useRef<DOMRect | null>(null);\n\n\tconst updateMenuStyle = useCallback(() => {\n\t\tif (disable || !elementRef.current || elementPosition === 'static') return;\n\n\t\tif (elementRef.current) {\n\t\t\tif (!menuRectSizeRef.current) {\n\t\t\t\tmenuRectSizeRef.current = elementRef.current.getBoundingClientRect();\n\t\t\t}\n\n\t\t\tconst newMaxHeight = calculateNewMaxHeight(\n\t\t\t\telementPosition,\n\t\t\t\telementAlign,\n\t\t\t\telementRef,\n\t\t\t\tmenuRectSizeRef.current,\n\t\t\t\twindow.innerHeight\n\t\t\t);\n\n\t\t\tif (newMaxHeight !== null) {\n\t\t\t\tsetIsScrolling(true);\n\t\t\t\tsetHeightStyle({ maxHeight: newMaxHeight });\n\t\t\t} else {\n\t\t\t\tsetIsScrolling(false);\n\t\t\t\tsetHeightStyle({});\n\t\t\t}\n\t\t}\n\t}, [\n\t\tdisable,\n\t\telementRef,\n\t\telementAlign,\n\t\telementPosition\n\t]);\n\n\tconst updateMenuStyleDebounced = debounce(updateMenuStyle, 10);\n\n\tuseLayoutEffect(() => {\n\t\tif (disable || !elementRef.current || elementPosition === 'static') return;\n\n\t\t/**\n\t\t * Resize observer is setup to watch for changes in the element's size or position\n\t\t *\n\t\t * If a resize is detected, the element's style will be updated to allow for scrolling if necessary\n\t\t */\n\t\tconst observer = new ResizeObserver(updateMenuStyleDebounced);\n\t\tobserver.observe(elementRef.current);\n\n\t\twindow.addEventListener('resize', updateMenuStyleDebounced);\n\n\t\tif (elementRef.current) {\n\t\t\tupdateMenuStyle();\n\t\t}\n\n\t\treturn () => {\n\t\t\tobserver.disconnect();\n\t\t\twindow.removeEventListener('resize', updateMenuStyleDebounced);\n\t\t\tmenuRectSizeRef.current = null;\n\t\t};\n\n\t\t// Passing a ref in shouldn't make things work, but in this scenario\n\t\t// it's the only way to get the menu to update when it's ref becomes available\n\t\t// this is used for when the menu initializes, the ref may not be available so this\n\t\t// is allowing the menu to wait before initializing the menu style without a setTimeout\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [elementRef.current, elementPosition, updateMenuStyle]);\n\n\tconst updateOnImageLoad = () => {\n\t\tconst elementRect = elementRef.current?.getBoundingClientRect();\n\t\tif (elementRect) {\n\t\t\tmenuRectSizeRef.current = elementRect;\n\t\t\tupdateMenuStyleDebounced();\n\t\t}\n\t};\n\n\t/**\n\t * Listen for image additions to the element and update the menu style when they load\n\t */\n\tuseEffect(() => {\n\t\tconst images = elementRef.current?.querySelectorAll('img');\n\t\tif (images) {\n\t\t\timages.forEach((img) => {\n\t\t\t\timg.addEventListener('load', updateOnImageLoad);\n\t\t\t});\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (images) {\n\t\t\t\timages.forEach((img) => {\n\t\t\t\t\timg.removeEventListener('load', updateOnImageLoad);\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [elementRef.current, updateMenuStyleDebounced]);\n\n\treturn { isScrolling, styles: heightStyle };\n};\n\n/**\n * Calculates the new max height of the menu based on the menu alignment and the viewport height\n *\n * @param elementPosition - the alignment of the menu\n * @param elementAlign - the alignment of the menu\n * @param elementRef - reference to the DOM element that is the menu\n * @param menuRect - the bounding client rect of the menu\n * @param viewportHeight - the height of the viewport\n * @returns {string} - the new max height of the menu\n */\nconst calculateNewMaxHeight = (\n\telementPosition: MenuPosition,\n\telementAlign: MenuAlignment,\n\telementRef: React.RefObject<HTMLElement>,\n\tmenuRect: DOMRect,\n\tviewportHeight: number\n): string | null => {\n\tconst scrollBuffer = 35;\n\tconst scrollThreshold = 20;\n\n\tswitch (elementPosition) {\n\tcase 'bottom':\n\t\treturn calculateBottomAlignment(menuRect, viewportHeight, scrollBuffer, scrollThreshold);\n\tcase 'top':\n\t\treturn calculateTopAlignment(menuRect, elementRef, scrollBuffer, scrollThreshold);\n\tcase 'left':\n\tcase 'right':\n\t\treturn calculateSideAlignment(\n\t\t\telementAlign,\n\t\t\tmenuRect,\n\t\t\tviewportHeight,\n\t\t\tscrollThreshold,\n\t\t\tscrollBuffer\n\t\t);\n\tcase 'ignore':\n\t\treturn checkElementIsScrolling(elementRef);\n\tdefault:\n\t\treturn null;\n\t}\n};\n\nconst calculateBottomAlignment = (\n\tmenuRect: DOMRect,\n\tviewportHeight: number,\n\tscrollBuffer: number,\n\tscrollThreshold: number\n): string | null => {\n\t// Evaluate from the bottom of the viewport to the top of the menu\n\tif (menuRect.bottom > viewportHeight - scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, viewportHeight - menuRect.top - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\treturn null;\n};\n\nconst calculateTopAlignment = (\n\tmenuRect: DOMRect,\n\telementRef: React.RefObject<HTMLElement>,\n\tscrollBuffer: number,\n\tscrollThreshold: number\n): string | null => {\n\tconst currentRect = elementRef.current?.getBoundingClientRect();\n\t// Evaluate distance from the top of the viewport to the bottom of the menu\n\tif (currentRect && currentRect.top <= scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, currentRect.bottom - scrollThreshold);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\treturn null;\n};\n\nconst calculateSideAlignment = (\n\telementAlign: MenuAlignment,\n\tmenuRect: DOMRect,\n\tviewportHeight: number,\n\tscrollThreshold: number,\n\tscrollBuffer: number\n): string | null => {\n\t// Evaluate distance from the top of the viewport to the bottom of the menu\n\tif (elementAlign === 'end' && menuRect.top < scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, menuRect.bottom - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\n\t// Evaluate from the bottom of the viewport to the top of the menu\n\tif (elementAlign === 'start' && menuRect.bottom > viewportHeight - scrollThreshold) {\n\t\tconst calculatedHeight = Math.max(0, viewportHeight - menuRect.top - scrollBuffer);\n\t\treturn `${Math.floor(calculatedHeight)}px`;\n\t}\n\n\treturn null;\n};\n\nconst checkElementIsScrolling = (elementRef: React.RefObject<HTMLElement>): string | null => {\n\tconst el = elementRef.current;\n\n\tif (el && el.scrollTop > 0) {\n\t\treturn 'scrolling';\n\t}\n\n\treturn null;\n};\n"],"names":["useBrowserEdgeScroll","elementRef","elementPosition","arguments","length","undefined","elementAlign","disable","_useState","useState","_useState2","_slicedToArray","heightStyle","setHeightStyle","_useState3","_useState4","isScrolling","setIsScrolling","menuRectSizeRef","useRef","updateMenuStyle","useCallback","current","getBoundingClientRect","newMaxHeight","calculateNewMaxHeight","window","innerHeight","maxHeight","updateMenuStyleDebounced","debounce","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","disconnect","removeEventListener","updateOnImageLoad","_elementRef$current","elementRect","useEffect","_elementRef$current2","images","querySelectorAll","forEach","img","styles","menuRect","viewportHeight","scrollBuffer","scrollThreshold","calculateBottomAlignment","calculateTopAlignment","calculateSideAlignment","checkElementIsScrolling","bottom","calculatedHeight","Math","max","top","concat","floor","_elementRef$current3","currentRect","el","scrollTop"],"mappings":"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"}

package/dist/cjs/components/menu/hooks/useMenuScroll.js

@@ -39,15 +39,15 @@ var DEFAULT_SCROLL_STATE = {
  * @param disable - Whether to disable the hook entirely
  * @returns An object with `maxHeight` (inline style value) and `isScrolling` (class toggle)
  */
-var useMenuScroll = function useMenuScroll(triggerRef, listRef, position, menuOffset, isOpen, disable) {
+var useMenuScroll = (triggerRef, listRef, position, menuOffset, isOpen, disable) => {
   var _useState = React.useState(DEFAULT_SCROLL_STATE),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
     scrollState = _useState2[0],
     setScrollState = _useState2[1];
-  var calculateScroll = React.useCallback(function () {
+  var calculateScroll = React.useCallback(() => {
     // Reset scroll constraints when the menu closes or refs aren't available.
     if (!isOpen || disable || !(triggerRef !== null && triggerRef !== void 0 && triggerRef.current) || !listRef.current) {
-      setScrollState(function (prev) {
+      setScrollState(prev => {
         if (prev.maxHeight === undefined && !prev.isScrolling) return prev;
         return DEFAULT_SCROLL_STATE;
       });
@@ -96,10 +96,10 @@ var useMenuScroll = function useMenuScroll(triggerRef, listRef, position, menuOf
      * cause the element being positioned to flip between flipped/unflipped states.
      */
     var safeMaxHeight = maxHeight !== undefined ? Math.floor(maxHeight) - 1 : undefined;
-    setScrollState(function (prev) {
+    setScrollState(prev => {
       if (prev.maxHeight === safeMaxHeight && prev.isScrolling === isScrolling) return prev;
       return {
-        isScrolling: isScrolling,
+        isScrolling,
         maxHeight: safeMaxHeight
       };
     });
@@ -110,7 +110,7 @@ var useMenuScroll = function useMenuScroll(triggerRef, listRef, position, menuOf
    * This ensures maxHeight is applied to the DOM before useTriggerPosition's
    * requestAnimationFrame fires, so it measures the constrained height on its first pass.
    */
-  React.useLayoutEffect(function () {
+  React.useLayoutEffect(() => {
     if (isOpen && !disable) {
       calculateScroll();
     }
@@ -120,7 +120,7 @@ var useMenuScroll = function useMenuScroll(triggerRef, listRef, position, menuOf
    * Respond to window resize and content size changes (e.g. images loading,
    * lazy content, dynamically added items).
    */
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (!isOpen || disable) return;
     window.addEventListener('resize', calculateScroll);
     var listElement = listRef.current;
@@ -129,7 +129,7 @@ var useMenuScroll = function useMenuScroll(triggerRef, listRef, position, menuOf
       resizeObserver = new ResizeObserver(calculateScroll);
       resizeObserver.observe(listElement);
     }
-    return function () {
+    return () => {
       var _resizeObserver;
       window.removeEventListener('resize', calculateScroll);
       (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.disconnect();

package/dist/cjs/components/menu/hooks/useMenuScroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMenuScroll.js","sources":["../../../../../src/components/menu/hooks/useMenuScroll.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useLayoutEffect, RefObject } from 'react';\nimport { MenuPosition } from '../constants';\n\nconst SCREEN_OFFSET = 16;\n\ninterface UseMenuScrollResult {\n\t/** The constrained max height for the menu list when scrolling is active */\n\tmaxHeight: number | undefined;\n\t/** Whether the menu content exceeds available space and requires internal scrolling */\n\tisScrolling: boolean;\n}\n\nconst DEFAULT_SCROLL_STATE: UseMenuScrollResult = {\n\tisScrolling: false,\n\tmaxHeight: undefined\n};\n\n/**\n * useMenuScroll hook\n *\n * Detects when a menu cannot fit on screen in either its preferred or flipped position,\n * and constrains its height to enable internal scrolling.\n *\n * Behavior by position:\n * - **top/bottom**: If the menu doesn't fit in the preferred direction AND doesn't fit\n *   in the opposite direction (flip), it reverts to the original position and constrains\n *   the height to the space between the trigger edge and the viewport edge.\n * - **left/right**: Only checks vertical overflow. If the menu is taller than the viewport,\n *   it constrains the height to the available vertical space.\n *\n * Uses `scrollHeight` on the list element to determine the natural (unconstrained) content\n * height. This value remains stable even when `maxHeight` is applied, preventing feedback\n * loops with external positioning hooks that use ResizeObserver.\n *\n * Uses `useLayoutEffect` for the initial calculation so that `maxHeight` is applied\n * synchronously before the browser paints. This prevents visible flicker when the menu\n * opens in a constrained space, because the positioning hook (useTriggerPosition) will\n * see the already-constrained height on its first measurement via requestAnimationFrame.\n *\n * @param triggerRef - Reference to the trigger element that opens the menu\n * @param listRef - Reference to the ul element inside the menu (the scrollable container)\n * @param position - The preferred menu position relative to the trigger\n * @param menuOffset - The gap between the trigger and the menu in pixels\n * @param isOpen - Whether the menu is currently open\n * @param disable - Whether to disable the hook entirely\n * @returns An object with `maxHeight` (inline style value) and `isScrolling` (class toggle)\n */\nexport const useMenuScroll = (\n\ttriggerRef: RefObject<HTMLElement> | undefined,\n\tlistRef: RefObject<HTMLUListElement>,\n\tposition: MenuPosition,\n\tmenuOffset: number,\n\tisOpen: boolean,\n\tdisable: boolean\n): UseMenuScrollResult => {\n\tconst [scrollState, setScrollState] = useState<UseMenuScrollResult>(DEFAULT_SCROLL_STATE);\n\n\tconst calculateScroll = useCallback(() => {\n\t\t// Reset scroll constraints when the menu closes or refs aren't available.\n\t\tif (!isOpen || disable || !triggerRef?.current || !listRef.current) {\n\t\t\tsetScrollState((prev) => {\n\t\t\t\tif (prev.maxHeight === undefined && !prev.isScrolling) return prev;\n\t\t\t\treturn DEFAULT_SCROLL_STATE;\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst triggerRect = triggerRef.current.getBoundingClientRect();\n\t\tconst naturalHeight = listRef.current.scrollHeight;\n\t\tconst viewportHeight = window.innerHeight;\n\n\t\tlet maxHeight: number | undefined;\n\t\tlet isScrolling = false;\n\n\t\tswitch (position) {\n\t\t\tcase 'bottom': {\n\t\t\t\tconst availableBelow = viewportHeight - triggerRect.bottom - menuOffset - SCREEN_OFFSET;\n\t\t\t\tconst availableAbove = triggerRect.top - menuOffset - SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableBelow && naturalHeight > availableAbove) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableBelow;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'top': {\n\t\t\t\tconst availableAbove = triggerRect.top - menuOffset - SCREEN_OFFSET;\n\t\t\t\tconst availableBelow = viewportHeight - triggerRect.bottom - menuOffset - SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableAbove && naturalHeight > availableBelow) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableAbove;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'left':\n\t\t\tcase 'right': {\n\t\t\t\tconst availableVertical = viewportHeight - 2 * SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableVertical) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableVertical;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Floor the maxHeight and subtract 1px to avoid sub-pixel rounding that can\n\t\t * cause the element being positioned to flip between flipped/unflipped states.\n\t\t */\n\t\tconst safeMaxHeight = maxHeight !== undefined ? Math.floor(maxHeight) - 1 : undefined;\n\n\t\tsetScrollState((prev) => {\n\t\t\tif (prev.maxHeight === safeMaxHeight && prev.isScrolling === isScrolling) return prev;\n\t\t\treturn { isScrolling, maxHeight: safeMaxHeight };\n\t\t});\n\t}, [isOpen, disable, triggerRef, listRef, position, menuOffset]);\n\n\t/**\n\t * Calculate synchronously before paint to prevent flicker.\n\t * This ensures maxHeight is applied to the DOM before useTriggerPosition's\n\t * requestAnimationFrame fires, so it measures the constrained height on its first pass.\n\t */\n\tuseLayoutEffect(() => {\n\t\tif (isOpen && !disable) {\n\t\t\tcalculateScroll();\n\t\t}\n\t}, [isOpen, disable, calculateScroll]);\n\n\t/**\n\t * Respond to window resize and content size changes (e.g. images loading,\n\t * lazy content, dynamically added items).\n\t */\n\tuseEffect(() => {\n\t\tif (!isOpen || disable) return;\n\n\t\twindow.addEventListener('resize', calculateScroll);\n\n\t\tconst listElement = listRef.current;\n\t\tlet resizeObserver: ResizeObserver | undefined;\n\n\t\tif (listElement) {\n\t\t\tresizeObserver = new ResizeObserver(calculateScroll);\n\t\t\tresizeObserver.observe(listElement);\n\t\t}\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', calculateScroll);\n\t\t\tresizeObserver?.disconnect();\n\t\t};\n\t}, [isOpen, disable, calculateScroll, listRef]);\n\n\treturn scrollState;\n};\n"],"names":["SCREEN_OFFSET","DEFAULT_SCROLL_STATE","isScrolling","maxHeight","undefined","useMenuScroll","triggerRef","listRef","position","menuOffset","isOpen","disable","_useState","useState","_useState2","_slicedToArray","scrollState","setScrollState","calculateScroll","useCallback","current","prev","triggerRect","getBoundingClientRect","naturalHeight","scrollHeight","viewportHeight","window","innerHeight","availableBelow","bottom","availableAbove","top","availableVertical","safeMaxHeight","Math","floor","useLayoutEffect","useEffect","addEventListener","listElement","resizeObserver","ResizeObserver","observe","_resizeObserver","removeEventListener","disconnect"],"mappings":"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"}
+{"version":3,"file":"useMenuScroll.js","sources":["../../../../../src/components/menu/hooks/useMenuScroll.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useLayoutEffect, RefObject } from 'react';\nimport { MenuPosition } from '../constants';\n\nconst SCREEN_OFFSET = 16;\n\ninterface UseMenuScrollResult {\n\t/** The constrained max height for the menu list when scrolling is active */\n\tmaxHeight: number | undefined;\n\t/** Whether the menu content exceeds available space and requires internal scrolling */\n\tisScrolling: boolean;\n}\n\nconst DEFAULT_SCROLL_STATE: UseMenuScrollResult = {\n\tisScrolling: false,\n\tmaxHeight: undefined\n};\n\n/**\n * useMenuScroll hook\n *\n * Detects when a menu cannot fit on screen in either its preferred or flipped position,\n * and constrains its height to enable internal scrolling.\n *\n * Behavior by position:\n * - **top/bottom**: If the menu doesn't fit in the preferred direction AND doesn't fit\n *   in the opposite direction (flip), it reverts to the original position and constrains\n *   the height to the space between the trigger edge and the viewport edge.\n * - **left/right**: Only checks vertical overflow. If the menu is taller than the viewport,\n *   it constrains the height to the available vertical space.\n *\n * Uses `scrollHeight` on the list element to determine the natural (unconstrained) content\n * height. This value remains stable even when `maxHeight` is applied, preventing feedback\n * loops with external positioning hooks that use ResizeObserver.\n *\n * Uses `useLayoutEffect` for the initial calculation so that `maxHeight` is applied\n * synchronously before the browser paints. This prevents visible flicker when the menu\n * opens in a constrained space, because the positioning hook (useTriggerPosition) will\n * see the already-constrained height on its first measurement via requestAnimationFrame.\n *\n * @param triggerRef - Reference to the trigger element that opens the menu\n * @param listRef - Reference to the ul element inside the menu (the scrollable container)\n * @param position - The preferred menu position relative to the trigger\n * @param menuOffset - The gap between the trigger and the menu in pixels\n * @param isOpen - Whether the menu is currently open\n * @param disable - Whether to disable the hook entirely\n * @returns An object with `maxHeight` (inline style value) and `isScrolling` (class toggle)\n */\nexport const useMenuScroll = (\n\ttriggerRef: RefObject<HTMLElement> | undefined,\n\tlistRef: RefObject<HTMLUListElement>,\n\tposition: MenuPosition,\n\tmenuOffset: number,\n\tisOpen: boolean,\n\tdisable: boolean\n): UseMenuScrollResult => {\n\tconst [scrollState, setScrollState] = useState<UseMenuScrollResult>(DEFAULT_SCROLL_STATE);\n\n\tconst calculateScroll = useCallback(() => {\n\t\t// Reset scroll constraints when the menu closes or refs aren't available.\n\t\tif (!isOpen || disable || !triggerRef?.current || !listRef.current) {\n\t\t\tsetScrollState((prev) => {\n\t\t\t\tif (prev.maxHeight === undefined && !prev.isScrolling) return prev;\n\t\t\t\treturn DEFAULT_SCROLL_STATE;\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\n\t\tconst triggerRect = triggerRef.current.getBoundingClientRect();\n\t\tconst naturalHeight = listRef.current.scrollHeight;\n\t\tconst viewportHeight = window.innerHeight;\n\n\t\tlet maxHeight: number | undefined;\n\t\tlet isScrolling = false;\n\n\t\tswitch (position) {\n\t\t\tcase 'bottom': {\n\t\t\t\tconst availableBelow = viewportHeight - triggerRect.bottom - menuOffset - SCREEN_OFFSET;\n\t\t\t\tconst availableAbove = triggerRect.top - menuOffset - SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableBelow && naturalHeight > availableAbove) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableBelow;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'top': {\n\t\t\t\tconst availableAbove = triggerRect.top - menuOffset - SCREEN_OFFSET;\n\t\t\t\tconst availableBelow = viewportHeight - triggerRect.bottom - menuOffset - SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableAbove && naturalHeight > availableBelow) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableAbove;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'left':\n\t\t\tcase 'right': {\n\t\t\t\tconst availableVertical = viewportHeight - 2 * SCREEN_OFFSET;\n\n\t\t\t\tif (naturalHeight > availableVertical) {\n\t\t\t\t\tisScrolling = true;\n\t\t\t\t\tmaxHeight = availableVertical;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Floor the maxHeight and subtract 1px to avoid sub-pixel rounding that can\n\t\t * cause the element being positioned to flip between flipped/unflipped states.\n\t\t */\n\t\tconst safeMaxHeight = maxHeight !== undefined ? Math.floor(maxHeight) - 1 : undefined;\n\n\t\tsetScrollState((prev) => {\n\t\t\tif (prev.maxHeight === safeMaxHeight && prev.isScrolling === isScrolling) return prev;\n\t\t\treturn { isScrolling, maxHeight: safeMaxHeight };\n\t\t});\n\t}, [isOpen, disable, triggerRef, listRef, position, menuOffset]);\n\n\t/**\n\t * Calculate synchronously before paint to prevent flicker.\n\t * This ensures maxHeight is applied to the DOM before useTriggerPosition's\n\t * requestAnimationFrame fires, so it measures the constrained height on its first pass.\n\t */\n\tuseLayoutEffect(() => {\n\t\tif (isOpen && !disable) {\n\t\t\tcalculateScroll();\n\t\t}\n\t}, [isOpen, disable, calculateScroll]);\n\n\t/**\n\t * Respond to window resize and content size changes (e.g. images loading,\n\t * lazy content, dynamically added items).\n\t */\n\tuseEffect(() => {\n\t\tif (!isOpen || disable) return;\n\n\t\twindow.addEventListener('resize', calculateScroll);\n\n\t\tconst listElement = listRef.current;\n\t\tlet resizeObserver: ResizeObserver | undefined;\n\n\t\tif (listElement) {\n\t\t\tresizeObserver = new ResizeObserver(calculateScroll);\n\t\t\tresizeObserver.observe(listElement);\n\t\t}\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener('resize', calculateScroll);\n\t\t\tresizeObserver?.disconnect();\n\t\t};\n\t}, [isOpen, disable, calculateScroll, listRef]);\n\n\treturn scrollState;\n};\n"],"names":["SCREEN_OFFSET","DEFAULT_SCROLL_STATE","isScrolling","maxHeight","undefined","useMenuScroll","triggerRef","listRef","position","menuOffset","isOpen","disable","_useState","useState","_useState2","_slicedToArray","scrollState","setScrollState","calculateScroll","useCallback","current","prev","triggerRect","getBoundingClientRect","naturalHeight","scrollHeight","viewportHeight","window","innerHeight","availableBelow","bottom","availableAbove","top","availableVertical","safeMaxHeight","Math","floor","useLayoutEffect","useEffect","addEventListener","listElement","resizeObserver","ResizeObserver","observe","_resizeObserver","removeEventListener","disconnect"],"mappings":"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"}

package/dist/cjs/components/menu/hooks/useSubMenuElementPosition.js

@@ -15,7 +15,7 @@ var utilities = require('../MrlMenu/utilities.js');
  * @param disable - Should the menu be disabled
  * @returns The sub menu position
  */
-var useSubMenuElementPosition = function useSubMenuElementPosition(triggerRef, menuRef, isSubMenu, isOpen, originalMenuRect, disable) {
+var useSubMenuElementPosition = (triggerRef, menuRef, isSubMenu, isOpen, originalMenuRect, disable) => {
   var _useState = React.useState({
       left: 'calc(100% - 5px)',
       top: ''
@@ -27,12 +27,12 @@ var useSubMenuElementPosition = function useSubMenuElementPosition(triggerRef, m
     _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
     menuRect = _useState4[0],
     setMenuRect = _useState4[1];
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (!disable && isOpen && menuRef.current && !originalMenuRect) {
       setMenuRect(menuRef.current.getBoundingClientRect());
     }
   }, [disable, isOpen, menuRef, originalMenuRect]);
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (disable || !(triggerRef !== null && triggerRef !== void 0 && triggerRef.current) || !menuRef.current || !isSubMenu || !isOpen || !menuRect || !isSubMenu) return;
     var parentMenu = utilities.findClosestMenuParent(triggerRef.current);
     var triggerRect = triggerRef.current.getBoundingClientRect();

package/dist/cjs/components/menu/hooks/useSubMenuElementPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSubMenuElementPosition.js","sources":["../../../../../src/components/menu/hooks/useSubMenuElementPosition.ts"],"sourcesContent":["import { useState, useEffect, RefObject } from 'react';\nimport {\n\tfindClosestMenuParent,\n\tcalculateLeftPosition,\n\tcalculateTopPosition\n} from '../MrlMenu/utilities';\n\ninterface SubMenuPosition {\n\tleft: string;\n\ttop: string;\n}\n\n/**\n * Calculates the position of the sub menu element\n *\n * @param triggerRef - The trigger element ref\n * @param menuRef - The menu element ref\n * @param isSubMenu - Is the menu a sub menu\n * @param isOpen - Is the element visible\n * @param originalMenuRect - The menu element rect\n * @param disable - Should the menu be disabled\n * @returns The sub menu position\n */\nexport const useSubMenuElementPosition = (\n\ttriggerRef: RefObject<HTMLElement> | undefined,\n\tmenuRef: RefObject<HTMLDivElement>,\n\tisSubMenu: boolean,\n\tisOpen: boolean,\n\toriginalMenuRect: DOMRect | null,\n\tdisable?: boolean\n): SubMenuPosition => {\n\tconst [subMenuPosition, setSubMenuPosition] = useState<SubMenuPosition>({\n\t\tleft: 'calc(100% - 5px)',\n\t\ttop: ''\n\t});\n\n\tconst [menuRect, setMenuRect] = useState<DOMRect | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!disable && isOpen && menuRef.current && !originalMenuRect) {\n\t\t\tsetMenuRect(menuRef.current.getBoundingClientRect());\n\t\t}\n\t}, [\n\t\tdisable,\n\t\tisOpen,\n\t\tmenuRef,\n\t\toriginalMenuRect\n\t]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tdisable ||\n\t\t\t!triggerRef?.current ||\n\t\t\t!menuRef.current ||\n\t\t\t!isSubMenu ||\n\t\t\t!isOpen ||\n\t\t\t!menuRect ||\n\t\t\t!isSubMenu\n\t\t)\n\t\t\treturn;\n\n\t\tconst parentMenu = findClosestMenuParent(triggerRef.current);\n\t\tconst triggerRect = triggerRef.current.getBoundingClientRect();\n\n\t\tif (!parentMenu?.parentElement) return;\n\n\t\tconst parentMenuRect = parentMenu.getBoundingClientRect();\n\t\tconst menuHeight = menuRef.current.getBoundingClientRect().height;\n\n\t\tconst overlapsRight = window.innerWidth < menuRect.right;\n\t\tconst overlapsLeft = triggerRect.left - menuRect.width < menuRect.width;\n\n\t\tconst newLeft = calculateLeftPosition(overlapsRight, overlapsLeft, menuRect, triggerRef);\n\n\t\tlet newTop = calculateTopPosition(\n\t\t\toverlapsRight,\n\t\t\toverlapsLeft,\n\t\t\ttriggerRef,\n\t\t\tmenuRect,\n\t\t\tparentMenu,\n\t\t\ttriggerRect\n\t\t);\n\n\t\t// if the submenu height is smaller than the menu height, we want to top align the submenu so it doesn't go off\n\t\t// of the top of the screen\n\t\tif (menuHeight > parentMenuRect.height) {\n\t\t\tnewTop = `0px`;\n\t\t}\n\n\t\tsetSubMenuPosition({ left: newLeft, top: newTop });\n\t}, [\n\t\tdisable,\n\t\ttriggerRef,\n\t\tmenuRef,\n\t\tmenuRect,\n\t\tisSubMenu,\n\t\tisOpen\n\t]);\n\n\treturn subMenuPosition;\n};\n"],"names":["useSubMenuElementPosition","triggerRef","menuRef","isSubMenu","isOpen","originalMenuRect","disable","_useState","useState","left","top","_useState2","_slicedToArray","subMenuPosition","setSubMenuPosition","_useState3","_useState4","menuRect","setMenuRect","useEffect","current","getBoundingClientRect","parentMenu","findClosestMenuParent","triggerRect","parentElement","parentMenuRect","menuHeight","height","overlapsRight","window","innerWidth","right","overlapsLeft","width","newLeft","calculateLeftPosition","newTop","calculateTopPosition"],"mappings":"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"}
+{"version":3,"file":"useSubMenuElementPosition.js","sources":["../../../../../src/components/menu/hooks/useSubMenuElementPosition.ts"],"sourcesContent":["import { useState, useEffect, RefObject } from 'react';\nimport {\n\tfindClosestMenuParent,\n\tcalculateLeftPosition,\n\tcalculateTopPosition\n} from '../MrlMenu/utilities';\n\ninterface SubMenuPosition {\n\tleft: string;\n\ttop: string;\n}\n\n/**\n * Calculates the position of the sub menu element\n *\n * @param triggerRef - The trigger element ref\n * @param menuRef - The menu element ref\n * @param isSubMenu - Is the menu a sub menu\n * @param isOpen - Is the element visible\n * @param originalMenuRect - The menu element rect\n * @param disable - Should the menu be disabled\n * @returns The sub menu position\n */\nexport const useSubMenuElementPosition = (\n\ttriggerRef: RefObject<HTMLElement> | undefined,\n\tmenuRef: RefObject<HTMLDivElement>,\n\tisSubMenu: boolean,\n\tisOpen: boolean,\n\toriginalMenuRect: DOMRect | null,\n\tdisable?: boolean\n): SubMenuPosition => {\n\tconst [subMenuPosition, setSubMenuPosition] = useState<SubMenuPosition>({\n\t\tleft: 'calc(100% - 5px)',\n\t\ttop: ''\n\t});\n\n\tconst [menuRect, setMenuRect] = useState<DOMRect | null>(null);\n\n\tuseEffect(() => {\n\t\tif (!disable && isOpen && menuRef.current && !originalMenuRect) {\n\t\t\tsetMenuRect(menuRef.current.getBoundingClientRect());\n\t\t}\n\t}, [\n\t\tdisable,\n\t\tisOpen,\n\t\tmenuRef,\n\t\toriginalMenuRect\n\t]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tdisable ||\n\t\t\t!triggerRef?.current ||\n\t\t\t!menuRef.current ||\n\t\t\t!isSubMenu ||\n\t\t\t!isOpen ||\n\t\t\t!menuRect ||\n\t\t\t!isSubMenu\n\t\t)\n\t\t\treturn;\n\n\t\tconst parentMenu = findClosestMenuParent(triggerRef.current);\n\t\tconst triggerRect = triggerRef.current.getBoundingClientRect();\n\n\t\tif (!parentMenu?.parentElement) return;\n\n\t\tconst parentMenuRect = parentMenu.getBoundingClientRect();\n\t\tconst menuHeight = menuRef.current.getBoundingClientRect().height;\n\n\t\tconst overlapsRight = window.innerWidth < menuRect.right;\n\t\tconst overlapsLeft = triggerRect.left - menuRect.width < menuRect.width;\n\n\t\tconst newLeft = calculateLeftPosition(overlapsRight, overlapsLeft, menuRect, triggerRef);\n\n\t\tlet newTop = calculateTopPosition(\n\t\t\toverlapsRight,\n\t\t\toverlapsLeft,\n\t\t\ttriggerRef,\n\t\t\tmenuRect,\n\t\t\tparentMenu,\n\t\t\ttriggerRect\n\t\t);\n\n\t\t// if the submenu height is smaller than the menu height, we want to top align the submenu so it doesn't go off\n\t\t// of the top of the screen\n\t\tif (menuHeight > parentMenuRect.height) {\n\t\t\tnewTop = `0px`;\n\t\t}\n\n\t\tsetSubMenuPosition({ left: newLeft, top: newTop });\n\t}, [\n\t\tdisable,\n\t\ttriggerRef,\n\t\tmenuRef,\n\t\tmenuRect,\n\t\tisSubMenu,\n\t\tisOpen\n\t]);\n\n\treturn subMenuPosition;\n};\n"],"names":["useSubMenuElementPosition","triggerRef","menuRef","isSubMenu","isOpen","originalMenuRect","disable","_useState","useState","left","top","_useState2","_slicedToArray","subMenuPosition","setSubMenuPosition","_useState3","_useState4","menuRect","setMenuRect","useEffect","current","getBoundingClientRect","parentMenu","findClosestMenuParent","triggerRect","parentElement","parentMenuRect","menuHeight","height","overlapsRight","window","innerWidth","right","overlapsLeft","width","newLeft","calculateLeftPosition","newTop","calculateTopPosition"],"mappings":"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"}

package/dist/cjs/components/menu/utilities/flip-position.js

@@ -6,7 +6,7 @@
  * @param pos - The position to flip. Can be 'left', 'right', 'top', or 'bottom'.
  * @returns The flipped position. Will be 'right' for 'left', 'left' for 'right', 'bottom' for 'top', and 'top' for 'bottom'.
  */
-var flipPosition = function flipPosition(pos) {
+var flipPosition = pos => {
   switch (pos) {
     case 'left':
       return 'right';

package/dist/cjs/components/menu/utilities/flip-position.js.map

@@ -1 +1 @@
-{"version":3,"file":"flip-position.js","sources":["../../../../../src/components/menu/utilities/flip-position.ts"],"sourcesContent":["import { MenuPosition } from '../constants';\n\n/**\n * Flips the given position to its opposite.\n *\n * @param pos - The position to flip. Can be 'left', 'right', 'top', or 'bottom'.\n * @returns The flipped position. Will be 'right' for 'left', 'left' for 'right', 'bottom' for 'top', and 'top' for 'bottom'.\n */\nexport const flipPosition = (pos: MenuPosition): MenuPosition => {\n\tswitch (pos) {\n\t\tcase 'left':\n\t\t\treturn 'right';\n\t\tcase 'right':\n\t\t\treturn 'left';\n\t\tcase 'top':\n\t\t\treturn 'bottom';\n\t\tcase 'bottom':\n\t\t\treturn 'top';\n\t}\n\treturn pos;\n};\n"],"names":["flipPosition","pos"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACA;IACaA,YAAY,GAAG,SAAfA,YAAYA,CAAIC,GAAiB,EAAmB;AAChE,EAAA,QAAQA,GAAG;AACV,IAAA,KAAK,MAAM;AACV,MAAA,OAAO,OAAO;AACf,IAAA,KAAK,OAAO;AACX,MAAA,OAAO,MAAM;AACd,IAAA,KAAK,KAAK;AACT,MAAA,OAAO,QAAQ;AAChB,IAAA,KAAK,QAAQ;AACZ,MAAA,OAAO,KAAK;AACd;AACA,EAAA,OAAOA,GAAG;AACX;;;;"}
+{"version":3,"file":"flip-position.js","sources":["../../../../../src/components/menu/utilities/flip-position.ts"],"sourcesContent":["import { MenuPosition } from '../constants';\n\n/**\n * Flips the given position to its opposite.\n *\n * @param pos - The position to flip. Can be 'left', 'right', 'top', or 'bottom'.\n * @returns The flipped position. Will be 'right' for 'left', 'left' for 'right', 'bottom' for 'top', and 'top' for 'bottom'.\n */\nexport const flipPosition = (pos: MenuPosition): MenuPosition => {\n\tswitch (pos) {\n\t\tcase 'left':\n\t\t\treturn 'right';\n\t\tcase 'right':\n\t\t\treturn 'left';\n\t\tcase 'top':\n\t\t\treturn 'bottom';\n\t\tcase 'bottom':\n\t\t\treturn 'top';\n\t}\n\treturn pos;\n};\n"],"names":["flipPosition","pos"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,YAAY,GAAIC,GAAiB,IAAmB;AAChE,EAAA,QAAQA,GAAG;AACV,IAAA,KAAK,MAAM;AACV,MAAA,OAAO,OAAO;AACf,IAAA,KAAK,OAAO;AACX,MAAA,OAAO,MAAM;AACd,IAAA,KAAK,KAAK;AACT,MAAA,OAAO,QAAQ;AAChB,IAAA,KAAK,QAAQ;AACZ,MAAA,OAAO,KAAK;AACd;AACA,EAAA,OAAOA,GAAG;AACX;;;;"}

package/dist/cjs/components/modal/MrlModal/MrlModal.js

@@ -13,7 +13,10 @@ var MrlFocusTrap = require('../../focus-trap/MrlFocusTrap/MrlFocusTrap.js');
 var MrlIconButton = require('../../button/MrlIconButton/MrlIconButton.js');
 var MrlSvg = require('../../svg/MrlSvg/MrlSvg.js');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
 	var n = Object.create(null);
 	if (e) {
 		Object.keys(e).forEach(function (k) {
@@ -30,7 +33,8 @@ function _interopNamespaceDefault(e) {
 	return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
 
 var _excluded = ["ariaLabel", "children", "className", "closable", "loading", "size", "state", "hookClose", "preventBackgroundScroll", "attrs"];
 /**
@@ -66,7 +70,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
    * Reference to the modal
    */
   var modal = React__namespace.useRef(null);
-  React__namespace.useImperativeHandle(ref, function () {
+  React__namespace.useImperativeHandle(ref, () => {
     return modalContainer.current;
   });
 
@@ -83,9 +87,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Open/Closed state of the modal
    */
-  var _React$useState = React__namespace.useState(function () {
-      return state;
-    }),
+  var _React$useState = React__namespace.useState(() => state),
     _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
     modalState = _React$useState2[0],
     setModalState = _React$useState2[1];
@@ -146,7 +148,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
    * Handles when the user clicks on the overlay to close the modal
    * @param {React.KeyEvent} e - key event data
    */
-  var handleKeyDismiss = function handleKeyDismiss(e) {
+  var handleKeyDismiss = e => {
     if (e.key === 'Escape') setModalState('close');
   };
 
@@ -154,7 +156,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
    * Handles when the user clicks on the overlay to close the modal
    * @param {MouseEvent} e - mouse event data
    */
-  var handleDismiss = function handleDismiss(e) {
+  var handleDismiss = e => {
     if (modalContainer.current !== e.target) return;
     handleClose();
   };
@@ -162,14 +164,14 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Handler logic for closing the modal
    */
-  var handleClose = React__namespace.useCallback(function () {
+  var handleClose = React__namespace.useCallback(() => {
     setFadeState(MrlModal_module.default['fade-out']);
 
     /**
      * Set timeout to allow for fade out animation to complete
      * before we hide the modal from the DOM and call the close hook
      */
-    var timeoutId = setTimeout(function () {
+    var timeoutId = setTimeout(() => {
       if (modal.current) {
         setDisplayState(MrlModal_module.default['hide']);
       }
@@ -178,7 +180,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
     if (preventBackgroundScroll) document.body.style.overflow = prevOverflow;
 
     // cleanup setTimeout
-    return function () {
+    return () => {
       clearTimeout(timeoutId);
     };
   }, [hookClose, prevOverflow, preventBackgroundScroll]);
@@ -186,7 +188,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Handler logic for opening the modal
    */
-  var handleOpen = React__namespace.useCallback(function () {
+  var handleOpen = React__namespace.useCallback(() => {
     setDisplayState(MrlModal_module.default['display']);
     setFadeState(MrlModal_module.default['fade-in']);
     if (preventBackgroundScroll) {
@@ -198,7 +200,7 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Sets the open/close state of the UI
    */
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     if (modalState === 'open') {
       handleOpen();
     } else if (modalState === 'close') {
@@ -213,14 +215,14 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Sets modal state when the state prop changes
    */
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     setModalState(state);
   }, [state]);
 
   /**
    * ComponentDidLoad
    */
-  React__namespace.useEffect(function () {
+  React__namespace.useEffect(() => {
     var el = modalContainer.current;
     if (el) {
       /**
@@ -243,14 +245,16 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
   /**
    * Cleanup overflow hidden when component unmounts
    */
-  React__namespace.useEffect(function () {
-    return function () {
+  React__namespace.useEffect(() => {
+    return () => {
       document.body.style.overflow = '';
     };
   }, []);
-  var containerClasses = classnames('mrl-modal-container', 'mrl-modal-backdrop', className, MrlModal_module.default['mrl-modal-backdrop'], fadeState, displayState);
-  var modalClasses = classnames('mrl-modal', MrlModal_module.default['mrl-modal'], attrs["class"] || attrs.className, _rollupPluginBabelHelpers.defineProperty({}, "mrl-modal--".concat(size), size !== constants.defaults.size));
-  var closeClasses = classnames('mrl-modal-close', MrlModal_module.default['mrl-modal-close']);
+  var containerClasses = classnames__default.default('mrl-modal-container', 'mrl-modal-backdrop', className, MrlModal_module.default['mrl-modal-backdrop'], fadeState, displayState);
+  var modalClasses = classnames__default.default('mrl-modal', MrlModal_module.default['mrl-modal'], attrs.class || attrs.className, {
+    ["mrl-modal--".concat(size)]: size !== constants.defaults.size
+  });
+  var closeClasses = classnames__default.default('mrl-modal-close', MrlModal_module.default['mrl-modal-close']);
   var attrConfig = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({
     'aria-hidden': (modalState === 'close').toString()
   }, ariaLabel ? {
@@ -263,15 +267,15 @@ var MrlModal = /*#__PURE__*/React__namespace.forwardRef(function MrlModal(props,
     'aria-modal': 'true',
     role: 'dialog'
   });
-  delete attrs["class"];
+  delete attrs.class;
   delete attrs.className;
   var attributes = setAttributes.setAttributes(attrs, attrConfig);
   return /*#__PURE__*/React__namespace.createElement(MrlModalContext.MrlModalContext.Provider, {
     value: {
-      scrollableContent: scrollableContent,
-      setScrollableContent: setScrollableContent,
-      setTitle: setTitle,
-      title: title
+      scrollableContent,
+      setScrollableContent,
+      setTitle,
+      title
     }
   }, /*#__PURE__*/React__namespace.createElement(MrlFocusTrap.MrlFocusTrap, {
     disabled: loading,