1 | import cx from 'classnames';
|
2 | import PropTypes from 'prop-types';
|
3 | import React, { Children } from 'react';
|
4 | import { BaseMenuItem } from '../MenuItem';
|
5 | import { preventInputBlur } from '../../utils';
|
6 | import { checkPropType, isRequiredForA11y } from '../../propTypes';
|
7 | const MenuDivider = () => React.createElement("div", { className: "dropdown-divider", role: "separator" });
|
8 | const MenuHeader = (props) => (React.createElement("div", { ...props, className: "dropdown-header", role: "heading" }));
|
9 | const propTypes = {
|
10 | 'aria-label': PropTypes.string,
|
11 | emptyLabel: PropTypes.node,
|
12 | id: checkPropType(PropTypes.oneOfType([PropTypes.number, PropTypes.string]), isRequiredForA11y),
|
13 | maxHeight: PropTypes.string,
|
14 | };
|
15 | const defaultProps = {
|
16 | 'aria-label': 'menu-options',
|
17 | };
|
18 | const Menu = ({ emptyLabel = 'No matches found.', innerRef, maxHeight = '300px', style, ...props }) => {
|
19 | const children = Children.count(props.children) === 0 ? (React.createElement(BaseMenuItem, { disabled: true, role: "option" }, emptyLabel)) : (props.children);
|
20 | return (React.createElement("div", { ...props, className: cx('rbt-menu', 'dropdown-menu', 'show', props.className), onMouseDown: preventInputBlur, ref: innerRef, role: "listbox", style: {
|
21 | ...style,
|
22 | display: 'block',
|
23 | maxHeight,
|
24 | overflow: 'auto',
|
25 | } }, children));
|
26 | };
|
27 | Menu.propTypes = propTypes;
|
28 | Menu.defaultProps = defaultProps;
|
29 | Menu.Divider = MenuDivider;
|
30 | Menu.Header = MenuHeader;
|
31 | export default Menu;
|