@oracle/oraclejet-preact 15.1.2 → 15.1.3

package/es/Menu-3c6e6068.js

@@ -0,0 +1,380 @@
+/* @oracle/oraclejet-preact: 15.1.3 */
+import { jsx, jsxs, Fragment } from 'preact/jsx-runtime';
+import { forwardRef, useCallback as useCallback$1 } from 'preact/compat';
+import './UNSAFE_Floating.js';
+import { Layer } from './UNSAFE_Layer.js';
+import { useMemo, useCallback, useRef, useState, useEffect } from 'preact/hooks';
+import { mergeProps } from './utils/UNSAFE_mergeProps.js';
+import './utils/UNSAFE_classNames.js';
+import { useUser } from './hooks/UNSAFE_useUser.js';
+import { u as useMenuContext, k as keyElemExtractor, g as getPrevNext, a as getNVisible, b as getLastVisible, c as getKeyboardCloseProps, d as getCloseSubmenuEvent, e as getMenuContainerFocusMethods, f as getMenuContainerMouseLeave, h as getMenuPointerDown, i as MenuContainerContext, j as getIsMobile, l as MenuContext } from './MenuItem-51adf69e.js';
+import { menuStyles } from './UNSAFE_Menu/themes/MenuStyles.css.js';
+import { c as classNames } from './classNames-bd44965c.js';
+import { dropdownMenuStyles } from './UNSAFE_Menu/themes/DropdownMenuStyles.css.js';
+import { F as Floating } from './Floating-b522c321.js';
+import { u as useModal } from './useModal-a341237c.js';
+import { sheetMenuStyles } from './UNSAFE_Menu/themes/SheetMenuStyles.css.js';
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/**
+ * Hook for handling current key update due to user interaction including keyboard navigation.
+ *
+ * @param getPrev function to get the previous key based on the current key
+ * @param getNext function to get the next key based on the current key
+ * @param getFirstVisible function to get the key of the first available item
+ * @param getLastVisible function to get the key of the last available item
+ * @param onChange function to invoke if the current key has changed
+ * @returns
+ */
+function useMenuCurrentKey(getPrev, getNext, getFirstVisible, getLastVisible, onChange) {
+    const keyDownKeyFunctions = useMemo(() => {
+        return {
+            ArrowDown: getNext,
+            ArrowUp: getPrev,
+            Home: getFirstVisible,
+            End: getLastVisible
+        };
+    }, [getNext, getPrev, getFirstVisible, getLastVisible]);
+    const onKeyDown = useCallback((event) => {
+        if (onChange) {
+            // TODO: support horizontal layout on icon menu (left/right arrow key)
+            const keyFunction = keyDownKeyFunctions[event.key];
+            if (keyFunction && !event.shiftKey) {
+                const key = keyFunction();
+                if (key) {
+                    onChange({ key, reason: 'keyboard' });
+                }
+                event.preventDefault();
+            }
+        }
+    }, [onChange, keyDownKeyFunctions]);
+    const currentKeyProps = onChange == null ? {} : { onKeyDown };
+    return { currentKeyProps };
+}
+
+/*Component where general behavior is handled. Here we controled focus behavior, focus styling, submenu
+opening behavior and current active item behavior. */
+const MenuContainer = ({ children, 'aria-label': ariaLabel, currentFocus = 'menu', display, closeSubmenu, menuId, menuLevel }) => {
+    const { onClose } = useMenuContext();
+    //Important to know direction so closeSubmenu is handled properly if needed.
+    const { direction } = useUser();
+    const menuContainerRef = useRef(null);
+    /*We share same behavior as legacy menu on mouseLeave that is:
+    1. If we mouse leave a menuItem but we still on menuContainer and we are not hovering any other menuItem, we keep
+    the focus on the menuItem and hovering style.
+    2. If we mouseLeave but next target is a submenu we open a submenu.
+    3. If we mouseLeave the container and next target is not a submenu, we reset current key and set the focus on the
+    menuContainer.If we mouseLeaved a submenuItem, submenu is closed.
+    General information used by menuItems:
+    -wasMouseMoved: Used to don't allow mouseEnter callbacks being triggered if mouse was not moved already.
+    -lastMouseLeaveValidatedRelatedTarget: We use bubbling nature of events to first check/validate the related target in onMouseLeave events of
+      menuItems. For menuItems we check if the related target is the menuContainer itself or a submenu. We validate there
+      since at this level we don't have access to any submenu. Everytime mouseEnter triggers at menuContainer we have to compare if both
+      relatedTargets are the same(menuContainer and last menuItem one), if not, this means mouse is now outside of the container.
+    */
+    const menuContainerGeneralInformation = useRef({
+        wasMouseMoved: false,
+        lastMouseLeaveMenuItemdRelatedTarget: null
+    });
+    //Used so focus is handled just one time using currentFocus. Used combined with menuLevel due to main menu can't
+    // change its focus via currentFocus prop.
+    const initialFocusDone = useRef(false);
+    //Key of the active element on this menu container
+    const [currentKey, setCurrentKey] = useState();
+    //State that represents if focused outline styles needs
+    const [showFocusRing, setShowFocusRing] = useState(false);
+    //Based on this we would include or not hovering styling. Same as legacy
+    const [isContainerFocused, setIsContainerFocused] = useState(false);
+    //Funtion triggered on blur. This is called since if focus is not anymore on the container we would need to do
+    //some validation
+    const blurFunction = () => {
+        if (!menuContainerRef.current?.contains(document.activeElement)) {
+            setShowFocusRing(false);
+            setIsContainerFocused(false);
+        }
+    };
+    const focusFunction = () => {
+        setIsContainerFocused(true);
+    };
+    const mouseLeaveFunction = (e) => {
+        //We have to validate if new hover target was already validated correctly, if not this means mouse is now outside container
+        if (!e.relatedTarget.isEqualNode(menuContainerGeneralInformation.current.lastMouseLeaveMenuItemdRelatedTarget)) {
+            //We reset current key when mouse is outside the container or any submenu. This is how legacy menu works
+            changeKey({
+                key: undefined,
+                reason: 'mouseEnter'
+            });
+            //We focus menuContainer so keyboard navigation can be still used
+            menuContainerRef.current?.focus();
+        }
+    };
+    //Function used to change the currentKey
+    const changeKey = useCallback((detail) => {
+        setCurrentKey(detail.key);
+        if (detail.reason === 'keyboard') {
+            setShowFocusRing(true);
+        }
+        else {
+            setShowFocusRing(false);
+        }
+    }, []);
+    //This is used since if mouse overlaps space when menu is rendered, menuItem could trigger menuEnter,
+    // which is not desirable.Once mouse was moved inside container, we could trigger mouseEnter events normally.
+    const selfDestructiveMouseMoveEvent = useCallback(() => {
+        const handler = (e) => {
+            const keyElem = keyElemExtractor(e.target);
+            const key = keyElem?.key;
+            const elem = keyElem?.elem;
+            //We will trigger this event until a menuItem is found. Usually this don't take to much to happen
+            if (key && elem) {
+                menuContainerGeneralInformation.current.wasMouseMoved = true;
+                const evt = new MouseEvent('mouseenter');
+                elem.dispatchEvent(evt);
+                menuContainerRef.current?.removeEventListener('mousemove', handler);
+            }
+        };
+        menuContainerRef.current?.addEventListener('mousemove', handler);
+    }, []);
+    const { currentKeyProps } = useMenuCurrentKey(getPrevNext(menuContainerRef.current, true, currentKey), getPrevNext(menuContainerRef.current, false, currentKey), () => getNVisible(menuContainerRef.current, 0), () => getLastVisible(menuContainerRef.current), changeKey);
+    useEffect(() => {
+        if (menuLevel === 'main' && initialFocusDone.current)
+            return;
+        initialFocusDone.current = true;
+        const menuContainer = menuContainerRef.current;
+        let timer;
+        /*TODO: There are some cases where is not safe to focus since
+        visibility initially is hidden at the Floating component at the initial render. Need a way to solve this in a
+        less dirty way (we are now using timeouts). More details on the descripton of JET-57353 */
+        if (currentFocus !== 'none' && menuContainer) {
+            if (currentFocus === 'menu') {
+                changeKey({ key: undefined, reason: 'click' });
+                const focusMenuContainer = () => {
+                    menuContainer.focus();
+                };
+                if (display === 'sheet') {
+                    focusMenuContainer();
+                }
+                else {
+                    // At this point floating has visibility set as hidden, so also menuContainer. Settimeout added so menuContainer
+                    // is visible at that point and can be focused.
+                    timer = setTimeout(() => {
+                        focusMenuContainer();
+                    }, FOCUS_SHIFT_TIMEOUT);
+                }
+            }
+            else if (currentFocus === 'firstItem') {
+                const firstItem = getNVisible(menuContainerRef.current, 0);
+                if (firstItem) {
+                    changeKey({ key: firstItem, reason: 'keyboard' });
+                }
+            }
+            else if (currentFocus === 'secondItem') {
+                //This is just used in sheet menu, so no need to set a timeout
+                const item = getNVisible(menuContainerRef.current, 1);
+                if (item) {
+                    changeKey({ key: item, reason: 'keyboard' });
+                }
+            }
+        }
+        return () => {
+            //We have to clean timers, because comp can be unmounted after finishing timeouts
+            clearTimeout(timer);
+        };
+    }, [changeKey, currentFocus, menuLevel, display]);
+    useEffect(() => {
+        selfDestructiveMouseMoveEvent();
+    }, [selfDestructiveMouseMoveEvent]);
+    return (jsx("div", { ...(menuId && { id: menuId }), ref: menuContainerRef, tabIndex: !currentKey && (menuLevel === 'main' || display === 'sheet') ? 0 : -1, role: "menu", "aria-label": ariaLabel, class: classNames([
+            menuStyles.menuContainerStyle,
+            menuStyles[`${display}MenuContainerStyle`]
+        ]), ...mergeProps(currentKeyProps, getKeyboardCloseProps(onClose, menuLevel), getCloseSubmenuEvent(direction, closeSubmenu), getMenuContainerFocusMethods(blurFunction, focusFunction), getMenuContainerMouseLeave(mouseLeaveFunction), getMenuPointerDown()), children: jsx(MenuContainerContext.Provider, { value: {
+                /*We use this ref on dropdownSubmenu since unhover only close the menu if menuContainer ref does not include
+                the new element that receives the hovering */
+                menuContainerRef,
+                currentKey,
+                showFocusRing,
+                changeKey,
+                menuContainerGeneralInformation,
+                isContainerFocused
+            }, children: children }) }));
+};
+//Temporal constant, will probably be removed with JET-57353
+const FOCUS_SHIFT_TIMEOUT = 0;
+
+/*Component used to render a dropdown menu. For now this is just rendered when device is not a phone. */
+const DropdownMenu = forwardRef(({ anchorRef, defaultPlacement, offsetValue, closeSubmenu, children, 'aria-label': ariaLabel, currentFocus, menuId, menuLevel, flipOptions }, ref) => {
+    const { onClose } = useMenuContext();
+    const useOutsideClickHandler = useCallback$1((e) => {
+        if (menuLevel === 'sub')
+            return;
+        // Outside click is not considered when menuItem was clicked
+        const menuItemKey = keyElemExtractor(e.target)?.key;
+        if (!menuItemKey) {
+            onClose?.({ reason: 'outsideClick', target: e.target });
+        }
+    }, [onClose, menuLevel]);
+    // TODO - Reuse a dropdown component instead of creating floating by ourselves.
+    return (jsx(Layer, { logicalParentRef: anchorRef, children: jsx(Floating, { class: dropdownMenuStyles.base, onClickOutside: useOutsideClickHandler, anchorRef: anchorRef, flipOptions: flipOptions, shiftOptions: {
+                mainAxis: false,
+                crossAxis: false
+            }, sizeOptions: { isMaxHeightAdjusted: true, isMaxWidthAdjusted: true }, 
+            //TODO: JET-57950. Need to see how we set 24px boundary.
+            //TODO: Boundaries need to match with the dropdowns used in other comps.  Also figure out how to make it themable.
+            boundaryOptions: { padding: 0 }, placement: defaultPlacement, offsetValue: offsetValue, children: jsx("div", { style: {
+                    minWidth: `${anchorRef.current && anchorRef.current.offsetWidth > MENU_MIN_WIDTH
+                        ? anchorRef.current.offsetWidth
+                        : MENU_MIN_WIDTH}px`
+                }, ref: ref, children: jsx(MenuContainer, { menuLevel: menuLevel, closeSubmenu: closeSubmenu, "aria-label": ariaLabel, currentFocus: currentFocus, menuId: menuId, display: "dropdown", children: children }) }) }) }));
+});
+const MENU_MIN_WIDTH = 200;
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * Licensed under The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/*This "private" hook will live until we end up stating a final decision on useSwipe hook.
+For that hook to work, element that use it has to set touch-action:none;, since pointer events
+are canceled once a touch action is going to be handled by the browser. This works for most
+of the components that don't scroll. But if the component scroll, there is a need for the browser to
+handle scroll which is imposible with a hook just using pointer events.
+*/
+function useMenuSwipe(onSwipe, { threshold = 10, maximumTime = 300, tolerance = 50, isDisabled = false } = {
+    threshold: 10,
+    maximumTime: 300,
+    tolerance: 50,
+    isDisabled: false
+}) {
+    const ref = useRef({
+        pointerDownId: 0,
+        startTime: null,
+        prevpageX: 0,
+        prevpageY: 0,
+        elementScrollTop: 0
+    });
+    const clearSwipe = useCallback(() => {
+        ref.current = {
+            pointerDownId: null,
+            startTime: 0,
+            prevpageX: 0,
+            prevpageY: 0,
+            elementScrollTop: 0
+        };
+    }, []);
+    const onTouchStart = useCallback((e) => {
+        const touchobj = e.changedTouches[0];
+        if (!ref.current.pointerDownId) {
+            ref.current = {
+                pointerDownId: touchobj.identifier,
+                startTime: e.timeStamp,
+                prevpageX: touchobj.pageX,
+                prevpageY: touchobj.pageY,
+                elementScrollTop: e.currentTarget.scrollTop
+            };
+        }
+        else {
+            clearSwipe();
+        }
+    }, [clearSwipe]);
+    const onTouchEnd = useCallback((ev) => {
+        const touchobj = ev.changedTouches[0];
+        if (touchobj.identifier === ref.current.pointerDownId) {
+            if (ref.current.startTime && ev.timeStamp - ref.current.startTime < maximumTime) {
+                if (touchobj.pageY - ref.current.prevpageY > threshold &&
+                    Math.abs(touchobj.pageX - ref.current.prevpageX) <= tolerance &&
+                    ref.current.elementScrollTop === 0) {
+                    onSwipe?.({ direction: 'down' });
+                }
+            }
+        }
+        // state would be reset to its original state whether swipe is completed or cancelled
+        clearSwipe();
+    }, [threshold, onSwipe, clearSwipe, maximumTime, tolerance]);
+    const swipeProps = isDisabled
+        ? {}
+        : {
+            /** event handlers to spread on the target element. */
+            onTouchStart,
+            onTouchEnd,
+            ontouchcancel: clearSwipe
+        };
+    return {
+        swipeProps
+    };
+}
+
+const ModalWrapper = ({ children }) => (jsx("div", { class: sheetMenuStyles.modalWrapper, children: children }));
+const ModalContainer = forwardRef(({ children }, ref) => (jsx("div", { class: sheetMenuStyles.modalContainer, ref: ref, children: children })));
+//ModalBackdrop on modal folder not setting the style on oj-c enviroment
+//Creating it here so we don't see that issue
+const ModalBackdrop = ({ backdropVisible = false }) => (jsx("div", { class: classNames([
+        sheetMenuStyles.modalBackdrop,
+        backdropVisible && sheetMenuStyles.modalBackdropVisible
+    ]) }));
+const SheetMenu = ({ children, 'aria-label': ariaLabel, currentFocus, anchorRef, closeSubmenu, menuLevel }) => {
+    const { onClose } = useMenuContext();
+    useEffect(() => {
+        // We set the overflow body as hidden when mounted and revert to original overflow value when is
+        // unmounted. This is done to don't allow backgound being scrolled
+        // This will be handled by modal/popup when ready
+        const initialOverflow = document.body.style.overflow;
+        document.body.style.overflow = 'hidden';
+        return () => {
+            document.body.style.overflow = initialOverflow;
+        };
+    }, []);
+    const dismissHandler = useCallback(() => {
+        onClose?.({ reason: 'dismissed' });
+    }, [onClose]);
+    const { backdropRef } = useModal({ isOpen: true, onBackdropClick: dismissHandler });
+    //TODO: Use useSwipe when it works on components that could scroll.
+    const { swipeProps } = useMenuSwipe(dismissHandler);
+    // TODO: For now we are mimicking current modal but using a "different position setting" (using absolute positioning instead of flex).
+    // Have to use modal/popup component directly instead doing this composition when that component could satisfy our requirments.
+    return (jsx(Layer, { logicalParentRef: anchorRef, children: jsxs(ModalWrapper, { children: [jsx(ModalBackdrop, { backdropVisible: menuLevel === 'main' }), jsx(ModalContainer, { ref: backdropRef, children: jsx("div", { class: sheetMenuStyles.sheetMenuContainerWrapper, ...swipeProps, children: jsx(MenuContainer, { ...{ ariaLabel, currentFocus, display: 'sheet', closeSubmenu, menuLevel }, children: children }) }) })] }) }));
+};
+
+const isMobile = getIsMobile();
+/* Component that is exposed to final user to create a menu. Important to notice that this component is just used by
+the final user to express a main menu. It's not reused by us for submenus (we use SheetMenu and DropdownMenu directly there) */
+const Menu = ({ onClose, isOpen, initialFocus, ...menuProps }) => {
+    //On close is consumed by the whole menu structure including the main menu and submenu ones.
+    return (jsx(MenuContext.Provider, { value: { onClose, isMobile }, children: !isOpen ? null : (jsx(Fragment, { children: isMobile ? (jsx(SheetMenu, { ...{
+                    ...menuProps,
+                    currentFocus: initialFocus,
+                    menuLevel: 'main'
+                } })) : (jsx(DropdownMenu, { ...{
+                    ...menuProps,
+                    currentFocus: initialFocus,
+                    menuLevel: 'main',
+                    defaultPlacement: 'bottom-start',
+                    offsetValue: {
+                        mainAxis: 4,
+                        crossAxis: 0
+                    },
+                    flipOptions: {
+                        crossAxis: true,
+                        mainAxis: true,
+                        fallbackPlacements: [
+                            'bottom-end',
+                            'top-start',
+                            'top-end',
+                            'end-top',
+                            'start-top',
+                            'end-bottom',
+                            'start-bottom'
+                        ]
+                    }
+                } })) })) }));
+};
+
+export { DropdownMenu as D, Menu as M, SheetMenu as S };
+//# sourceMappingURL=Menu-3c6e6068.js.map

package/es/Menu-3c6e6068.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu-3c6e6068.js","sources":["../../src/UNSAFE_Menu/useMenuCurrentKey.ts","../../src/UNSAFE_Menu/MenuContainer.tsx","../../src/UNSAFE_Menu/DropdownMenu.tsx","../../src/UNSAFE_Menu/useMenuSwipe.ts","../../src/UNSAFE_Menu/SheetMenu.tsx","../../src/UNSAFE_Menu/Menu.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { useCallback, useMemo } from 'preact/hooks';\n\nimport { MenuCollectionItem } from './menuUtils';\n\n/**\n * Hook for handling current key update due to user interaction including keyboard navigation.\n *\n * @param getPrev function to get the previous key based on the current key\n * @param getNext function to get the next key based on the current key\n * @param getFirstVisible function to get the key of the first available item\n * @param getLastVisible function to get the key of the last available item\n * @param onChange function to invoke if the current key has changed\n * @returns\n */\nexport function useMenuCurrentKey(\n  getPrev: () => string | null,\n  getNext: () => string | null,\n  getFirstVisible: () => string | null,\n  getLastVisible: () => string | null,\n  onChange?: (detail: MenuCollectionItem) => void\n) {\n  const keyDownKeyFunctions = useMemo(() => {\n    return {\n      ArrowDown: getNext,\n      ArrowUp: getPrev,\n      Home: getFirstVisible,\n      End: getLastVisible\n    } as Record<string, (() => string | null) | undefined>;\n  }, [getNext, getPrev, getFirstVisible, getLastVisible]);\n\n  const onKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (onChange) {\n        // TODO: support horizontal layout on icon menu (left/right arrow key)\n        const keyFunction = keyDownKeyFunctions[event.key];\n        if (keyFunction && !event.shiftKey) {\n          const key = keyFunction();\n          if (key) {\n            onChange({ key, reason: 'keyboard' });\n          }\n          event.preventDefault();\n        }\n      }\n    },\n    [onChange, keyDownKeyFunctions]\n  );\n\n  const currentKeyProps = onChange == null ? {} : { onKeyDown };\n  return { currentKeyProps };\n}\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useCallback, useEffect, useRef, useState } from 'preact/hooks';\n\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { useUser } from '../hooks/UNSAFE_useUser';\n\nimport { BaseMenuProps } from './Menu';\nimport { useMenuCurrentKey } from './useMenuCurrentKey';\nimport {\n  getPrevNext,\n  keyElemExtractor,\n  getLastVisible,\n  getKeyboardCloseProps,\n  getCloseSubmenuEvent,\n  MenuCollectionItem,\n  getNVisible,\n  getMenuContainerFocusMethods,\n  getMenuContainerMouseLeave,\n  getMenuPointerDown\n} from './menuUtils';\nimport { useMenuContext } from './useMenuContext';\nimport { MenuContainerContext } from './MenuContainerContext';\nimport { menuStyles } from './themes/MenuStyles.css';\n\ntype MenuContainerProps = Omit<\n  BaseMenuProps,\n  'isOpen' | 'anchorRef' | 'defaultPlacement' | 'offsetValue'\n> & {\n  display: 'sheet' | 'dropdown';\n};\n\n/*Component where general behavior is handled. Here we controled focus behavior, focus styling, submenu\nopening behavior and current active item behavior. */\nexport const MenuContainer = ({\n  children,\n  'aria-label': ariaLabel,\n  currentFocus = 'menu',\n  display,\n  closeSubmenu,\n  menuId,\n  menuLevel\n}: MenuContainerProps) => {\n  const { onClose } = useMenuContext();\n\n  //Important to know direction so closeSubmenu is handled properly if needed.\n  const { direction } = useUser();\n\n  const menuContainerRef = useRef<HTMLDivElement | null>(null);\n\n  /*We share same behavior as legacy menu on mouseLeave that is:\n  1. If we mouse leave a menuItem but we still on menuContainer and we are not hovering any other menuItem, we keep \n  the focus on the menuItem and hovering style.\n  2. If we mouseLeave but next target is a submenu we open a submenu. \n  3. If we mouseLeave the container and next target is not a submenu, we reset current key and set the focus on the\n  menuContainer.If we mouseLeaved a submenuItem, submenu is closed.\n  General information used by menuItems:\n  -wasMouseMoved: Used to don't allow mouseEnter callbacks being triggered if mouse was not moved already.\n  -lastMouseLeaveValidatedRelatedTarget: We use bubbling nature of events to first check/validate the related target in onMouseLeave events of \n    menuItems. For menuItems we check if the related target is the menuContainer itself or a submenu. We validate there\n    since at this level we don't have access to any submenu. Everytime mouseEnter triggers at menuContainer we have to compare if both\n    relatedTargets are the same(menuContainer and last menuItem one), if not, this means mouse is now outside of the container.\n  */\n  const menuContainerGeneralInformation = useRef<{\n    wasMouseMoved: boolean;\n    lastMouseLeaveMenuItemdRelatedTarget: HTMLElement | null;\n  }>({\n    wasMouseMoved: false,\n    lastMouseLeaveMenuItemdRelatedTarget: null\n  });\n  //Used so focus is handled just one time using currentFocus. Used combined with menuLevel due to main menu can't\n  // change its focus via currentFocus prop.\n  const initialFocusDone = useRef<boolean>(false);\n\n  //Key of the active element on this menu container\n  const [currentKey, setCurrentKey] = useState<string | undefined>();\n\n  //State that represents if focused outline styles needs\n  const [showFocusRing, setShowFocusRing] = useState(false);\n\n  //Based on this we would include or not hovering styling. Same as legacy\n  const [isContainerFocused, setIsContainerFocused] = useState(false);\n\n  //Funtion triggered on blur. This is called since if focus is not anymore on the container we would need to do\n  //some validation\n  const blurFunction = () => {\n    if (!menuContainerRef.current?.contains(document.activeElement)) {\n      setShowFocusRing(false);\n      setIsContainerFocused(false);\n    }\n  };\n\n  const focusFunction = () => {\n    setIsContainerFocused(true);\n  };\n\n  const mouseLeaveFunction = (e: MouseEvent) => {\n    //We have to validate if new hover target was already validated correctly, if not this means mouse is now outside container\n    if (\n      !(e.relatedTarget as HTMLElement).isEqualNode(\n        menuContainerGeneralInformation.current.lastMouseLeaveMenuItemdRelatedTarget\n      )\n    ) {\n      //We reset current key when mouse is outside the container or any submenu. This is how legacy menu works\n      changeKey({\n        key: undefined,\n        reason: 'mouseEnter'\n      });\n      //We focus menuContainer so keyboard navigation can be still used\n      menuContainerRef.current?.focus();\n    }\n  };\n\n  //Function used to change the currentKey\n  const changeKey = useCallback((detail: MenuCollectionItem) => {\n    setCurrentKey(detail.key);\n    if (detail.reason === 'keyboard') {\n      setShowFocusRing(true);\n    } else {\n      setShowFocusRing(false);\n    }\n  }, []);\n\n  //This is used since if mouse overlaps space when menu is rendered, menuItem could trigger menuEnter,\n  // which is not desirable.Once mouse was moved inside container, we could trigger mouseEnter events normally.\n  const selfDestructiveMouseMoveEvent = useCallback(() => {\n    const handler = (e: MouseEvent) => {\n      const keyElem = keyElemExtractor(e.target as HTMLElement);\n      const key = keyElem?.key;\n      const elem = keyElem?.elem;\n      //We will trigger this event until a menuItem is found. Usually this don't take to much to happen\n      if (key && elem) {\n        menuContainerGeneralInformation.current.wasMouseMoved = true;\n        const evt = new MouseEvent('mouseenter');\n        elem.dispatchEvent(evt);\n        menuContainerRef.current?.removeEventListener('mousemove', handler);\n      }\n    };\n    menuContainerRef.current?.addEventListener('mousemove', handler);\n  }, []);\n\n  const { currentKeyProps } = useMenuCurrentKey(\n    getPrevNext(menuContainerRef.current, true, currentKey),\n    getPrevNext(menuContainerRef.current, false, currentKey),\n    () => getNVisible(menuContainerRef.current, 0),\n    () => getLastVisible(menuContainerRef.current),\n    changeKey\n  );\n\n  useEffect(() => {\n    if (menuLevel === 'main' && initialFocusDone.current) return;\n    initialFocusDone.current = true;\n    const menuContainer = menuContainerRef.current;\n    let timer: NodeJS.Timeout | undefined;\n    /*TODO: There are some cases where is not safe to focus since \n    visibility initially is hidden at the Floating component at the initial render. Need a way to solve this in a \n    less dirty way (we are now using timeouts). More details on the descripton of JET-57353 */\n    if (currentFocus !== 'none' && menuContainer) {\n      if (currentFocus === 'menu') {\n        changeKey({ key: undefined, reason: 'click' });\n        const focusMenuContainer = () => {\n          menuContainer.focus();\n        };\n        if (display === 'sheet') {\n          focusMenuContainer();\n        } else {\n          // At this point floating has visibility set as hidden, so also menuContainer. Settimeout added so menuContainer\n          // is visible at that point and can be focused.\n          timer = setTimeout(() => {\n            focusMenuContainer();\n          }, FOCUS_SHIFT_TIMEOUT);\n        }\n      } else if (currentFocus === 'firstItem') {\n        const firstItem = getNVisible(menuContainerRef.current, 0);\n        if (firstItem) {\n          changeKey({ key: firstItem, reason: 'keyboard' });\n        }\n      } else if (currentFocus === 'secondItem') {\n        //This is just used in sheet menu, so no need to set a timeout\n        const item = getNVisible(menuContainerRef.current, 1);\n        if (item) {\n          changeKey({ key: item, reason: 'keyboard' });\n        }\n      }\n    }\n    return () => {\n      //We have to clean timers, because comp can be unmounted after finishing timeouts\n      clearTimeout(timer);\n    };\n  }, [changeKey, currentFocus, menuLevel, display]);\n\n  useEffect(() => {\n    selfDestructiveMouseMoveEvent();\n  }, [selfDestructiveMouseMoveEvent]);\n\n  return (\n    <div\n      {...(menuId && { id: menuId })}\n      ref={menuContainerRef}\n      tabIndex={!currentKey && (menuLevel === 'main' || display === 'sheet') ? 0 : -1}\n      role=\"menu\"\n      aria-label={ariaLabel}\n      class={classNames([\n        menuStyles.menuContainerStyle,\n        menuStyles[`${display}MenuContainerStyle`]\n      ])}\n      {...mergeProps(\n        currentKeyProps,\n        getKeyboardCloseProps(onClose, menuLevel),\n        getCloseSubmenuEvent(direction, closeSubmenu),\n        getMenuContainerFocusMethods(blurFunction, focusFunction),\n        getMenuContainerMouseLeave(mouseLeaveFunction),\n        getMenuPointerDown()\n      )}>\n      <MenuContainerContext.Provider\n        value={{\n          /*We use this ref on dropdownSubmenu since unhover only close the menu if menuContainer ref does not include\n          the new element that receives the hovering */\n          menuContainerRef,\n          currentKey,\n          showFocusRing,\n          changeKey,\n          menuContainerGeneralInformation,\n          isContainerFocused\n        }}>\n        {children}\n      </MenuContainerContext.Provider>\n    </div>\n  );\n};\n\n//Temporal constant, will probably be removed with JET-57353\nconst FOCUS_SHIFT_TIMEOUT = 0;\n","import { ComponentProps } from 'preact';\nimport { ForwardedRef, forwardRef, useCallback } from 'preact/compat';\n\nimport { Floating } from '../UNSAFE_Floating';\nimport { Layer } from '../UNSAFE_Layer';\n\nimport { MenuContainer } from './MenuContainer';\nimport { BaseMenuProps } from './Menu';\nimport { keyElemExtractor } from './menuUtils';\nimport { useMenuContext } from './useMenuContext';\nimport { dropdownMenuStyles } from './themes/DropdownMenuStyles.css';\n\ntype DropdownMenuProps = BaseMenuProps & DropdownMenuFloatingProps;\n\ntype FloatingProps = ComponentProps<typeof Floating>;\ntype DropdownMenuFloatingProps = {\n  defaultPlacement: FloatingProps['placement'];\n  offsetValue: FloatingProps['offsetValue'];\n  flipOptions: FloatingProps['flipOptions'];\n};\n\n/*Component used to render a dropdown menu. For now this is just rendered when device is not a phone. */\nexport const DropdownMenu = forwardRef(\n  (\n    {\n      anchorRef,\n      defaultPlacement,\n      offsetValue,\n      closeSubmenu,\n      children,\n      'aria-label': ariaLabel,\n      currentFocus,\n      menuId,\n      menuLevel,\n      flipOptions\n    }: DropdownMenuProps,\n    ref?: ForwardedRef<HTMLDivElement>\n  ) => {\n    const { onClose } = useMenuContext();\n\n    const useOutsideClickHandler = useCallback(\n      (e: MouseEvent) => {\n        if (menuLevel === 'sub') return;\n        // Outside click is not considered when menuItem was clicked\n        const menuItemKey = keyElemExtractor(e.target as HTMLElement)?.key;\n        if (!menuItemKey) {\n          onClose?.({ reason: 'outsideClick', target: e.target as Element });\n        }\n      },\n      [onClose, menuLevel]\n    );\n\n    // TODO - Reuse a dropdown component instead of creating floating by ourselves.\n    return (\n      <Layer logicalParentRef={anchorRef}>\n        <Floating\n          class={dropdownMenuStyles.base}\n          onClickOutside={useOutsideClickHandler}\n          anchorRef={anchorRef}\n          flipOptions={flipOptions}\n          shiftOptions={{\n            mainAxis: false,\n            crossAxis: false\n          }}\n          sizeOptions={{ isMaxHeightAdjusted: true, isMaxWidthAdjusted: true }}\n          //TODO: JET-57950. Need to see how we set 24px boundary.\n          //TODO: Boundaries need to match with the dropdowns used in other comps.  Also figure out how to make it themable.\n          boundaryOptions={{ padding: 0 }}\n          placement={defaultPlacement}\n          offsetValue={offsetValue}>\n          <div\n            style={{\n              minWidth: `${\n                anchorRef.current && anchorRef.current.offsetWidth > MENU_MIN_WIDTH\n                  ? anchorRef.current.offsetWidth\n                  : MENU_MIN_WIDTH\n              }px`\n            }}\n            ref={ref}>\n            <MenuContainer\n              menuLevel={menuLevel}\n              closeSubmenu={closeSubmenu}\n              aria-label={ariaLabel}\n              currentFocus={currentFocus}\n              menuId={menuId}\n              display=\"dropdown\">\n              {children}\n            </MenuContainer>\n          </div>\n        </Floating>\n      </Layer>\n    );\n  }\n);\n\nconst MENU_MIN_WIDTH = 200;\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useRef, useCallback } from 'preact/hooks';\n\n/*\n  threshold: Minimal threshold required before recognizing\n  tolerance: A tolerance value which allows the user to move their finger about a length measured in pixels.\n  This allows the swipe gesture to be triggered more easily since a User might not move their finger\n  in a straight line.\n*/\ntype SwipeOptions = {\n  threshold?: number;\n  maximumTime?: number;\n  tolerance?: number;\n  isDisabled?: boolean;\n};\n\ntype SwipeInfo = {\n  direction: 'down';\n};\n\ntype SwipeState = {\n  pointerDownId: number | null;\n  startTime: number | null;\n  prevpageX: number;\n  prevpageY: number;\n  elementScrollTop: number;\n};\n/*This \"private\" hook will live until we end up stating a final decision on useSwipe hook.\nFor that hook to work, element that use it has to set touch-action:none;, since pointer events\nare canceled once a touch action is going to be handled by the browser. This works for most\nof the components that don't scroll. But if the component scroll, there is a need for the browser to \nhandle scroll which is imposible with a hook just using pointer events.\n*/\nexport function useMenuSwipe(\n  onSwipe: (e: SwipeInfo) => void,\n  { threshold = 10, maximumTime = 300, tolerance = 50, isDisabled = false }: SwipeOptions = {\n    threshold: 10,\n    maximumTime: 300,\n    tolerance: 50,\n    isDisabled: false\n  }\n): { swipeProps: Record<string, any> } {\n  const ref = useRef<SwipeState>({\n    pointerDownId: 0,\n    startTime: null,\n    prevpageX: 0,\n    prevpageY: 0,\n    elementScrollTop: 0\n  });\n\n  const clearSwipe = useCallback(() => {\n    ref.current = {\n      pointerDownId: null,\n      startTime: 0,\n      prevpageX: 0,\n      prevpageY: 0,\n      elementScrollTop: 0\n    };\n  }, []);\n\n  const onTouchStart = useCallback(\n    (e: TouchEvent) => {\n      const touchobj = e.changedTouches[0];\n      if (!ref.current.pointerDownId) {\n        ref.current = {\n          pointerDownId: touchobj.identifier,\n          startTime: e.timeStamp,\n          prevpageX: touchobj.pageX,\n          prevpageY: touchobj.pageY,\n          elementScrollTop: (e.currentTarget as HTMLElement).scrollTop\n        };\n      } else {\n        clearSwipe();\n      }\n    },\n    [clearSwipe]\n  );\n\n  const onTouchEnd = useCallback(\n    (ev: TouchEvent) => {\n      const touchobj = ev.changedTouches[0];\n      if (touchobj.identifier === ref.current.pointerDownId) {\n        if (ref.current.startTime && ev.timeStamp - ref.current.startTime < maximumTime) {\n          if (\n            touchobj.pageY - ref.current.prevpageY > threshold &&\n            Math.abs(touchobj.pageX - ref.current.prevpageX) <= tolerance &&\n            ref.current.elementScrollTop === 0\n          ) {\n            onSwipe?.({ direction: 'down' });\n          }\n        }\n      }\n      // state would be reset to its original state whether swipe is completed or cancelled\n      clearSwipe();\n    },\n    [threshold, onSwipe, clearSwipe, maximumTime, tolerance]\n  );\n\n  const swipeProps = isDisabled\n    ? {}\n    : {\n        /** event handlers to spread on the target element. */\n        onTouchStart,\n        onTouchEnd,\n        ontouchcancel: clearSwipe\n      };\n\n  return {\n    swipeProps\n  };\n}\n","import { forwardRef } from 'preact/compat';\nimport { useCallback, useEffect } from 'preact/hooks';\n\nimport { useMenuSwipe } from './useMenuSwipe';\nimport useModal from '../UNSAFE_Modal/hooks/useModal';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\nimport { Layer } from '../UNSAFE_Layer';\nimport { classNames } from '../utils/UNSAFE_classNames';\n\nimport { BaseMenuProps } from './Menu';\nimport { useMenuContext } from './useMenuContext';\nimport { MenuContainer } from './MenuContainer';\nimport { sheetMenuStyles } from './themes/SheetMenuStyles.css';\n\ntype IntrinsicProps = Pick<HTMLAttributesSignalExcluded<HTMLDivElement>, 'children'>;\n\nexport type SheetMenuProps = BaseMenuProps;\n\nconst ModalWrapper = ({ children }: IntrinsicProps) => (\n  <div class={sheetMenuStyles.modalWrapper}>{children}</div>\n);\nconst ModalContainer = forwardRef<HTMLDivElement, IntrinsicProps>(({ children }, ref) => (\n  <div class={sheetMenuStyles.modalContainer} ref={ref}>\n    {children}\n  </div>\n));\n//ModalBackdrop on modal folder not setting the style on oj-c enviroment\n//Creating it here so we don't see that issue\nconst ModalBackdrop = ({ backdropVisible = false }) => (\n  <div\n    class={classNames([\n      sheetMenuStyles.modalBackdrop,\n      backdropVisible && sheetMenuStyles.modalBackdropVisible\n    ])}\n  />\n);\n\nexport const SheetMenu = ({\n  children,\n  'aria-label': ariaLabel,\n  currentFocus,\n  anchorRef,\n  closeSubmenu,\n  menuLevel\n}: SheetMenuProps) => {\n  const { onClose } = useMenuContext();\n  useEffect(() => {\n    // We set the overflow body as hidden when mounted and revert to original overflow value when is\n    // unmounted. This is done to don't allow backgound being scrolled\n    // This will be handled by modal/popup when ready\n    const initialOverflow = document.body.style.overflow;\n    document.body.style.overflow = 'hidden';\n    return () => {\n      document.body.style.overflow = initialOverflow;\n    };\n  }, []);\n\n  const dismissHandler = useCallback(() => {\n    onClose?.({ reason: 'dismissed' });\n  }, [onClose]);\n\n  const { backdropRef } = useModal({ isOpen: true, onBackdropClick: dismissHandler });\n  //TODO: Use useSwipe when it works on components that could scroll.\n  const { swipeProps } = useMenuSwipe(dismissHandler);\n\n  // TODO: For now we are mimicking current modal but using a \"different position setting\" (using absolute positioning instead of flex).\n  // Have to use modal/popup component directly instead doing this composition when that component could satisfy our requirments.\n  return (\n    <Layer logicalParentRef={anchorRef}>\n      <ModalWrapper>\n        <ModalBackdrop backdropVisible={menuLevel === 'main'}></ModalBackdrop>\n        <ModalContainer ref={backdropRef}>\n          <div class={sheetMenuStyles.sheetMenuContainerWrapper} {...swipeProps}>\n            <MenuContainer\n              {...{ ariaLabel, currentFocus, display: 'sheet', closeSubmenu, menuLevel }}>\n              {children}\n            </MenuContainer>\n          </div>\n        </ModalContainer>\n      </ModalWrapper>\n    </Layer>\n  );\n};\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { RefObject, ComponentChildren } from 'preact';\n\nimport { DropdownMenu } from './DropdownMenu';\nimport { SheetMenu } from './SheetMenu';\nimport { MenuContext } from './MenuContext';\nimport { getIsMobile } from './menuUtils';\n\ntype MenuProps = {\n  /**\n   * Trigger element reference\n   */\n  anchorRef: RefObject<HTMLElement>;\n  /**\n   * Set of menu groups or menu items that menu will hold.Even though you could pass other type of children,\n   * is strongly recommended to use MenuItem, menu groups or components that return this type of components\n   * since passing other type of components children produces not desirable behaviors.\n   */\n  children: ComponentChildren;\n  /**\n   * Specifies if menu is opened.\n   */\n  isOpen?: boolean;\n  /**\n   * Property that triggers a callback when menu is supposed to be closed.\n   */\n  onClose?: (detail: CloseDetail) => void;\n  /**\n   * Specifies some screen reader text. Set it to create an accesible menu.\n   */\n  'aria-label'?: string;\n  /**\n   *  Determines focus behavior when the menu is opened.\n   */\n  initialFocus?: 'menu' | 'firstItem';\n};\n\ntype CloseDetail =\n  | {\n      //dismissed represents dismissing the menu using esc,tap and on mobile swiping and taping backdrop\n      reason: 'dismissed' | 'itemAction';\n    }\n  | {\n      reason: 'outsideClick';\n      target: Element;\n    };\n\n// Type only used internally by Sheet and Dropdown menu. If we want to expose both at some point we would need to\n// adjust this type.\nexport type BaseMenuProps = (MainMenu | SubMenu) &\n  Omit<MenuProps, 'onClose' | 'initialFocus' | 'isOpen'> & {\n    /*None is a valid option here since there are some use cases where a menu is opened and we don't want to focus anything\n    eg. When menu is opened due to a hover on submenuitem\n    When pasing a number, that is index of the element is going to be focused\n    eg. 1 focus the second menuitem*/\n    currentFocus?: 'menu' | 'firstItem' | 'secondItem' | 'none';\n  };\n\ntype MainMenu = {\n  menuLevel: 'main';\n  menuId?: never;\n  closeSubmenu?: never;\n};\n\ntype SubMenu = {\n  menuLevel: 'sub';\n  menuId?: string;\n  closeSubmenu?: () => void;\n};\nconst isMobile = getIsMobile();\n\n/* Component that is exposed to final user to create a menu. Important to notice that this component is just used by\nthe final user to express a main menu. It's not reused by us for submenus (we use SheetMenu and DropdownMenu directly there) */\n\nexport const Menu = ({ onClose, isOpen, initialFocus, ...menuProps }: MenuProps) => {\n  //On close is consumed by the whole menu structure including the main menu and submenu ones.\n  return (\n    <MenuContext.Provider value={{ onClose, isMobile }}>\n      {!isOpen ? null : (\n        <>\n          {isMobile ? (\n            <SheetMenu\n              {...{\n                ...menuProps,\n                currentFocus: initialFocus,\n                menuLevel: 'main'\n              }}></SheetMenu>\n          ) : (\n            <DropdownMenu\n              {...{\n                ...menuProps,\n                currentFocus: initialFocus,\n                menuLevel: 'main',\n                defaultPlacement: 'bottom-start',\n                offsetValue: {\n                  mainAxis: 4, //TODO: stable does not have a 4px gap, so we'll need to figure out how to make this themable.\n                  crossAxis: 0\n                },\n                flipOptions: {\n                  crossAxis: true,\n                  mainAxis: true,\n                  fallbackPlacements: [\n                    'bottom-end',\n                    'top-start',\n                    'top-end',\n                    'end-top',\n                    'start-top',\n                    'end-bottom',\n                    'start-bottom'\n                  ]\n                }\n              }}></DropdownMenu>\n          )}\n        </>\n      )}\n    </MenuContext.Provider>\n  );\n};\n"],"names":["_jsx","useCallback","_jsxs","_Fragment"],"mappings":"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"}

package/es/MenuButton-fa83ee09.js

@@ -0,0 +1,42 @@
+/* @oracle/oraclejet-preact: 15.1.3 */
+import { jsx, jsxs } from 'preact/jsx-runtime';
+import './UNSAFE_ButtonLayout.js';
+import './PRIVATE_ThemedIcons/ChevronDownIcon.js';
+import './UNSAFE_Menu.js';
+import { useMenuAction } from './hooks/UNSAFE_useMenuAction.js';
+import './UNSAFE_BaseButton.js';
+import { mergeProps } from './utils/UNSAFE_mergeProps.js';
+import { Fragment } from 'preact';
+import { forwardRef } from 'preact/compat';
+import { useRef, useImperativeHandle } from 'preact/hooks';
+import { B as BaseButton } from './BaseButton-cad1ad64.js';
+import { B as ButtonLayout } from './ButtonLayout-67cf706d.js';
+import { S as SvgChevronDown } from './index-7e62fa17.js';
+import { M as Menu } from './Menu-3c6e6068.js';
+
+/**
+ * A MenuButton is a combined action and menu button.
+ */
+const MenuButton = forwardRef(({ children, label, suffix, variant = 'outlined', isDisabled = false, isMenuOpen = false, onToggleMenu, size = 'md', width, icon, 'aria-describedby': ariaDescribedBy, onBlur, onFocus, onMouseEnter, onMouseLeave, onTouchEnd, onTouchStart }, ref) => {
+    const buttonRef = useRef(null);
+    useImperativeHandle(ref, () => buttonRef.current, [buttonRef]);
+    const { triggerProps, menuProps } = useMenuAction({
+        isDisabled: isDisabled,
+        onToggleMenu: onToggleMenu,
+        isMenuOpen: isMenuOpen,
+        anchorRef: buttonRef
+    });
+    const globalEventProps = {
+        onBlur,
+        onFocus,
+        onMouseEnter,
+        onMouseLeave,
+        onTouchEnd,
+        onTouchStart
+    };
+    const rootButton = (jsx(BaseButton, { ...mergeProps(triggerProps, globalEventProps), styling: isMenuOpen ? ['min', 'active'] : ['min'], isDisabled: isDisabled, variant: variant, width: width, size: size, ref: buttonRef, "aria-label": `${label} ${suffix}`, "aria-describedby": ariaDescribedBy, children: jsx(ButtonLayout, { display: 'all', suffix: suffix, startIcon: icon, endIcon: jsx(SvgChevronDown, {}), size: size, children: label }) }));
+    return isDisabled ? (rootButton) : (jsxs(Fragment, { children: [rootButton, jsx(Menu, { ...menuProps, children: children })] }));
+});
+
+export { MenuButton as M };
+//# sourceMappingURL=MenuButton-fa83ee09.js.map

package/es/MenuButton-fa83ee09.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuButton-fa83ee09.js","sources":["../../src/UNSAFE_MenuButton/MenuButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ButtonLayout } from '../UNSAFE_ButtonLayout';\nimport { ChevronDownIcon } from '../PRIVATE_ThemedIcons/ChevronDownIcon';\nimport { Menu } from '../UNSAFE_Menu';\nimport { useMenuAction, MenuToggleDetail } from '../hooks/UNSAFE_useMenuAction';\nimport { BaseButton } from '../UNSAFE_BaseButton';\n\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\n\nimport { ComponentChildren, ComponentChild, Fragment } from 'preact';\nimport { forwardRef, ForwardedRef } from 'preact/compat';\nimport { useRef, useImperativeHandle } from 'preact/hooks';\n\ntype IntrinsicProps = Pick<\n  HTMLAttributesSignalExcluded<HTMLElement>,\n  | 'autofocus'\n  | 'onBlur'\n  | 'onFocus'\n  | 'onMouseEnter'\n  | 'onMouseLeave'\n  | 'onTouchEnd'\n  | 'onTouchStart'\n>;\n\ntype WidthInterpolationProps = Pick<DimensionProps, 'width'>;\n\nexport type Props = IntrinsicProps &\n  WidthInterpolationProps & {\n    /**\n     * children - One or more MenuItems, dividers, or Menu groups\n     */\n    children?: ComponentChildren;\n\n    /**\n     * The icon shown to the left of the label (or to the right of the\n     * label in right to left mode). Note that this is not the menu\n     * expand icon shown to the right of the label (or to the left of\n     * the label in right to left mode).\n     */\n    icon?: ComponentChild;\n\n    /**\n     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * The button label\n     */\n    label?: string;\n\n    /**\n     * Specifies if the menu is open\n     */\n    isMenuOpen?: boolean;\n\n    /**\n     * Property that triggers a callback immediately when toggle happens and value of expanded property should be updated\n     */\n    onToggleMenu?: (details: MenuToggleDetail) => void;\n\n    /**\n     * A suffix to the label that can be rendered differently.  Used to identify\n     * which child MenuItem is invoked.\n     */\n    suffix?: string;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"borderless\"': \"Borderless buttons are a more prominent variation. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n     *  most important actions in the UI.\"\n     */\n    variant?: 'borderless' | 'outlined' | 'solid';\n\n    /**\n     * The size indicates how large the button is rendered: \"sm\", \"md\" (default), \"lg\".\n     */\n    size?: 'sm' | 'md' | 'lg';\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the button.\n     */\n    'aria-describedby'?: string;\n  };\n\n/**\n * A MenuButton is a combined action and menu button.\n */\nexport const MenuButton = forwardRef(\n  (\n    {\n      children,\n      label,\n      suffix,\n      variant = 'outlined',\n      isDisabled = false,\n      isMenuOpen = false,\n      onToggleMenu,\n      size = 'md',\n      width,\n      icon,\n      'aria-describedby': ariaDescribedBy,\n      onBlur,\n      onFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onTouchEnd,\n      onTouchStart\n    }: Props,\n    ref?: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    useImperativeHandle(ref!, () => buttonRef.current!, [buttonRef]);\n\n    const { triggerProps, menuProps } = useMenuAction({\n      isDisabled: isDisabled,\n      onToggleMenu: onToggleMenu,\n      isMenuOpen: isMenuOpen,\n      anchorRef: buttonRef\n    });\n\n    const globalEventProps = {\n      onBlur,\n      onFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onTouchEnd,\n      onTouchStart\n    };\n\n    const rootButton = (\n      <BaseButton\n        {...mergeProps(triggerProps, globalEventProps)}\n        styling={isMenuOpen ? ['min', 'active'] : ['min']}\n        isDisabled={isDisabled}\n        variant={variant}\n        width={width}\n        size={size}\n        ref={buttonRef}\n        aria-label={`${label} ${suffix}`}\n        aria-describedby={ariaDescribedBy}>\n        <ButtonLayout\n          display={'all'}\n          suffix={suffix}\n          startIcon={icon}\n          endIcon={<ChevronDownIcon />}\n          size={size}>\n          {label}\n        </ButtonLayout>\n      </BaseButton>\n    );\n\n    return isDisabled ? (\n      rootButton\n    ) : (\n      <Fragment>\n        {rootButton}\n        <Menu {...menuProps}>{children}</Menu>\n      </Fragment>\n    );\n  }\n);\n"],"names":["_jsx","ChevronDownIcon","_jsxs"],"mappings":";;;;;;;;;;;;;;;;AAkGA;;AAEG;AACU,MAAA,UAAU,GAAG,UAAU,CAClC,CACE,EACE,QAAQ,EACR,KAAK,EACL,MAAM,EACN,OAAO,GAAG,UAAU,EACpB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,YAAY,EACZ,IAAI,GAAG,IAAI,EACX,KAAK,EACL,IAAI,EACJ,kBAAkB,EAAE,eAAe,EACnC,MAAM,EACN,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,YAAY,EACN,EACR,GAAqC,KACnC;AACF,IAAA,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;AAClD,IAAA,mBAAmB,CAAC,GAAI,EAAE,MAAM,SAAS,CAAC,OAAQ,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEjE,IAAA,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC;AAChD,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,YAAY,EAAE,YAAY;AAC1B,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,gBAAgB,GAAG;QACvB,MAAM;QACN,OAAO;QACP,YAAY;QACZ,YAAY;QACZ,UAAU;QACV,YAAY;KACb,CAAC;AAEF,IAAA,MAAM,UAAU,IACdA,IAAC,UAAU,EAAA,EAAA,GACL,UAAU,CAAC,YAAY,EAAE,gBAAgB,CAAC,EAC9C,OAAO,EAAE,UAAU,GAAG,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EACjD,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,SAAS,EACF,YAAA,EAAA,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA,MAAM,EAAE,EACd,kBAAA,EAAA,eAAe,YACjCA,GAAC,CAAA,YAAY,IACX,OAAO,EAAE,KAAK,EACd,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,IAAI,EACf,OAAO,EAAEA,GAAC,CAAAC,cAAe,KAAG,EAC5B,IAAI,EAAE,IAAI,EAAA,QAAA,EACT,KAAK,EACO,CAAA,EAAA,CACJ,CACd,CAAC;IAEF,OAAO,UAAU,IACf,UAAU,KAEVC,IAAA,CAAC,QAAQ,EACN,EAAA,QAAA,EAAA,CAAA,UAAU,EACXF,GAAA,CAAC,IAAI,EAAA,EAAA,GAAK,SAAS,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAQ,CAC7B,EAAA,CAAA,CACZ,CAAC;AACJ,CAAC;;;;"}

package/es/MenuDivider-9167510c.js

@@ -0,0 +1,14 @@
+/* @oracle/oraclejet-preact: 15.1.3 */
+import { jsx } from 'preact/jsx-runtime';
+import { useComponentTheme } from './hooks/UNSAFE_useComponentTheme.js';
+import './UNSAFE_Divider.js';
+import { MenuDividerRedwoodTheme } from './UNSAFE_Menu/themes/redwood/MenuDividerTheme.js';
+import { D as Divider } from './Divider-4810243f.js';
+
+function MenuDivider() {
+    const { classes } = useComponentTheme(MenuDividerRedwoodTheme);
+    return (jsx("div", { class: classes, children: jsx(Divider, {}) }));
+}
+
+export { MenuDivider as M };
+//# sourceMappingURL=MenuDivider-9167510c.js.map

package/es/MenuDivider-9167510c.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuDivider-9167510c.js","sources":["../../src/UNSAFE_Menu/MenuDivider.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { Divider } from '../UNSAFE_Divider';\nimport { MenuDividerRedwoodTheme } from './themes/redwood/MenuDividerTheme';\n\nexport function MenuDivider() {\n  const { classes } = useComponentTheme(MenuDividerRedwoodTheme);\n\n  return (\n    <div class={classes}>\n      <Divider />\n    </div>\n  );\n}\n"],"names":["_jsx"],"mappings":";;;;;;;SAYgB,WAAW,GAAA;IACzB,MAAM,EAAE,OAAO,EAAE,GAAG,iBAAiB,CAAC,uBAAuB,CAAC,CAAC;IAE/D,QACEA,GAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,OAAO,EACjB,QAAA,EAAAA,GAAA,CAAC,OAAO,EAAA,EAAA,CAAG,EACP,CAAA,EACN;AACJ;;;;"}