@muraldevkit/ui-toolkit 4.66.0-dev-DhSN.1 → 4.66.0-dev-QELk.1

package/dist/esm/components/panel/MrlPanelStickyHeader/MrlPanelStickyHeader.module.scss.js

@@ -1,4 +0,0 @@
-import "./MrlPanelStickyHeader.module.css";
-export default {
-	"MrlPanelStickyHeader": "MrlPanelStickyHeader--YP3CO"
-};

package/dist/esm/components/panel/MrlPanelStickyHeader/index.js

@@ -1 +0,0 @@
-export { MrlPanelStickyHeader } from './MrlPanelStickyHeader';

package/dist/esm/components/panel/index.js

@@ -1,3 +0,0 @@
-export * from './MrlPanel';
-export * from './MrlPanelFooter';
-export * from './MrlPanelStickyHeader';

package/dist/esm/components/popover/MrlPopover/MrlPopover.js

@@ -1,307 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import classnames from 'classnames';
-import { close } from '@muraldevkit/ds-icons';
-import { MrlFocusTrap, MrlIconButton, MrlPortal, MrlSvg } from '../../';
-import { useTriggerPosition } from '../../../hooks/useTriggerPosition';
-import { useBrowserEdgeScroll } from '../../menu/hooks/useBrowserEdgeScroll';
-import { useClickOutside } from '../../../hooks/useClickOutside';
-import { useScrollbarInfo } from '../../../hooks/useScrollbarInfo';
-import { useSubMenuElementPosition } from '../../menu/hooks/useSubMenuElementPosition';
-import { preventDefault, getFocusableElementsInsideElement, findAdjacentInteractiveElement, isElementAriaDisabled } from '../../../utils';
-import { PORTAL_LAYERS } from '../../../utils/layers';
-import { useTransition, animated } from '@react-spring/web';
-import { SELECT_MENU_LIST_CLASS_NAME } from '../../form/select/MrlSelect/MrlSelect';
-import { MULTI_SELECT_MENU_LIST_CLASS_NAME } from '../../form/select/MrlMultiSelect/MrlMultiSelect';
-import styles from './MrlPopover.module.scss.js';
-import { flipPosition } from '../../menu/utilities/flip-position';
-import { getDataPoint } from './utilities/get-data-point';
-import { getOffset } from './utilities/get-offset';
-import { useMrlPopoverEventHandlers } from './hooks/use-mrl-popover-event-handlers';
-import { MrlPopoverContext } from './context/MrlPopoverContext';
-const POPOVER_CLICKOUTSIDE_WHITELIST = [
-    '#mrl-select-portal',
-    '#mrl-popover-menu-portal',
-    `.${SELECT_MENU_LIST_CLASS_NAME}`,
-    `.${MULTI_SELECT_MENU_LIST_CLASS_NAME}`
-];
-/**
- * Scrollable wrapper for the popover content. Lives as its own component so
- * `useScrollbarInfo` mounts together with the scrollable element (the popover
- * content only exists while the popover is open) and can compensate the right
- * padding when a space-consuming scrollbar appears.
- * @param {object} props - The props for the scroll container
- * @returns {Element} - rendered scrollable popover content wrapper
- */
-function MrlPopoverScrollContainer({ className, style, children }) {
-    const { scrollableContainerRef, verticalScrollbarWidth } = useScrollbarInfo();
-    return (React.createElement("div", { ref: scrollableContainerRef, className: className, style: Object.assign(Object.assign({}, style), (verticalScrollbarWidth > 0 && {
-            paddingRight: `calc(var(--mrl-popover-padding) - ${verticalScrollbarWidth}px)`
-        })) }, children));
-}
-/**
- * MrlPopover
- *
- * Renders a popover component with position and alignment relative to a trigger element
- * @param {MrlPopoverProps} props - The props for the MrlPopover component
- * @returns {Element} - rendered MrlPopover component
- */
-export function MrlPopover(_a) {
-    var { alignment = 'center', ariaLabel, ariaLabelledBy, children, className, customPosition, disableClickToOpen = false, disableClickOutside = false, disableFlipping = false, disableFocusTrap = false, hasCloseButton = false, spacing = 'default', id, isSubMenu = false, actionState = { actionType: null, isOpen: false }, position = 'bottom', point = true, portalProps = { id: PORTAL_LAYERS.POPOVER.name }, kind = 'primary', offset, onClose, onOpen, triggerRef } = _a, rest = __rest(_a, ["alignment", "ariaLabel", "ariaLabelledBy", "children", "className", "customPosition", "disableClickToOpen", "disableClickOutside", "disableFlipping", "disableFocusTrap", "hasCloseButton", "spacing", "id", "isSubMenu", "actionState", "position", "point", "portalProps", "kind", "offset", "onClose", "onOpen", "triggerRef"]);
-    const [state, setState] = React.useState({
-        actionType: null,
-        isOpen: actionState.isOpen || false
-    });
-    // stores all of the interactive elements in the popover for focus management
-    const [interactiveElements, setInteractiveElements] = React.useState([]);
-    const [menuRect, setMenuRect] = React.useState(null);
-    const menuRef = React.useRef(null);
-    /** Snapshot of trigger `aria-expanded` before we manage it; restored on popover unmount only. */
-    const triggerExpandedRestoreRef = React.useRef(null);
-    /**
-     * Checks if the trigger element is disabled
-     * @returns {boolean} - true if the trigger element is disabled, false otherwise
-     */
-    const isTriggerDisabled = React.useCallback(() => {
-        return isElementAriaDisabled(triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current);
-    }, [triggerRef]);
-    /**
-     * Opening and closing the menu
-     */
-    const closeMenu = React.useCallback(() => {
-        setState({ actionType: null, isOpen: false });
-        onClose === null || onClose === void 0 ? void 0 : onClose();
-    }, [onClose]);
-    const { handleClose, handleMenuKey, hideMenuHover, handleTriggerSiblingKey, toggleMenuKey, toggleMenuTrigger, showMenuHover } = useMrlPopoverEventHandlers({
-        closeMenu,
-        disableClickToOpen,
-        disableFocusTrap,
-        hasCloseButton,
-        interactiveElements,
-        isSubMenu,
-        isTriggerDisabled,
-        menuRef,
-        setState,
-        state,
-        triggerRef
-    });
-    useClickOutside(menuRef, triggerRef, 'mouseup', closeMenu, disableClickOutside || !state.isOpen, POPOVER_CLICKOUTSIDE_WHITELIST);
-    React.useEffect(() => {
-        if (isTriggerDisabled())
-            return;
-        if (!isSubMenu) {
-            setState({ actionType: actionState.actionType, isOpen: actionState.isOpen });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [isSubMenu, actionState.actionType, actionState.isOpen]);
-    // This use effect handles storing the rect in state for positioning calculations
-    React.useLayoutEffect(() => {
-        var _a;
-        if (!state.isOpen)
-            return;
-        // For consistent calculations, we are storing the menu rect in state
-        // Anytime we need to use the menu rect, we want to make sure the values are based
-        // on the original state of the menu for proper transformations
-        if (!menuRect && menuRef.current) {
-            const newRect = (_a = menuRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-            setMenuRect(newRect || null);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [state.isOpen, isSubMenu]);
-    // This use effect handles getting and setting the interactive elements in the popover.
-    // These elements are used for focus management when focus trap is not enabled to ensure
-    // that our tab order matches the visual order of the page
-    React.useEffect(() => {
-        if (state.isOpen && !isSubMenu && menuRef.current) {
-            if (disableFocusTrap) {
-                // set the interactive elements so we can track focus location
-                const elements = getFocusableElementsInsideElement(menuRef.current);
-                setInteractiveElements(elements);
-                // without focus trap enabled, we want to focus the first interactive element
-                elements[0].focus();
-            }
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [state.isOpen, menuRef.current]);
-    // This use effect handles setting all of the event handlers for different parts of the component.
-    // - trigger event handlers
-    // - submenu event handlers
-    // - menu event handlers
-    // - "next element" event handlers, which are event handlers attached to the next interactive element after the trigger
-    //
-    React.useEffect(() => {
-        const triggerElement = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current;
-        const menuElement = menuRef === null || menuRef === void 0 ? void 0 : menuRef.current;
-        const nextElement = findAdjacentInteractiveElement(triggerRef, 'next');
-        if (triggerElement) {
-            triggerElement.addEventListener('mousedown', (e) => e.stopPropagation());
-            triggerElement.addEventListener('click', toggleMenuTrigger);
-            triggerElement.addEventListener('keydown', toggleMenuKey);
-            if (nextElement)
-                nextElement.addEventListener('keydown', handleTriggerSiblingKey);
-            // Setup event listeners for when the menu is a submenu
-            if (isSubMenu) {
-                const menuElement = menuRef === null || menuRef === void 0 ? void 0 : menuRef.current;
-                triggerElement.addEventListener('mouseover', showMenuHover);
-                triggerElement.addEventListener('mouseout', hideMenuHover);
-                if (menuElement) {
-                    menuElement.addEventListener('mouseover', showMenuHover);
-                    menuElement.addEventListener('mouseout', hideMenuHover);
-                }
-            }
-            return () => {
-                triggerElement.removeEventListener('mousedown', preventDefault);
-                triggerElement.removeEventListener('click', toggleMenuTrigger);
-                triggerElement.removeEventListener('keydown', toggleMenuKey);
-                if (nextElement)
-                    nextElement.removeEventListener('keydown', handleTriggerSiblingKey);
-                if (isSubMenu) {
-                    triggerElement.removeEventListener('mouseover', showMenuHover);
-                    triggerElement.removeEventListener('mouseout', hideMenuHover);
-                    if (menuElement) {
-                        menuElement.removeEventListener('mouseover', showMenuHover);
-                        menuElement.removeEventListener('mouseout', hideMenuHover);
-                    }
-                }
-            };
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        closeMenu,
-        isSubMenu,
-        toggleMenuKey,
-        toggleMenuTrigger,
-        triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current,
-        hideMenuHover,
-        showMenuHover,
-        hasCloseButton,
-        handleClose
-    ]);
-    /**
-     * Popover triggers are not necessarily modal dialogs; use the generic 'true' (see ARIA in HTML).
-     * Restore the previous DOM value when the trigger changes or this popover unmounts so host-owned
-     * ARIA (e.g. aria-haspopup="menu") is not left stale after a callout dismisses.
-     */
-    React.useEffect(() => {
-        const el = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current;
-        if (!el)
-            return;
-        const previousValue = el.getAttribute('aria-haspopup');
-        el.setAttribute('aria-haspopup', 'true');
-        // Restore the previous value of the aria-haspopup attribute when the callout is removed from the DOM
-        return () => {
-            if (previousValue === null) {
-                el.removeAttribute('aria-haspopup');
-            }
-            else {
-                el.setAttribute('aria-haspopup', previousValue);
-            }
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current]);
-    React.useEffect(() => {
-        const el = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current;
-        if (!el)
-            return;
-        // Store the previous value of the aria-expanded attribute when the callout is added to the DOM
-        if (!triggerExpandedRestoreRef.current || triggerExpandedRestoreRef.current.el !== el) {
-            triggerExpandedRestoreRef.current = {
-                el,
-                value: el.hasAttribute('aria-expanded') ? el.getAttribute('aria-expanded') : null
-            };
-        }
-        // Set the aria-expanded attribute to the current state of the popover
-        el.setAttribute('aria-expanded', state.isOpen.toString());
-        if (state.isOpen)
-            onOpen === null || onOpen === void 0 ? void 0 : onOpen();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [state.isOpen, onOpen, triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current]);
-    /**
-     * Restore the previous value of the aria-expanded attribute when the callout is removed from the DOM
-     */
-    React.useEffect(() => {
-        return () => {
-            var _a;
-            const snap = triggerExpandedRestoreRef.current;
-            if (!snap)
-                return;
-            const { el, value } = snap;
-            if (!((_a = document === null || document === void 0 ? void 0 : document.documentElement) === null || _a === void 0 ? void 0 : _a.contains(el)))
-                return;
-            if (value === null) {
-                el.removeAttribute('aria-expanded');
-            }
-            else {
-                el.setAttribute('aria-expanded', value);
-            }
-        };
-    }, []);
-    /**
-     * Setup positioning styles, submenu positioning styles, scroll styles, and transition.
-     */
-    const memoizedCustomPosition = React.useMemo(() => customPosition, [customPosition]);
-    const customPopoverPosition = memoizedCustomPosition || { left: 0, top: 0 };
-    const menuPosition = useTriggerPosition(triggerRef, menuRef, {
-        align: alignment,
-        customPosition: customPopoverPosition,
-        position: position
-    }, state.isOpen, offset || getOffset(position, point), isSubMenu, disableFlipping);
-    const subMenuPosition = useSubMenuElementPosition(triggerRef, menuRef, isSubMenu, state.isOpen, menuRect, !isSubMenu);
-    const menuPositionState = menuPosition.flipped ? flipPosition(position) : position;
-    const scrollStyles = useBrowserEdgeScroll(menuRef, menuPositionState, alignment);
-    const inlineStyles = {
-        menu: {
-            left: menuPosition.left,
-            position: 'fixed',
-            top: menuPosition.top
-        },
-        submenu: {
-            left: subMenuPosition.left,
-            top: subMenuPosition.top
-        }
-    };
-    /**
-     * React Spring transitions for the menu
-     */
-    const transitions = useTransition(state.isOpen, {
-        config: { duration: 150 },
-        enter: { opacity: 1, transform: 'translateY(0)' },
-        from: { opacity: 0, transform: 'translateY(4px)' },
-        leave: { opacity: 0, transform: 'translateY(4px)' }
-    });
-    const menuClasses = classnames(styles['MrlPopover'], 'MrlPopover', styles['MrlPopover--scrolling'], className, {
-        [styles['MrlPopover--submenu']]: isSubMenu,
-        [styles['inverse']]: kind === 'inverse',
-        [styles['primary']]: kind === 'primary',
-        [styles['compact']]: spacing === 'compact',
-        [styles['default']]: spacing === 'default'
-    });
-    const positionStyles = isSubMenu ? inlineStyles.submenu : inlineStyles.menu;
-    const renderMenu = () => {
-        const inlineScrollStyles = isSubMenu ? {} : scrollStyles ? scrollStyles.styles : {};
-        const scrollClasses = classnames(styles['MrlPopover--content'], styles['MrlPopover--scrolling--content']);
-        return (React.createElement(React.Fragment, null, transitions((style, item) => item && (React.createElement(MrlFocusTrap, { disabled: disableFocusTrap, containerRef: menuRef },
-            React.createElement(animated.div, Object.assign({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className: menuClasses, id: id, tabIndex: -1, style: Object.assign(Object.assign({}, positionStyles), style), onKeyDown: handleMenuKey, ref: menuRef }, rest),
-                React.createElement(MrlPopoverScrollContainer, { className: scrollClasses, style: inlineScrollStyles },
-                    typeof children === 'function' && children({ closeMenu }),
-                    typeof children !== 'function' && children,
-                    hasCloseButton && (React.createElement(MrlIconButton, { "data-qa": "popover-close-button", wrapperClassName: styles['MrlPopover--close'], icon: React.createElement(MrlSvg, { svg: close }), kind: kind === 'inverse' ? 'ghost-inverse' : 'ghost', text: "Close", state: "default", position: "right", tipAnchor: "center", onMouseUp: closeMenu, onKeyDown: handleClose, size: "small" })),
-                    point && (React.createElement("div", { className: styles['MrlPopover--point'], "data-point": getDataPoint(menuPositionState, alignment) })))))))));
-    };
-    /* eslint-disable */
-    return (React.createElement(MrlPopoverContext.Provider, { value: {
-            closeMenu
-        } }, isSubMenu ? (renderMenu()) : (React.createElement(MrlPortal, Object.assign({ layer: portalProps.layer || PORTAL_LAYERS.POPOVER }, portalProps), renderMenu()))));
-    /* eslint-enable */
-}
-MrlPopover.componentType = 'Popover';

package/dist/esm/components/popover/MrlPopover/MrlPopover.module.css

@@ -1,121 +0,0 @@
-/* stylelint-disable scss/operator-no-newline-after */
-.mrl-u-focus-wrapper--FBve0 {
-  position: relative;
-}
-
-.primary--5FMZn {
-  --mrl-popover-background-color: var(--mrl-color-background);
-  --mrl-popover-text-color: var(--mrl-color-text);
-  --mrl-popover-text-emph-color: var(--mrl-color-text-emph);
-}
-
-.inverse--IA9ES {
-  --mrl-popover-background-color: var(--mrl-color-background-inverse);
-  --mrl-popover-text-color: var(--mrl-color-text-inverse);
-  --mrl-popover-text-emph-color: var(--mrl-color-text-emph);
-}
-
-.default--MvZ6i {
-  --mrl-popover-padding: var(--mrl-spacing-05);
-}
-
-.compact--uj75b {
-  --mrl-popover-padding: var(--mrl-spacing-04);
-}
-
-.MrlPopover---qmfx {
-  background: var(--mrl-popover-background-color);
-  border-radius: var(--mrl-border-radius-functional-large);
-  box-shadow: var(--mrl-shadows-raised);
-  color: var(--mrl-popover-text-color);
-  flex-direction: column;
-  max-width: 600px;
-  opacity: 0;
-  pointer-events: auto;
-  position: fixed;
-  z-index: 500;
-  z-index: 600;
-  filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.24)) drop-shadow(0 6px 8px rgba(0, 0, 0, 0.06));
-}
-.MrlPopover---qmfx a {
-  color: var(--mrl-popover-text-color);
-}
-.MrlPopover--submenu--H6fY9 {
-  left: 97%;
-  position: absolute;
-}
-.MrlPopover--close--OHuvU {
-  position: absolute;
-  right: 4px;
-  top: 6px;
-  transition: none;
-}
-.MrlPopover--close--OHuvU svg {
-  color: var(--mrl-popover-text-color);
-}
-.MrlPopover---qmfx.open--AGUUs {
-  display: flex;
-}
-.MrlPopover--scrolling--content--9IDEb {
-  overflow: hidden auto;
-  padding: var(--mrl-popover-padding);
-}
-.MrlPopover--scrolling--content--9IDEb .MrlPopover--close--OHuvU {
-  position: absolute;
-  right: 8px;
-}
-.MrlPopover--point--hv0be {
-  background: var(--mrl-popover-background-color);
-  border-radius: 0 2px;
-  height: 10px;
-  position: absolute;
-  width: 10px;
-  z-index: 2;
-}
-.MrlPopover--point--hv0be[data-point*=bottom-] {
-  top: -4px;
-  transform: rotate(315deg);
-}
-.MrlPopover--point--hv0be[data-point*=top-] {
-  bottom: -4px;
-  transform: rotate(315deg);
-}
-.MrlPopover--point--hv0be[data-point=bottom-start], .MrlPopover--point--hv0be[data-point=top-start] {
-  left: 14px;
-}
-.MrlPopover--point--hv0be[data-point=bottom-end], .MrlPopover--point--hv0be[data-point=top-end] {
-  right: 14px;
-}
-.MrlPopover--point--hv0be[data-point=bottom-center], .MrlPopover--point--hv0be[data-point=top-center] {
-  left: calc(50% - 8px);
-}
-.MrlPopover--point--hv0be[data-point*=left-] {
-  right: -5px;
-  transform: rotate(225deg);
-}
-.MrlPopover--point--hv0be[data-point*=right-] {
-  left: -5px;
-  transform: rotate(45deg);
-}
-.MrlPopover--point--hv0be[data-point=left-center], .MrlPopover--point--hv0be[data-point=right-center] {
-  top: calc(50% - 8px);
-}
-.MrlPopover--point--hv0be[data-point=left-top], .MrlPopover--point--hv0be[data-point=right-top] {
-  top: 16px;
-}
-.MrlPopover--point--hv0be[data-point=left-bottom], .MrlPopover--point--hv0be[data-point=right-bottom] {
-  bottom: 16px;
-}
-
-.inverse--IA9ES .MrlPopover--scrolling--content--9IDEb::-webkit-scrollbar {
-  background-color: var(--mrl-popover-background-color);
-  border-radius: 10px;
-  width: 12px;
-}
-.inverse--IA9ES .MrlPopover--scrolling--content--9IDEb::-webkit-scrollbar-thumb {
-  background-clip: content-box;
-  background-color: var(--mrl-popover-text-color);
-  border: 3px solid transparent;
-  border-radius: 10px;
-  position: relative;
-}

package/dist/esm/components/popover/MrlPopover/MrlPopover.module.scss.js

@@ -1,14 +0,0 @@
-import "./MrlPopover.module.css";
-export default {
-	"mrl-u-focus-wrapper": "mrl-u-focus-wrapper--FBve0",
-	"primary": "primary--5FMZn",
-	"inverse": "inverse--IA9ES",
-	"default": "default--MvZ6i",
-	"compact": "compact--uj75b",
-	"MrlPopover": "MrlPopover---qmfx",
-	"MrlPopover--submenu": "MrlPopover--submenu--H6fY9",
-	"MrlPopover--close": "MrlPopover--close--OHuvU",
-	"open": "open--AGUUs",
-	"MrlPopover--scrolling--content": "MrlPopover--scrolling--content--9IDEb",
-	"MrlPopover--point": "MrlPopover--point--hv0be"
-};

package/dist/esm/components/popover/MrlPopover/context/MrlPopoverContext.js

@@ -1,17 +0,0 @@
-import * as React from 'react';
-/**
- * Adds context for the MrlPopover component
- */
-export const MrlPopoverContext = React.createContext(undefined);
-/**
- * Returns the MrlPopoverContext state.
- *
- * @returns The MrlPopoverContext state.
- */
-export const useMrlPopoverContext = () => {
-    const context = React.useContext(MrlPopoverContext);
-    if (!context) {
-        throw new Error('useMrlPopoverContext must be used within a MrlPopoverContext.Provider');
-    }
-    return context;
-};

package/dist/esm/components/popover/MrlPopover/hooks/use-mrl-popover-event-handlers.js

@@ -1,170 +0,0 @@
-import * as React from 'react';
-import { findAdjacentInteractiveElement, preventDefault } from '../../../../utils';
-/**
- * Creates all of the required event handlers for the MrlPopover component
- *
- * @param options configuration options
- * @returns all of the required event handlers
- */
-export const useMrlPopoverEventHandlers = ({ closeMenu, isSubMenu, disableFocusTrap, disableClickToOpen, hasCloseButton, interactiveElements, menuRef, state, setState, triggerRef, isTriggerDisabled }) => {
-    /**
-     * Sets up trigger event listeners to open and close the menu with a keyboard
-     */
-    const toggleMenuKey = React.useCallback((e) => {
-        if (!state.isOpen) {
-            switch (e.key) {
-                case 'ArrowRight':
-                    if (isSubMenu) {
-                        preventDefault(e);
-                        setState({ actionType: 'click', isOpen: true });
-                    }
-                    break;
-                case 'Enter':
-                case ' ':
-                    if (!disableClickToOpen && !isTriggerDisabled()) {
-                        preventDefault(e);
-                        setState({ actionType: e.key, isOpen: true });
-                    }
-                    break;
-                case 'ArrowDown':
-                    if (!isSubMenu && !disableClickToOpen && !isTriggerDisabled()) {
-                        preventDefault(e);
-                        setState({ actionType: e.key, isOpen: true });
-                    }
-            }
-        }
-        else if (state.isOpen) {
-            // When focus is on the trigger and the popover is open, if a user presses "tab"
-            // we want to move focus to the first interactive element of the popover
-            // so that the tab order of the DOM follows the visual order of the page
-            switch (e.key) {
-                case 'Tab':
-                    if (!e.shiftKey && disableFocusTrap) {
-                        if (document.activeElement === (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current)) {
-                            preventDefault(e);
-                            interactiveElements[0].focus();
-                        }
-                    }
-                    break;
-            }
-        }
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [disableFocusTrap, state.isOpen, interactiveElements]);
-    /**
-     * Sets up trigger event listeners to open and close the menu
-     *
-     */
-    const toggleMenuTrigger = React.useCallback(() => {
-        if (disableClickToOpen || isTriggerDisabled())
-            return;
-        setState((prevState) => ({ actionType: 'click', isOpen: !prevState.isOpen }));
-    }, [disableClickToOpen, isTriggerDisabled, setState]);
-    /**
-     * Used to display the menu when hovering over a menu item that has a submenu
-     */
-    const showMenuHover = React.useCallback(() => {
-        setState({ actionType: 'click', isOpen: true });
-    }, [setState]);
-    const hideMenuHover = React.useCallback((event) => {
-        // event.relatedTarget is a property utilized in mouse-related events such as `mouseover` and `mouseout`
-        // It signifies the element that was previously targeted before the current event occurred.
-        //
-        // For instance, in a `mouseover` event, `event.relatedTarget` refers to the
-        // element the cursor was over before moving to the current element.
-        const relatedTarget = event.relatedTarget;
-        // If the related target is not a child of the menu, close the menu
-        // This prevents the menu from closing when hovering over a submenu item or trigger
-        if (menuRef.current &&
-            !menuRef.current.contains(relatedTarget) &&
-            (triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) &&
-            !(triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current.contains(relatedTarget))) {
-            setState({ actionType: null, isOpen: false });
-        }
-    }, [triggerRef, menuRef, setState]);
-    /**
-     * Focus management when someone is using a keyboard to navigate the menu
-     *
-     * @param e - keyboard event
-     */
-    const handleMenuKey = (e) => {
-        var _a, _b, _c;
-        if (state.isOpen) {
-            switch (e.key) {
-                case 'Escape':
-                    preventDefault(e);
-                    (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-                    closeMenu();
-                    break;
-                case 'Tab':
-                    e.stopPropagation();
-                    if (disableFocusTrap) {
-                        const first = interactiveElements[0];
-                        const last = interactiveElements[interactiveElements.length - 1];
-                        const isShiftKey = e.shiftKey;
-                        // If the first or last interactive element is focused, we want to move focus to the trigger
-                        // and close the menu. If the last iteractive element is focused, we are checking that the shift
-                        // key is not held down. Otherwise the popover will close when you press shift+tab on an element
-                        // that is not the first one.
-                        if (isShiftKey && document.activeElement === first) {
-                            preventDefault(e);
-                            (_b = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-                            if (!hasCloseButton)
-                                setState({ actionType: null, isOpen: false });
-                        }
-                        if (!isShiftKey && document.activeElement === last) {
-                            preventDefault(e);
-                            (_c = findAdjacentInteractiveElement(triggerRef, 'next')) === null || _c === void 0 ? void 0 : _c.focus();
-                            if (!hasCloseButton)
-                                setState({ actionType: null, isOpen: false });
-                        }
-                    }
-                    break;
-                case 'ArrowUp':
-                case 'ArrowDown':
-                case 'ArrowLeft':
-                case 'ArrowRight':
-                    preventDefault(e);
-                    break;
-            }
-        }
-    };
-    /**
-     * When focus trap is disabled, we need to handle moving focus back to the popover when you
-     * shift+tab from the interactive element immediately after the trigger. This will allow us
-     * to maintain a tab order that matches the visual order on the page.
-     *
-     * @param e - keyboard event
-     */
-    const handleTriggerSiblingKey = (e) => {
-        if (state.isOpen && disableFocusTrap) {
-            switch (e.key) {
-                case 'Tab':
-                    if (e.shiftKey) {
-                        preventDefault(e);
-                        interactiveElements[interactiveElements.length - 1].focus();
-                        break;
-                    }
-            }
-        }
-    };
-    const handleClose = React.useCallback((e) => {
-        var _a;
-        if (e.key === 'Enter' || e.key === ' ') {
-            closeMenu();
-            if (disableFocusTrap)
-                (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [closeMenu, disableFocusTrap]);
-    return {
-        handleClose,
-        handleMenuKey,
-        handleTriggerSiblingKey,
-        hideMenuHover,
-        showMenuHover,
-        toggleMenuKey,
-        toggleMenuTrigger
-    };
-};

package/dist/esm/components/popover/MrlPopover/index.js

@@ -1,2 +0,0 @@
-export * from './MrlPopover';
-export * from './utilities';

package/dist/esm/components/popover/MrlPopover/utilities/get-data-point.js

@@ -1,10 +0,0 @@
-/**
- * Returns the data-point attribute for the popover pointer
- *
- * @param position - position of the menu
- * @param alignment - alignment of the menu
- * @returns - data-point attribute value
- */
-export const getDataPoint = (position, alignment) => {
-    return `${position}-${alignment}`;
-};