@react-spectrum/menu 3.16.1-nightly.4321 → 3.17.0

package/src/context.ts

@@ -10,18 +10,20 @@
  * governing permissions and limitations under the License.
  */
 
-import {FocusStrategy} from '@react-types/shared';
-import {MenuTriggerState} from '@react-stately/menu';
+import {DOMProps, FocusStrategy, HoverEvents, KeyboardEvents, PressEvents} from '@react-types/shared';
 import React, {HTMLAttributes, MutableRefObject, RefObject, useContext} from 'react';
+import {RootMenuTriggerState} from '@react-stately/menu';
 import {TreeState} from '@react-stately/tree';
 
-export interface MenuContextValue extends Omit<HTMLAttributes<HTMLElement>, 'autoFocus'> {
+export interface MenuContextValue extends Omit<HTMLAttributes<HTMLElement>, 'autoFocus' | 'onKeyDown'>, Pick<KeyboardEvents, 'onKeyDown'> {
   onClose?: () => void,
   closeOnSelect?: boolean,
   shouldFocusWrap?: boolean,
   autoFocus?: boolean | FocusStrategy,
   ref?: MutableRefObject<HTMLDivElement>,
-  state?: MenuTriggerState
+  state?: RootMenuTriggerState,
+  onBackButtonPress?: () => void,
+  submenuLevel?: number
 }
 
 export const MenuContext = React.createContext<MenuContextValue>({});
@@ -30,26 +32,32 @@ export function useMenuContext(): MenuContextValue {
   return useContext(MenuContext);
 }
 
-export interface MenuDialogContextValue {
+export interface SubmenuTriggerContextValue extends DOMProps, Pick<PressEvents, 'onPressStart' | 'onPress'>, Pick<HoverEvents, 'onHoverChange'>, Pick<KeyboardEvents, 'onKeyDown'> {
   isUnavailable?: boolean,
-  triggerRef?: MutableRefObject<HTMLElement>
+  triggerRef?: MutableRefObject<HTMLElement>,
+  'aria-expanded'?: boolean | 'true' | 'false',
+  'aria-controls'?: string,
+  'aria-haspopup'?: 'dialog' | 'menu',
+  isOpen?: boolean
 }
 
-export const MenuDialogContext = React.createContext<MenuDialogContextValue | undefined>(undefined);
+export const SubmenuTriggerContext = React.createContext<SubmenuTriggerContextValue | undefined>(undefined);
 
-export function useMenuDialogContext(): MenuDialogContextValue {
-  return useContext(MenuDialogContext);
+export function useSubmenuTriggerContext(): SubmenuTriggerContextValue {
+  return useContext(SubmenuTriggerContext);
 }
 
 export interface MenuStateContextValue<T> {
   state?: TreeState<T>,
-  container?: RefObject<HTMLElement>,
-  menu?: RefObject<HTMLDivElement>
+  popoverContainerRef?: RefObject<HTMLElement>,
+  trayContainerRef?: RefObject<HTMLElement>,
+  menu?: RefObject<HTMLDivElement>,
+  submenu?: RefObject<HTMLDivElement>,
+  rootMenuTriggerState?: RootMenuTriggerState
 }
 
-export const MenuStateContext = React.createContext<MenuStateContextValue<any>>({});
+export const MenuStateContext = React.createContext<MenuStateContextValue<any>>(undefined);
 
 export function useMenuStateContext<T>(): MenuStateContextValue<T> {
   return useContext(MenuStateContext);
 }
-

package/src/index.ts

@@ -13,9 +13,11 @@
 /// <reference types="css-module-types" />
 
 export {MenuTrigger} from './MenuTrigger';
+export {SubmenuTrigger} from './SubmenuTrigger';
 export {Menu} from './Menu';
 export {ActionMenu} from './ActionMenu';
 export {ContextualHelpTrigger} from './ContextualHelpTrigger';
 export {Item, Section} from '@react-stately/collections';
 export type {SpectrumActionMenuProps, SpectrumMenuProps, SpectrumMenuTriggerProps} from '@react-types/menu';
 export type {SpectrumMenuDialogTriggerProps} from './ContextualHelpTrigger';
+export type {SpectrumSubmenuTriggerProps} from './SubmenuTrigger';