@carbon/react 0.17.0 → 1.0.1

package/es/components/ListBox/next/ListBoxSelection.js

@@ -0,0 +1,155 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import cx from 'classnames';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { Close } from '@carbon/icons-react';
+import { usePrefix } from '../../../internal/usePrefix.js';
+import { match } from '../../../internal/keyboard/match.js';
+import { Enter } from '../../../internal/keyboard/keys.js';
+
+var _Close, _Close2, _defaultTranslations;
+
+var _excluded = ["clearSelection", "selectionCount", "translateWithId", "disabled", "onClearSelection"];
+/**
+ * `ListBoxSelection` is used to provide controls for clearing a selection, in
+ * addition to conditionally rendering a badge if the control has more than one
+ * selection.
+ */
+
+function ListBoxSelection(_ref) {
+  var _cx;
+
+  var clearSelection = _ref.clearSelection,
+      selectionCount = _ref.selectionCount,
+      t = _ref.translateWithId,
+      disabled = _ref.disabled,
+      onClearSelection = _ref.onClearSelection,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+  var className = cx("".concat(prefix, "--list-box__selection"), (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--tag--filter"), selectionCount), _defineProperty(_cx, "".concat(prefix, "--list-box__selection--multi"), selectionCount), _cx));
+  var description = selectionCount ? t('clear.all') : t('clear.selection');
+  var tagClasses = cx("".concat(prefix, "--tag"), "".concat(prefix, "--tag--filter"), "".concat(prefix, "--tag--high-contrast"), _defineProperty({}, "".concat(prefix, "--tag--disabled"), disabled));
+
+  function onClick(event) {
+    event.stopPropagation();
+
+    if (disabled) {
+      return;
+    }
+
+    clearSelection(event);
+
+    if (onClearSelection) {
+      onClearSelection(event);
+    }
+  }
+
+  function onKeyDown(event) {
+    event.stopPropagation();
+
+    if (disabled) {
+      return;
+    } // When a user hits ENTER, we'll clear the selection
+
+
+    if (match(event, Enter)) {
+      clearSelection(event);
+
+      if (onClearSelection) {
+        onClearSelection(event);
+      }
+    }
+  }
+
+  if (selectionCount) {
+    return /*#__PURE__*/React__default.createElement("div", {
+      className: tagClasses
+    }, /*#__PURE__*/React__default.createElement("span", {
+      className: "".concat(prefix, "--tag__label"),
+      title: selectionCount
+    }, selectionCount), /*#__PURE__*/React__default.createElement("button", {
+      "aria-label": description,
+      className: "".concat(prefix, "--tag__close-icon"),
+      disabled: disabled,
+      onClick: onClick,
+      onKeyDown: onKeyDown,
+      tabIndex: disabled ? -1 : 0,
+      title: description,
+      type: "button"
+    }, _Close || (_Close = /*#__PURE__*/React__default.createElement(Close, null))));
+  }
+
+  return /*#__PURE__*/React__default.createElement("button", _extends({}, rest, {
+    "aria-label": description,
+    className: className,
+    onClick: onClick,
+    onKeyDown: onKeyDown,
+    tabIndex: disabled ? -1 : 0,
+    title: description,
+    type: "button"
+  }), _Close2 || (_Close2 = /*#__PURE__*/React__default.createElement(Close, null)));
+}
+
+var translationIds = {
+  'clear.all': 'clear.all',
+  'clear.selection': 'clear.selection'
+};
+var defaultTranslations = (_defaultTranslations = {}, _defineProperty(_defaultTranslations, translationIds['clear.all'], 'Clear all selected items'), _defineProperty(_defaultTranslations, translationIds['clear.selection'], 'Clear selected item'), _defaultTranslations);
+ListBoxSelection.propTypes = {
+  /**
+   * Specify a function to be invoked when a user interacts with the clear
+   * selection element.
+   */
+  clearSelection: PropTypes.func.isRequired,
+
+  /**
+   * Specify whether or not the clear selection element should be disabled
+   */
+  disabled: PropTypes.bool,
+
+  /**
+   * Specify an optional `onClearSelection` handler that is called when the underlying
+   * element is cleared
+   */
+  onClearSelection: PropTypes.func,
+
+  /**
+   * Specify an optional `onClick` handler that is called when the underlying
+   * clear selection element is clicked
+   */
+  onClick: PropTypes.func,
+
+  /**
+   * Specify an optional `onKeyDown` handler that is called when the underlying
+   * clear selection element fires a keydown event
+   */
+  onKeyDown: PropTypes.func,
+
+  /**
+   * Specify an optional `selectionCount` value that will be used to determine
+   * whether the selection should display a badge or a single clear icon.
+   */
+  selectionCount: PropTypes.number,
+
+  /**
+   * i18n hook used to provide the appropriate description for the given menu
+   * icon. This function takes in an id defined in `translationIds` and should
+   * return a string message for that given message id.
+   */
+  translateWithId: PropTypes.func.isRequired
+};
+ListBoxSelection.defaultProps = {
+  translateWithId: function translateWithId(id) {
+    return defaultTranslations[id];
+  }
+};
+
+export { ListBoxSelection as default, translationIds };

package/es/components/ListBox/next/ListBoxTrigger.js

@@ -0,0 +1,68 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { defineProperty as _defineProperty, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import cx from 'classnames';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { ChevronDown } from '@carbon/icons-react';
+import { usePrefix } from '../../../internal/usePrefix.js';
+
+var _excluded = ["isOpen", "translateWithId"];
+
+var _defaultTranslations, _ChevronDown;
+var translationIds = {
+  'close.menu': 'close.menu',
+  'open.menu': 'open.menu'
+};
+var defaultTranslations = (_defaultTranslations = {}, _defineProperty(_defaultTranslations, translationIds['close.menu'], 'Close'), _defineProperty(_defaultTranslations, translationIds['open.menu'], 'Open'), _defaultTranslations);
+/**
+ * `ListBoxTrigger` is used to orient the icon up or down depending on the
+ * state of the menu for a given `ListBox`
+ */
+
+var ListBoxTrigger = function ListBoxTrigger(_ref) {
+  var _cx;
+
+  var isOpen = _ref.isOpen,
+      t = _ref.translateWithId,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+  var className = cx((_cx = {}, _defineProperty(_cx, "".concat(prefix, "--list-box__menu-icon"), true), _defineProperty(_cx, "".concat(prefix, "--list-box__menu-icon--open"), isOpen), _cx));
+  var description = isOpen ? t('close.menu') : t('open.menu');
+  return /*#__PURE__*/React__default.createElement("button", _extends({}, rest, {
+    "aria-label": description,
+    title: description,
+    className: className,
+    type: "button",
+    tabIndex: "-1"
+  }), _ChevronDown || (_ChevronDown = /*#__PURE__*/React__default.createElement(ChevronDown, null)));
+};
+
+ListBoxTrigger.propTypes = {
+  /**
+   * Specify whether the menu is currently open, which will influence the
+   * direction of the menu icon
+   */
+  isOpen: PropTypes.bool.isRequired,
+
+  /**
+   * i18n hook used to provide the appropriate description for the given menu
+   * icon. This function takes in an id defined in `translationIds` and should
+   * return a string message for that given message id.
+   */
+  translateWithId: PropTypes.func.isRequired
+};
+ListBoxTrigger.defaultProps = {
+  translateWithId: function translateWithId(id) {
+    return defaultTranslations[id];
+  }
+};
+var ListBoxTrigger$1 = ListBoxTrigger;
+
+export { ListBoxTrigger$1 as default, translationIds };

package/es/components/ListItem/ListItem.js

@@ -0,0 +1,41 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import PropTypes from 'prop-types';
+import React__default from 'react';
+import cx from 'classnames';
+import { usePrefix } from '../../internal/usePrefix.js';
+
+var _excluded = ["children", "className"];
+
+var ListItem = function ListItem(_ref) {
+  var children = _ref.children,
+      className = _ref.className,
+      other = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+  var classNames = cx("".concat(prefix, "--list__item"), className);
+  return /*#__PURE__*/React__default.createElement("li", _extends({
+    className: classNames
+  }, other), children);
+};
+
+ListItem.propTypes = {
+  /**
+   * Specify the content for the ListItem
+   */
+  children: PropTypes.node,
+
+  /**
+   * Specify an optional className to apply to the underlying `<li>` node
+   */
+  className: PropTypes.string
+};
+var ListItem$1 = ListItem;
+
+export { ListItem$1 as default };

package/es/components/Loading/Loading.js

@@ -0,0 +1,102 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React__default, { useRef } from 'react';
+import setupGetInstanceId from '../../tools/setupGetInstanceId.js';
+import { usePrefix } from '../../internal/usePrefix.js';
+
+var _excluded = ["id", "active", "className", "withOverlay", "small", "description"];
+var getInstanceId = setupGetInstanceId();
+
+function Loading(_ref) {
+  var _cx, _cx2;
+
+  var id = _ref.id,
+      active = _ref.active,
+      customClassName = _ref.className,
+      withOverlay = _ref.withOverlay,
+      small = _ref.small,
+      description = _ref.description,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix();
+
+  var _useRef = useRef(getInstanceId()),
+      instanceId = _useRef.current;
+
+  var loadingClassName = cx(customClassName, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--loading"), true), _defineProperty(_cx, "".concat(prefix, "--loading--small"), small), _defineProperty(_cx, "".concat(prefix, "--loading--stop"), !active), _cx));
+  var overlayClassName = cx((_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--loading-overlay"), true), _defineProperty(_cx2, "".concat(prefix, "--loading-overlay--stop"), !active), _cx2));
+  var loadingId = id || "loading-id-".concat(instanceId);
+  var loading = /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
+    "aria-atomic": "true",
+    "aria-labelledby": loadingId,
+    "aria-live": active ? 'assertive' : 'off',
+    className: loadingClassName
+  }), /*#__PURE__*/React__default.createElement("label", {
+    id: loadingId,
+    className: "".concat(prefix, "--visually-hidden")
+  }, description), /*#__PURE__*/React__default.createElement("svg", {
+    className: "".concat(prefix, "--loading__svg"),
+    viewBox: "0 0 100 100"
+  }, /*#__PURE__*/React__default.createElement("title", null, description), small ? /*#__PURE__*/React__default.createElement("circle", {
+    className: "".concat(prefix, "--loading__background"),
+    cx: "50%",
+    cy: "50%",
+    r: "44"
+  }) : null, /*#__PURE__*/React__default.createElement("circle", {
+    className: "".concat(prefix, "--loading__stroke"),
+    cx: "50%",
+    cy: "50%",
+    r: "44"
+  })));
+  return withOverlay ? /*#__PURE__*/React__default.createElement("div", {
+    className: overlayClassName
+  }, loading) : loading;
+}
+
+Loading.propTypes = {
+  /**
+   * Specify whether you want the loading indicator to be spinning or not
+   */
+  active: PropTypes.bool,
+
+  /**
+   * Provide an optional className to be applied to the containing node
+   */
+  className: PropTypes.string,
+
+  /**
+   * Specify a description that would be used to best describe the loading state
+   */
+  description: PropTypes.string,
+
+  /**
+   * Provide an `id` to uniquely identify the label
+   */
+  id: PropTypes.string,
+
+  /**
+   * Specify whether you would like the small variant of <Loading>
+   */
+  small: PropTypes.bool,
+
+  /**
+   * Specify whether you want the loader to be applied with an overlay
+   */
+  withOverlay: PropTypes.bool
+};
+Loading.defaultProps = {
+  active: true,
+  withOverlay: true,
+  small: false,
+  description: 'Active loading indicator'
+};
+
+export { Loading as default };

package/es/components/Menu/Menu.js

@@ -0,0 +1,328 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, objectSpread2 as _objectSpread2, typeof as _typeof } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default, { useRef, useState, useEffect } from 'react';
+import ReactDOM from 'react-dom';
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import { usePrefix } from '../../internal/usePrefix.js';
+import { getParentMenu, getNextNode, getParentNode, getValidNodes, clickedElementHasSubnodes, capWithinRange, getPosition, resetFocus, focusNode } from './_utils.js';
+import MenuGroup from './MenuGroup.js';
+import MenuRadioGroup from './MenuRadioGroup.js';
+import MenuRadioGroupOptions from './MenuRadioGroupOptions.js';
+import MenuSelectableItem from './MenuSelectableItem.js';
+import { match } from '../../internal/keyboard/match.js';
+import { Tab, Enter, Space, Escape, ArrowLeft, ArrowUp, ArrowDown } from '../../internal/keyboard/keys.js';
+
+var _excluded = ["children", "className", "id", "level", "open", "size", "target", "x", "y", "onClose"];
+var margin = 16; // distance to keep to body edges, in px
+
+var defaultSize = 'sm';
+
+var Menu = function Menu(_ref) {
+  var _classnames;
+
+  var children = _ref.children,
+      className = _ref.className,
+      id = _ref.id,
+      _ref$level = _ref.level,
+      level = _ref$level === void 0 ? 1 : _ref$level,
+      open = _ref.open,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? defaultSize : _ref$size,
+      _ref$target = _ref.target,
+      target = _ref$target === void 0 ? document.body : _ref$target,
+      _ref$x = _ref.x,
+      x = _ref$x === void 0 ? 0 : _ref$x,
+      _ref$y = _ref.y,
+      y = _ref$y === void 0 ? 0 : _ref$y,
+      _ref$onClose = _ref.onClose,
+      onClose = _ref$onClose === void 0 ? function () {} : _ref$onClose,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var rootRef = useRef(null);
+
+  var _useState = useState(1),
+      _useState2 = _slicedToArray(_useState, 2),
+      direction = _useState2[0],
+      setDirection = _useState2[1]; // 1 = to right, -1 = to left
+
+
+  var _useState3 = useState([x, y]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      position = _useState4[0],
+      setPosition = _useState4[1];
+
+  var isRootMenu = level === 1;
+  var focusReturn = useRef(null);
+  var prefix = usePrefix();
+
+  function returnFocus() {
+    if (focusReturn.current) {
+      focusReturn.current.focus();
+    }
+  }
+
+  function close(eventType) {
+    var isKeyboardEvent = /^key/.test(eventType);
+
+    if (isKeyboardEvent) {
+      window.addEventListener('keyup', returnFocus, {
+        once: true
+      });
+    } else {
+      window.addEventListener('mouseup', returnFocus, {
+        once: true
+      });
+    }
+
+    onClose();
+  }
+
+  function getContainerBoundaries() {
+    var _document$body = document.body,
+        bodyWidth = _document$body.clientWidth,
+        bodyHeight = _document$body.clientHeight;
+    return [margin, margin, bodyWidth - margin, bodyHeight - margin];
+  }
+
+  function getTargetBoundaries() {
+    var xIsRange = _typeof(x) === 'object' && x.length === 2;
+    var yIsRange = _typeof(y) === 'object' && y.length === 2;
+    var targetBoundaries = [xIsRange ? x[0] : x, yIsRange ? y[0] : y, xIsRange ? x[1] : x, yIsRange ? y[1] : y];
+
+    if (!isRootMenu) {
+      var _getParentMenu;
+
+      var _getParentMenu$getBou = (_getParentMenu = getParentMenu(rootRef.current)) === null || _getParentMenu === void 0 ? void 0 : _getParentMenu.getBoundingClientRect(),
+          parentWidth = _getParentMenu$getBou.width;
+
+      targetBoundaries[2] -= parentWidth;
+    }
+
+    var containerBoundaries = getContainerBoundaries();
+    return [capWithinRange(targetBoundaries[0], containerBoundaries[0], containerBoundaries[2]), capWithinRange(targetBoundaries[1], containerBoundaries[1], containerBoundaries[3]), capWithinRange(targetBoundaries[2], containerBoundaries[0], containerBoundaries[2]), capWithinRange(targetBoundaries[3], containerBoundaries[1], containerBoundaries[3])];
+  }
+
+  function focusNode$1(node) {
+    if (node) {
+      resetFocus(rootRef.current);
+      focusNode(node);
+    }
+  }
+
+  function handleKeyDown(event) {
+    if (match(event, Tab)) {
+      event.preventDefault();
+      close(event.type);
+    }
+
+    if (event.target.tagName === 'LI' && (match(event, Enter) || match(event, Space))) {
+      handleClick(event);
+    } else {
+      event.stopPropagation();
+    }
+
+    if (match(event, Escape) || !isRootMenu && match(event, ArrowLeft)) {
+      close(event.type);
+    }
+
+    var nodeToFocus;
+
+    if (event.target.tagName === 'LI') {
+      var currentNode = event.target;
+
+      if (match(event, ArrowUp)) {
+        nodeToFocus = getNextNode(currentNode, -1);
+      } else if (match(event, ArrowDown)) {
+        nodeToFocus = getNextNode(currentNode, 1);
+      } else if (match(event, ArrowLeft)) {
+        nodeToFocus = getParentNode(currentNode);
+      }
+    } else if (event.target.tagName === 'UL') {
+      var validNodes = getValidNodes(event.target);
+
+      if (validNodes.length > 0 && match(event, ArrowUp)) {
+        nodeToFocus = validNodes[validNodes.length - 1];
+      } else if (validNodes.length > 0 && match(event, ArrowDown)) {
+        nodeToFocus = validNodes[0];
+      }
+    }
+
+    focusNode$1(nodeToFocus);
+
+    if (rest.onKeyDown) {
+      rest.onKeyDown(event);
+    }
+  }
+
+  function handleClick(event) {
+    if (!clickedElementHasSubnodes(event) && event.target.tagName !== 'UL') {
+      close(event.type);
+    } else {
+      event.stopPropagation();
+    }
+  }
+
+  function getCorrectedPosition(preferredDirection) {
+    var _rootRef$current;
+
+    var elementRect = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.getBoundingClientRect();
+    var elementDimensions = [elementRect.width, elementRect.height];
+    var targetBoundaries = getTargetBoundaries();
+    var containerBoundaries = getContainerBoundaries();
+
+    var _getPosition = getPosition(elementDimensions, targetBoundaries, containerBoundaries, preferredDirection, isRootMenu, rootRef.current),
+        correctedPosition = _getPosition.position,
+        correctedDirection = _getPosition.direction;
+
+    setDirection(correctedDirection);
+    return correctedPosition;
+  }
+
+  function handleBlur(event) {
+    var _rootRef$current2;
+
+    if (isRootMenu && !((_rootRef$current2 = rootRef.current) !== null && _rootRef$current2 !== void 0 && _rootRef$current2.contains(event.relatedTarget))) {
+      close(event.type);
+    }
+  }
+
+  useEffect(function () {
+    if (open) {
+      focusReturn.current = document.activeElement;
+      var localDirection = 1;
+
+      if (isRootMenu) {
+        var _rootRef$current3;
+
+        (_rootRef$current3 = rootRef.current) === null || _rootRef$current3 === void 0 ? void 0 : _rootRef$current3.focus();
+      } else {
+        var parentMenu = getParentMenu(rootRef.current);
+
+        if (parentMenu) {
+          localDirection = Number(parentMenu.dataset.direction);
+        }
+      }
+
+      var correctedPosition = getCorrectedPosition(localDirection);
+      setPosition(correctedPosition);
+    } else {
+      setPosition([0, 0]);
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [open, x, y]);
+  var someNodesHaveIcons = React__default.Children.toArray(children).some(function (node) {
+    return node.type === MenuSelectableItem || node.type === MenuRadioGroup;
+  });
+  var options = React__default.Children.map(children, function (node) {
+    if ( /*#__PURE__*/React__default.isValidElement(node)) {
+      return /*#__PURE__*/React__default.cloneElement(node, {
+        indented: someNodesHaveIcons,
+        level: level
+      });
+    }
+  });
+  var classes = cx("".concat(prefix, "--menu"), (_classnames = {}, _defineProperty(_classnames, "".concat(prefix, "--menu--open"), open), _defineProperty(_classnames, "".concat(prefix, "--menu--invisible"), open && position[0] === 0 && position[1] === 0), _defineProperty(_classnames, "".concat(prefix, "--menu--root"), isRootMenu), _classnames), size !== defaultSize && "".concat(prefix, "--menu--").concat(size), className);
+
+  var ulAttributes = _objectSpread2(_objectSpread2({}, rest), {}, {
+    id: id,
+    ref: rootRef,
+    className: classes,
+    onKeyDown: handleKeyDown,
+    onClick: handleClick,
+    onBlur: handleBlur,
+    role: 'menu',
+    tabIndex: -1,
+    'data-direction': direction,
+    'data-level': level,
+    style: {
+      left: "".concat(position[0], "px"),
+      top: "".concat(position[1], "px")
+    }
+  });
+
+  var childrenToRender = options; // if the only child is a radiogroup, don't render it as radiogroup component, but
+  // only the items to prevent duplicate markup
+
+  if (options && options.length === 1 && options[0].type === MenuRadioGroup) {
+    var radioGroupProps = options[0].props;
+    ulAttributes['aria-label'] = radioGroupProps.label;
+    childrenToRender = /*#__PURE__*/React__default.createElement(MenuRadioGroupOptions, {
+      items: radioGroupProps.items,
+      initialSelectedItem: radioGroupProps.initialSelectedItem,
+      onChange: radioGroupProps.onChange
+    });
+  } // if the only child is a generic group, don't render it as group component, but
+  // only the children to prevent duplicate markup
+
+
+  if (options && options.length === 1 && options[0].type === MenuGroup) {
+    var groupProps = options[0].props;
+    ulAttributes['aria-label'] = groupProps.label;
+    childrenToRender = React__default.Children.toArray(options[0].props.children);
+  }
+
+  var menu = /*#__PURE__*/React__default.createElement("ul", ulAttributes, childrenToRender);
+  return isRootMenu ? open && /*#__PURE__*/ReactDOM.createPortal(menu, target) || null : menu;
+};
+
+Menu.propTypes = {
+  /**
+   * Specify the children of the Menu
+   */
+  children: PropTypes.node,
+
+  /**
+   * Specify a custom className to apply to the ul node
+   */
+  className: PropTypes.string,
+
+  /**
+   * Define an ID for this menu
+   */
+  id: PropTypes.string,
+
+  /**
+   * Internal: keeps track of the nesting level of the menu
+   */
+  level: PropTypes.number,
+
+  /**
+   * Function called when the menu is closed
+   */
+  onClose: PropTypes.func,
+
+  /**
+   * Specify whether the Menu is currently open
+   */
+  open: PropTypes.bool,
+
+  /**
+   * Specify the size of the menu, from a list of available sizes.
+   */
+  size: PropTypes.oneOf(['sm', 'md', 'lg']),
+
+  /**
+   * Optionally pass an element the Menu should be appended to as a child. Defaults to document.body.
+   */
+  target: PropTypes.element,
+
+  /**
+   * Specify the x position where this menu is rendered
+   */
+  x: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)]),
+
+  /**
+   * Specify the y position where this menu is rendered
+   */
+  y: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)])
+};
+var Menu$1 = Menu;
+
+export { Menu$1 as default };