INSTUI-4145 MenuItem's onSelect type did not expose its value and selected types

packages/ui-menu/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'
@@ -252,7 +252,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}

packages/ui-menu/src/Menu/MenuItem/props.ts

@@ -38,8 +38,8 @@ import type { WithDeterministicIdProps } from '@instructure/ui-react-utils'
 
 type OnMenuItemSelect = (
   e: React.MouseEvent,
-  value: MenuItemOwnProps['value'],
-  selected: MenuItemOwnProps['selected'],
+  value: MenuItemProps['value'],
+  selected: MenuItemProps['selected'],
   args: MenuItem
 ) => void
 
@@ -73,8 +73,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
 }