@instructure/ui-menu 8.56.2-pr-snapshot-1721749364069 → 8.56.2

package/CHANGELOG.md

@@ -3,9 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [8.56.2-pr-snapshot-1721749364069](https://github.com/instructure/instructure-ui/compare/v8.56.1...v8.56.2-pr-snapshot-1721749364069) (2024-07-23)
+## [8.56.2](https://github.com/instructure/instructure-ui/compare/v8.56.1...v8.56.2) (2024-08-06)
 
-**Note:** Version bump only for package @instructure/ui-menu
+
+### Bug Fixes
+
+* **ui-menu:** menuItem's onSelect type did not expose its value and selected types ([98ca20e](https://github.com/instructure/instructure-ui/commit/98ca20e215808283b891b13a47b2bb54e12967e2))
 
 
 

package/lib/Menu/MenuItem/index.js

@@ -8,11 +8,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.MenuItem = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _keycode = _interopRequireDefault(require("keycode"));
-var _uiIcons = require("@instructure/ui-icons");
-var _uiReactUtils = require("@instructure/ui-react-utils");
-var _uiUtils = require("@instructure/ui-utils");
-var _uiDomUtils = require("@instructure/ui-dom-utils");
-var _uiTestable = require("@instructure/ui-testable");
+var _IconCheckSolid2 = require("@instructure/ui-icons/lib/IconCheckSolid.js");
+var _IconArrowOpenEndSolid = require("@instructure/ui-icons/lib/IconArrowOpenEndSolid.js");
+var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
+var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
+var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
+var _createChainedFunction = require("@instructure/ui-utils/lib/createChainedFunction.js");
+var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
+var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
+var _testable = require("@instructure/ui-testable/lib/testable.js");
 var _emotion = require("@instructure/emotion");
 var _MenuContext = require("../../MenuContext");
 var _styles = _interopRequireDefault(require("./styles"));
@@ -49,7 +53,7 @@ parent: Menu
 id: Menu.Item
 ---
 **/
-let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class MenuItem extends _react.Component {
+let MenuItem = exports.MenuItem = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _testable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class MenuItem extends _react.Component {
   constructor(props) {
     super(props);
     this.labelId = void 0;
@@ -89,7 +93,7 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
         e.stopPropagation();
         if (enterKey) {
           // handle space key on keyUp for FF
-          const refNode = (0, _uiDomUtils.findDOMNode)(this.ref);
+          const refNode = (0, _findDOMNode.findDOMNode)(this.ref);
           refNode.click();
         }
       }
@@ -101,7 +105,7 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
         e.preventDefault();
         e.stopPropagation();
         if (spaceKey) {
-          const refNode = (0, _uiDomUtils.findDOMNode)(this.ref);
+          const refNode = (0, _findDOMNode.findDOMNode)(this.ref);
           refNode.click();
         }
       }
@@ -141,7 +145,7 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
     }
   }
   get elementType() {
-    return (0, _uiReactUtils.getElementType)(MenuItem, this.props);
+    return (0, _getElementType.getElementType)(MenuItem, this.props);
   }
   get role() {
     switch (this.props.type) {
@@ -159,10 +163,10 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
     return typeof this.props.selected === 'undefined' ? this.state.selected : this.props.selected;
   }
   get focused() {
-    return (0, _uiDomUtils.isActiveElement)(this.ref);
+    return (0, _isActiveElement.isActiveElement)(this.ref);
   }
   focus() {
-    const refNode = (0, _uiDomUtils.findDOMNode)(this.ref);
+    const refNode = (0, _findDOMNode.findDOMNode)(this.ref);
     refNode.focus();
   }
   renderContent() {
@@ -172,12 +176,12 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
       type = _this$props4.type;
     return (0, _emotion.jsx)("span", null, (type === 'checkbox' || type === 'radio') && (0, _emotion.jsx)("span", {
       css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.icon
-    }, this.selected && (_IconCheckSolid || (_IconCheckSolid = (0, _emotion.jsx)(_uiIcons.IconCheckSolid, null)))), (0, _emotion.jsx)("span", {
+    }, this.selected && (_IconCheckSolid || (_IconCheckSolid = (0, _emotion.jsx)(_IconCheckSolid2.IconCheckSolid, null)))), (0, _emotion.jsx)("span", {
       css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.label,
       id: this.labelId
     }, children), type === 'flyout' && (0, _emotion.jsx)("span", {
       css: (_this$props$styles3 = this.props.styles) === null || _this$props$styles3 === void 0 ? void 0 : _this$props$styles3.icon
-    }, _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = (0, _emotion.jsx)(_uiIcons.IconArrowOpenEndSolid, null))));
+    }, _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = (0, _emotion.jsx)(_IconArrowOpenEndSolid.IconArrowOpenEndSolid, null))));
   }
   render() {
     var _this$props$styles4;
@@ -188,7 +192,7 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
       onKeyUp = _this$props5.onKeyUp,
       type = _this$props5.type,
       href = _this$props5.href;
-    const props = (0, _uiReactUtils.omitProps)(this.props, MenuItem.allowedProps);
+    const props = (0, _omitProps.omitProps)(this.props, MenuItem.allowedProps);
     const ElementType = this.elementType;
     return (0, _emotion.jsx)(ElementType, Object.assign({
       tabIndex: -1 // note: tabIndex can be overridden by Menu or MenuItemGroup components
@@ -200,8 +204,8 @@ let MenuItem = exports.MenuItem = (_dec = (0, _uiReactUtils.withDeterministicId)
       "aria-controls": controls,
       "aria-checked": type === 'checkbox' || type === 'radio' ? this.selected ? 'true' : 'false' : void 0,
       onClick: this.handleClick,
-      onKeyUp: (0, _uiUtils.createChainedFunction)(onKeyUp, this.handleKeyUp),
-      onKeyDown: (0, _uiUtils.createChainedFunction)(onKeyDown, this.handleKeyDown),
+      onKeyUp: (0, _createChainedFunction.createChainedFunction)(onKeyUp, this.handleKeyUp),
+      onKeyDown: (0, _createChainedFunction.createChainedFunction)(onKeyDown, this.handleKeyDown),
       ref: this.handleRef,
       css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.menuItem,
       onMouseOver: this.handleMouseOver

package/lib/Menu/MenuItem/props.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propTypes = exports.allowedProps = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _uiPropTypes = require("@instructure/ui-prop-types");
+var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
 /*
  * The MIT License (MIT)
  *
@@ -34,7 +34,7 @@ var _uiPropTypes = require("@instructure/ui-prop-types");
 const propTypes = exports.propTypes = {
   children: _propTypes.default.node.isRequired,
   defaultSelected: _propTypes.default.bool,
-  selected: (0, _uiPropTypes.controllable)(_propTypes.default.bool, 'onSelect', 'defaultSelected'),
+  selected: (0, _controllable.controllable)(_propTypes.default.bool, 'onSelect', 'defaultSelected'),
   onSelect: _propTypes.default.func,
   onClick: _propTypes.default.func,
   onKeyDown: _propTypes.default.func,

package/lib/Menu/MenuItemGroup/index.js

@@ -8,9 +8,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.MenuItemGroup = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _emotion = require("@instructure/emotion");
-var _uiReactUtils = require("@instructure/ui-react-utils");
-var _uiA11yUtils = require("@instructure/ui-a11y-utils");
-var _uiTestable = require("@instructure/ui-testable");
+var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
+var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
+var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
+var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
+var _hasVisibleChildren = require("@instructure/ui-a11y-utils/lib/hasVisibleChildren.js");
+var _testable = require("@instructure/ui-testable/lib/testable.js");
 var _MenuItem = require("../MenuItem");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
@@ -46,7 +49,7 @@ parent: Menu
 id: Menu.Group
 ---
 **/
-let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class MenuItemGroup extends _react.Component {
+let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _testable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class MenuItemGroup extends _react.Component {
   constructor(props) {
     super(props);
     this._labelId = void 0;
@@ -106,7 +109,7 @@ let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _uiReactUtils.withDeterm
       allowMultiple = props.allowMultiple;
     const selected = [];
     const items = _react.Children.toArray(children).filter(child => {
-      return (0, _uiReactUtils.matchComponentTypes)(child, [_MenuItem.MenuItem]);
+      return (0, _matchComponentTypes.matchComponentTypes)(child, [_MenuItem.MenuItem]);
     });
     items.forEach((item, index) => {
       if ((selected.length === 0 || allowMultiple) && (item.props.selected || item.props.defaultSelected)) {
@@ -125,7 +128,7 @@ let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _uiReactUtils.withDeterm
   renderLabel() {
     var _this$props$styles;
     const label = this.props.label;
-    return (0, _uiA11yUtils.hasVisibleChildren)(label) ? (0, _emotion.jsx)("span", {
+    return (0, _hasVisibleChildren.hasVisibleChildren)(label) ? (0, _emotion.jsx)("span", {
       css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.label
     }, label) : label;
   }
@@ -139,12 +142,12 @@ let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _uiReactUtils.withDeterm
     const children = this.props.children;
     let index = -1;
     return _react.Children.map(children, child => {
-      if ((0, _uiReactUtils.matchComponentTypes)(child, [_MenuItem.MenuItem])) {
+      if ((0, _matchComponentTypes.matchComponentTypes)(child, [_MenuItem.MenuItem])) {
         ++index;
         const value = child.props.value || index;
         return (0, _emotion.jsx)("li", {
           role: "none"
-        }, ' ', (0, _uiReactUtils.safeCloneElement)(child, {
+        }, ' ', (0, _safeCloneElement.safeCloneElement)(child, {
           tabIndex: isTabbable && index === 0 ? 0 : -1,
           controls,
           value,
@@ -163,7 +166,7 @@ let MenuItemGroup = exports.MenuItemGroup = (_dec = (0, _uiReactUtils.withDeterm
   }
   render() {
     var _this$props$styles2, _this$props$styles3;
-    const props = (0, _uiReactUtils.omitProps)(this.props, MenuItemGroup.allowedProps);
+    const props = (0, _omitProps.omitProps)(this.props, MenuItemGroup.allowedProps);
     return (0, _emotion.jsx)("span", Object.assign({}, props, {
       css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.menuItemGroup,
       role: "presentation",

package/lib/Menu/MenuItemGroup/props.js

@@ -6,7 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propTypes = exports.allowedProps = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _uiPropTypes = require("@instructure/ui-prop-types");
+var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
+var _Children = require("@instructure/ui-prop-types/lib/Children.js");
 var _MenuItem = require("../MenuItem");
 var _MenuItemSeparator = require("../MenuItemSeparator");
 /*
@@ -36,8 +37,8 @@ var _MenuItemSeparator = require("../MenuItemSeparator");
 const propTypes = exports.propTypes = {
   label: _propTypes.default.node.isRequired,
   allowMultiple: _propTypes.default.bool,
-  children: _uiPropTypes.Children.oneOf([_MenuItem.MenuItem, _MenuItemSeparator.MenuItemSeparator]),
-  selected: (0, _uiPropTypes.controllable)(_propTypes.default.array, 'onSelect', 'defaultSelected'),
+  children: _Children.Children.oneOf([_MenuItem.MenuItem, _MenuItemSeparator.MenuItemSeparator]),
+  selected: (0, _controllable.controllable)(_propTypes.default.array, 'onSelect', 'defaultSelected'),
   defaultSelected: _propTypes.default.array,
   onSelect: _propTypes.default.func,
   onMouseOver: _propTypes.default.func,

package/lib/Menu/MenuItemSeparator/index.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.MenuItemSeparator = void 0;
 var _react = require("react");
 var _emotion = require("@instructure/emotion");
-var _uiTestable = require("@instructure/ui-testable");
-var _uiReactUtils = require("@instructure/ui-react-utils");
+var _testable = require("@instructure/ui-testable/lib/testable.js");
+var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _props = require("./props");
@@ -44,7 +44,7 @@ id: Menu.Separator
 ---
 @module MenuItemSeparator
 **/
-let MenuItemSeparator = exports.MenuItemSeparator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = (_class2 = class MenuItemSeparator extends _react.Component {
+let MenuItemSeparator = exports.MenuItemSeparator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class MenuItemSeparator extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -62,7 +62,7 @@ let MenuItemSeparator = exports.MenuItemSeparator = (_dec = (0, _emotion.withSty
   }
   render() {
     var _this$props$styles;
-    const props = (0, _uiReactUtils.omitProps)(this.props, MenuItemSeparator.allowedProps);
+    const props = (0, _omitProps.omitProps)(this.props, MenuItemSeparator.allowedProps);
     return (0, _emotion.jsx)("div", Object.assign({}, props, {
       role: "presentation",
       css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.menuItemSeparator,

package/lib/Menu/__new-tests__/Menu.test.js

@@ -5,7 +5,7 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@testing-library/react");
 var _userEvent = require("@testing-library/user-event");
 require("@testing-library/jest-dom");
-var _uiAxeCheck = require("@instructure/ui-axe-check");
+var _runAxeCheck = require("@instructure/ui-axe-check/lib/runAxeCheck.js");
 var _index = require("../index");
 var _Menu, _Menu2, _Menu3, _Menu4, _MenuItem, _MenuItem2, _MenuItem3, _Menu5, _button, _MenuItem4, _Menu6, _button2, _MenuItem5, _MenuItem6, _button3, _MenuItem7, _MenuItem8, _Menu7, _Menu8, _button4, _MenuItem9, _MenuItem10, _button5, _MenuItem11, _MenuItem12, _button6, _MenuItem13, _MenuItem14, _Menu9, _button7, _MenuItem15, _MenuItem16;
 /*
@@ -47,7 +47,7 @@ describe('<Menu />', () => {
           label: "Menu-label-text"
         }, /*#__PURE__*/_react.default.createElement(_index.MenuItem, null, "Menu Item Text")))),
         container = _render.container;
-      const axeCheck = await (0, _uiAxeCheck.runAxeCheck)(container);
+      const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
       expect(axeCheck).toBe(true);
     });
     it('should meet standards when menu is closed', async () => {
@@ -57,7 +57,7 @@ describe('<Menu />', () => {
           disabled: true
         }, "Gradebook")))),
         container = _render2.container;
-      const axeCheck = await (0, _uiAxeCheck.runAxeCheck)(container);
+      const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
       expect(axeCheck).toBe(true);
     });
     it('should meet standards when menu is open', async () => {
@@ -68,7 +68,7 @@ describe('<Menu />', () => {
           disabled: true
         }, "Gradebook")))),
         container = _render3.container;
-      const axeCheck = await (0, _uiAxeCheck.runAxeCheck)(container);
+      const axeCheck = await (0, _runAxeCheck.runAxeCheck)(container);
       expect(axeCheck).toBe(true);
     });
     it('should call onSelect when menu item is selected', async () => {

package/lib/Menu/index.js

@@ -27,11 +27,13 @@ Object.defineProperty(exports, "MenuItemSeparator", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _keycode = _interopRequireDefault(require("keycode"));
-var _uiPopover = require("@instructure/ui-popover");
-var _uiReactUtils = require("@instructure/ui-react-utils");
+var _Popover = require("@instructure/ui-popover/lib/Popover");
+var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
+var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
+var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
 var _console = require("@instructure/console");
-var _uiDomUtils = require("@instructure/ui-dom-utils");
-var _uiTestable = require("@instructure/ui-testable");
+var _containsActiveElement = require("@instructure/ui-dom-utils/lib/containsActiveElement.js");
+var _testable = require("@instructure/ui-testable/lib/testable.js");
 var _MenuContext = require("../MenuContext");
 var _MenuItem = require("./MenuItem");
 var _MenuItemGroup = require("./MenuItemGroup");
@@ -70,7 +72,7 @@ var _dec, _dec2, _dec3, _class, _class2;
 category: components
 ---
 **/
-let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class Menu extends _react.Component {
+let Menu = exports.Menu = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec3 = (0, _testable.testable)(), _dec(_class = _dec2(_class = _dec3(_class = (_class2 = class Menu extends _react.Component {
   constructor(props) {
     super(props);
     this.state = {
@@ -227,9 +229,9 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
   }
   focused() {
     if (this.shown) {
-      return (0, _uiDomUtils.containsActiveElement)(this._menu) || this.state.hasFocus;
+      return (0, _containsActiveElement.containsActiveElement)(this._menu) || this.state.hasFocus;
     } else {
-      return (0, _uiDomUtils.containsActiveElement)(this._trigger);
+      return (0, _containsActiveElement.containsActiveElement)(this._trigger);
     }
   }
   get focusedIndex() {
@@ -256,22 +258,22 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
       disabled = _this$props3.disabled;
     let count = 0;
     return _react.Children.map(children, child => {
-      if (!(0, _uiReactUtils.matchComponentTypes)(child, ['MenuItemSeparator', 'MenuItem', 'MenuItemGroup', 'Menu'])) {
+      if (!(0, _matchComponentTypes.matchComponentTypes)(child, ['MenuItemSeparator', 'MenuItem', 'MenuItemGroup', 'Menu'])) {
         return;
       }
       count += 1;
       const isTabbable = !this.state.hasFocus && count === 1;
-      if ((0, _uiReactUtils.matchComponentTypes)(child, ['MenuItemSeparator'])) {
+      if ((0, _matchComponentTypes.matchComponentTypes)(child, ['MenuItemSeparator'])) {
         return (0, _emotion.jsx)("li", {
           role: "none"
         }, child);
       }
       const menuItemChild = child;
       const controls = menuItemChild.props['aria-controls'] || menuItemChild.props.controls || this.props['aria-controls'] || this.props.controls;
-      if ((0, _uiReactUtils.matchComponentTypes)(child, ['MenuItem'])) {
+      if ((0, _matchComponentTypes.matchComponentTypes)(child, ['MenuItem'])) {
         return (0, _emotion.jsx)("li", {
           role: "none"
-        }, (0, _uiReactUtils.safeCloneElement)(child, {
+        }, (0, _safeCloneElement.safeCloneElement)(child, {
           controls,
           children: child.props.children,
           disabled: disabled || child.props.disabled,
@@ -282,10 +284,10 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
           tabIndex: isTabbable ? 0 : -1
         }));
       }
-      if ((0, _uiReactUtils.matchComponentTypes)(child, ['MenuItemGroup'])) {
+      if ((0, _matchComponentTypes.matchComponentTypes)(child, ['MenuItemGroup'])) {
         return (0, _emotion.jsx)("li", {
           role: "none"
-        }, (0, _uiReactUtils.safeCloneElement)(child, {
+        }, (0, _safeCloneElement.safeCloneElement)(child, {
           label: child.props.label,
           controls,
           disabled: disabled || child.props.disabled,
@@ -296,11 +298,11 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
           isTabbable
         }));
       }
-      if ((0, _uiReactUtils.matchComponentTypes)(child, ['Menu'])) {
+      if ((0, _matchComponentTypes.matchComponentTypes)(child, ['Menu'])) {
         const submenuDisabled = disabled || child.props.disabled;
         return (0, _emotion.jsx)("li", {
           role: "none"
-        }, (0, _uiReactUtils.safeCloneElement)(child, {
+        }, (0, _safeCloneElement.safeCloneElement)(child, {
           type: 'flyout',
           controls,
           disabled: submenuDisabled,
@@ -367,7 +369,7 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
       positionContainerDisplay = _this$props5.positionContainerDisplay,
       offsetX = _this$props5.offsetX,
       offsetY = _this$props5.offsetY;
-    return trigger ? (0, _emotion.jsx)(_uiPopover.Popover, {
+    return trigger ? (0, _emotion.jsx)(_Popover.Popover, {
       isShowingContent: show,
       defaultIsShowingContent: defaultShow,
       onHideContent: (event, {
@@ -400,7 +402,7 @@ let Menu = exports.Menu = (_dec = (0, _uiReactUtils.withDeterministicId)(), _dec
           popoverRef(el);
         }
       },
-      renderTrigger: (0, _uiReactUtils.safeCloneElement)(trigger, {
+      renderTrigger: (0, _safeCloneElement.safeCloneElement)(trigger, {
         ref: el => {
           this._trigger = el;
         },

package/lib/Menu/props.js

@@ -6,8 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propTypes = exports.allowedProps = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _uiPosition = require("@instructure/ui-position");
-var _uiPropTypes = require("@instructure/ui-prop-types");
+var _PositionPropTypes = require("@instructure/ui-position/lib/PositionPropTypes.js");
+var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
+var _Children = require("@instructure/ui-prop-types/lib/Children.js");
 /*
  * The MIT License (MIT)
  *
@@ -33,13 +34,13 @@ var _uiPropTypes = require("@instructure/ui-prop-types");
  */
 
 const propTypes = exports.propTypes = {
-  children: _uiPropTypes.Children.oneOf(['MenuItem', 'MenuItemGroup', 'MenuItemSeparator', 'Menu']),
+  children: _Children.Children.oneOf(['MenuItem', 'MenuItemGroup', 'MenuItemSeparator', 'Menu']),
   label: _propTypes.default.string,
   disabled: _propTypes.default.bool,
   trigger: _propTypes.default.node,
-  placement: _uiPosition.PositionPropTypes.placement,
+  placement: _PositionPropTypes.PositionPropTypes.placement,
   defaultShow: _propTypes.default.bool,
-  show: (0, _uiPropTypes.controllable)(_propTypes.default.bool, 'onToggle', 'defaultShow'),
+  show: (0, _controllable.controllable)(_propTypes.default.bool, 'onToggle', 'defaultShow'),
   onToggle: _propTypes.default.func,
   onSelect: _propTypes.default.func,
   onDismiss: _propTypes.default.func,
@@ -49,8 +50,8 @@ const propTypes = exports.propTypes = {
   onKeyUp: _propTypes.default.func,
   menuRef: _propTypes.default.func,
   popoverRef: _propTypes.default.func,
-  mountNode: _uiPosition.PositionPropTypes.mountNode,
-  constrain: _uiPosition.PositionPropTypes.constrain,
+  mountNode: _PositionPropTypes.PositionPropTypes.mountNode,
+  constrain: _PositionPropTypes.PositionPropTypes.constrain,
   shouldHideOnSelect: _propTypes.default.bool,
   shouldFocusTriggerOnClose: _propTypes.default.bool,
   positionContainerDisplay: _propTypes.default.oneOf(['inline-block', 'block']),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-menu",
-  "version": "8.56.2-pr-snapshot-1721749364069",
+  "version": "8.56.2",
   "description": "A dropdown menu component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,29 +23,29 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-axe-check": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-babel-preset": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-color-utils": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-test-utils": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-themes": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-axe-check": "8.56.2",
+    "@instructure/ui-babel-preset": "8.56.2",
+    "@instructure/ui-color-utils": "8.56.2",
+    "@instructure/ui-test-utils": "8.56.2",
+    "@instructure/ui-themes": "8.56.2",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.5.1"
   },
   "dependencies": {
     "@babel/runtime": "^7.23.2",
-    "@instructure/console": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/emotion": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/shared-types": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-a11y-utils": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-dom-utils": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-icons": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-popover": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-position": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-prop-types": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-react-utils": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-testable": "8.56.2-pr-snapshot-1721749364069",
-    "@instructure/ui-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/console": "8.56.2",
+    "@instructure/emotion": "8.56.2",
+    "@instructure/shared-types": "8.56.2",
+    "@instructure/ui-a11y-utils": "8.56.2",
+    "@instructure/ui-dom-utils": "8.56.2",
+    "@instructure/ui-icons": "8.56.2",
+    "@instructure/ui-popover": "8.56.2",
+    "@instructure/ui-position": "8.56.2",
+    "@instructure/ui-prop-types": "8.56.2",
+    "@instructure/ui-react-utils": "8.56.2",
+    "@instructure/ui-testable": "8.56.2",
+    "@instructure/ui-utils": "8.56.2",
     "keycode": "^2.2.1",
     "prop-types": "^15.8.1"
   },

package/src/Menu/MenuItem/index.tsx

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 /** @jsx jsx */
-import React, { Component, MouseEventHandler } from 'react'
+import React, { Component } from 'react'
 import keycode from 'keycode'
 
 import { IconCheckSolid, IconArrowOpenEndSolid } from '@instructure/ui-icons'
@@ -253,7 +253,7 @@ class MenuItem extends Component<MenuItemProps, MenuItemState> {
               : 'false'
             : undefined
         }
-        onClick={this.handleClick as MouseEventHandler}
+        onClick={this.handleClick}
         onKeyUp={createChainedFunction(onKeyUp, this.handleKeyUp)}
         onKeyDown={createChainedFunction(onKeyDown, this.handleKeyDown)}
         ref={this.handleRef}

package/src/Menu/MenuItem/props.ts

@@ -39,8 +39,8 @@ import type { ViewOwnProps } from '@instructure/ui-view'
 
 type OnMenuItemSelect = (
   e: React.MouseEvent<ViewOwnProps>,
-  value: MenuItemOwnProps['value'],
-  selected: MenuItemOwnProps['selected'],
+  value: MenuItemProps['value'],
+  selected: MenuItemProps['selected'],
   args: MenuItem
 ) => void
 
@@ -74,8 +74,20 @@ type MenuItemOwnProps = {
    * the element type to render as (will default to `<a>` if href is provided)
    */
   as?: AsElementType
+  /**
+   * How this component should be rendered. If it's `checkbox` or `radio` it will
+   * display a checkmark based on its own 'selected' state, if it's `flyout` it will
+   * render an arrow after the label.
+   */
   type?: 'button' | 'checkbox' | 'radio' | 'flyout'
+  /**
+   * Arbitrary value that you can store in this component. Is sent out by the
+   * `onSelect` event
+   */
   value?: string | number
+  /**
+   * Value of the `href` prop that will be put on the underlying DOM element.
+   */
   href?: string
 }