"use strict"; 'use client'; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = exports.MenuPaper = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose")); var React = _interopRequireWildcard(require("react")); var _reactIs = require("react-is"); var _propTypes = _interopRequireDefault(require("prop-types")); var _clsx = _interopRequireDefault(require("clsx")); var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses")); var _utils = require("@mui/base/utils"); var _HTMLElementType = _interopRequireDefault(require("@mui/utils/HTMLElementType")); var _RtlProvider = require("@mui/system/RtlProvider"); var _MenuList = _interopRequireDefault(require("../MenuList")); var _Popover = _interopRequireWildcard(require("../Popover")); var _styled = _interopRequireWildcard(require("../styles/styled")); var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps")); var _menuClasses = require("./menuClasses"); var _jsxRuntime = require("react/jsx-runtime"); const _excluded = ["onEntering"], _excluded2 = ["autoFocus", "children", "className", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant", "slots", "slotProps"]; function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } const RTL_ORIGIN = { vertical: 'top', horizontal: 'right' }; const LTR_ORIGIN = { vertical: 'top', horizontal: 'left' }; const useUtilityClasses = ownerState => { const { classes } = ownerState; const slots = { root: ['root'], paper: ['paper'], list: ['list'] }; return (0, _composeClasses.default)(slots, _menuClasses.getMenuUtilityClass, classes); }; const MenuRoot = (0, _styled.default)(_Popover.default, { shouldForwardProp: prop => (0, _styled.rootShouldForwardProp)(prop) || prop === 'classes', name: 'MuiMenu', slot: 'Root', overridesResolver: (props, styles) => styles.root })({}); const MenuPaper = exports.MenuPaper = (0, _styled.default)(_Popover.PopoverPaper, { name: 'MuiMenu', slot: 'Paper', overridesResolver: (props, styles) => styles.paper })({ // specZ: The maximum height of a simple menu should be one or more rows less than the view // height. This ensures a tappable area outside of the simple menu with which to dismiss // the menu. maxHeight: 'calc(100% - 96px)', // Add iOS momentum scrolling for iOS < 13.0 WebkitOverflowScrolling: 'touch' }); const MenuMenuList = (0, _styled.default)(_MenuList.default, { name: 'MuiMenu', slot: 'List', overridesResolver: (props, styles) => styles.list })({ // We disable the focus ring for mouse, touch and keyboard users. outline: 0 }); const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) { var _slots$paper, _slotProps$paper; const props = (0, _useThemeProps.default)({ props: inProps, name: 'MuiMenu' }); const { autoFocus = true, children, className, disableAutoFocusItem = false, MenuListProps = {}, onClose, open, PaperProps = {}, PopoverClasses, transitionDuration = 'auto', TransitionProps: { onEntering } = {}, variant = 'selectedMenu', slots = {}, slotProps = {} } = props, TransitionProps = (0, _objectWithoutPropertiesLoose2.default)(props.TransitionProps, _excluded), other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded2); const isRtl = (0, _RtlProvider.useRtl)(); const ownerState = (0, _extends2.default)({}, props, { autoFocus, disableAutoFocusItem, MenuListProps, onEntering, PaperProps, transitionDuration, TransitionProps, variant }); const classes = useUtilityClasses(ownerState); const autoFocusItem = autoFocus && !disableAutoFocusItem && open; const menuListActionsRef = React.useRef(null); const handleEntering = (element, isAppearing) => { if (menuListActionsRef.current) { menuListActionsRef.current.adjustStyleForScrollbar(element, { direction: isRtl ? 'rtl' : 'ltr' }); } if (onEntering) { onEntering(element, isAppearing); } }; const handleListKeyDown = event => { if (event.key === 'Tab') { event.preventDefault(); if (onClose) { onClose(event, 'tabKeyDown'); } } }; /** * the index of the item should receive focus * in a `variant="selectedMenu"` it's the first `selected` item * otherwise it's the very first item. */ let activeItemIndex = -1; // since we inject focus related props into children we have to do a lookahead // to check if there is a `selected` item. We're looking for the last `selected` // item and use the first valid item as a fallback React.Children.map(children, (child, index) => { if (! /*#__PURE__*/React.isValidElement(child)) { return; } if (process.env.NODE_ENV !== 'production') { if ((0, _reactIs.isFragment)(child)) { console.error(["MUI: The Menu component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n')); } } if (!child.props.disabled) { if (variant === 'selectedMenu' && child.props.selected) { activeItemIndex = index; } else if (activeItemIndex === -1) { activeItemIndex = index; } } }); const PaperSlot = (_slots$paper = slots.paper) != null ? _slots$paper : MenuPaper; const paperExternalSlotProps = (_slotProps$paper = slotProps.paper) != null ? _slotProps$paper : PaperProps; const rootSlotProps = (0, _utils.useSlotProps)({ elementType: slots.root, externalSlotProps: slotProps.root, ownerState, className: [classes.root, className] }); const paperSlotProps = (0, _utils.useSlotProps)({ elementType: PaperSlot, externalSlotProps: paperExternalSlotProps, ownerState, className: classes.paper }); return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuRoot, (0, _extends2.default)({ onClose: onClose, anchorOrigin: { vertical: 'bottom', horizontal: isRtl ? 'right' : 'left' }, transformOrigin: isRtl ? RTL_ORIGIN : LTR_ORIGIN, slots: { paper: PaperSlot, root: slots.root }, slotProps: { root: rootSlotProps, paper: paperSlotProps }, open: open, ref: ref, transitionDuration: transitionDuration, TransitionProps: (0, _extends2.default)({ onEntering: handleEntering }, TransitionProps), ownerState: ownerState }, other, { classes: PopoverClasses, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuMenuList, (0, _extends2.default)({ onKeyDown: handleListKeyDown, actions: menuListActionsRef, autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem), autoFocusItem: autoFocusItem, variant: variant }, MenuListProps, { className: (0, _clsx.default)(classes.list, MenuListProps.className), children: children })) })); }); process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ = { // ┌────────────────────────────── Warning ──────────────────────────────┐ // │ These PropTypes are generated from the TypeScript type definitions. │ // │ To update them, edit the d.ts file and run `pnpm proptypes`. │ // └─────────────────────────────────────────────────────────────────────┘ /** * An HTML element, or a function that returns one. * It's used to set the position of the menu. */ anchorEl: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOfType([_HTMLElementType.default, _propTypes.default.func]), /** * If `true` (Default) will focus the `[role="menu"]` if no focusable child is found. Disabled * children are not focusable. If you set this prop to `false` focus will be placed * on the parent modal container. This has severe accessibility implications * and should only be considered if you manage focus otherwise. * @default true */ autoFocus: _propTypes.default.bool, /** * Menu contents, normally `MenuItem`s. */ children: _propTypes.default.node, /** * Override or extend the styles applied to the component. */ classes: _propTypes.default.object, /** * @ignore */ className: _propTypes.default.string, /** * When opening the menu will not focus the active item but the `[role="menu"]` * unless `autoFocus` is also set to `false`. Not using the default means not * following WAI-ARIA authoring practices. Please be considerate about possible * accessibility implications. * @default false */ disableAutoFocusItem: _propTypes.default.bool, /** * Props applied to the [`MenuList`](/material-ui/api/menu-list/) element. * @default {} */ MenuListProps: _propTypes.default.object, /** * Callback fired when the component requests to be closed. * * @param {object} event The event source of the callback. * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`, `"tabKeyDown"`. */ onClose: _propTypes.default.func, /** * If `true`, the component is shown. */ open: _propTypes.default.bool.isRequired, /** * @ignore */ PaperProps: _propTypes.default.object, /** * `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element. */ PopoverClasses: _propTypes.default.object, /** * The extra props for the slot components. * You can override the existing props or add new ones. * * @default {} */ slotProps: _propTypes.default.shape({ paper: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]), root: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]) }), /** * The components used for each slot inside. * * @default {} */ slots: _propTypes.default.shape({ paper: _propTypes.default.elementType, root: _propTypes.default.elementType }), /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]), /** * The length of the transition in `ms`, or 'auto' * @default 'auto' */ transitionDuration: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.number, _propTypes.default.shape({ appear: _propTypes.default.number, enter: _propTypes.default.number, exit: _propTypes.default.number })]), /** * Props applied to the transition element. * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component. * @default {} */ TransitionProps: _propTypes.default.object, /** * The variant to use. Use `menu` to prevent selected items from impacting the initial focus. * @default 'selectedMenu' */ variant: _propTypes.default.oneOf(['menu', 'selectedMenu']) } : void 0; var _default = exports.default = Menu;