@basic-ui/core 0.0.46 → 0.0.47

package/src/Menu/MenuPopover.tsx

@@ -14,14 +14,21 @@ export interface MenuPopoverProps extends Omit<PopperProps, 'anchorEl'> {
 export const MenuPopover = forwardRef<HTMLDivElement, MenuPopoverProps>(
   function MenuPopover(props, forwardedRef) {
     const { as = 'div', ...otherProps } = props;
-    const { buttonRef, open } = useMenuContext();
+    const { buttonRef, open, offsetFn, isContextMenu } = useMenuContext();
 
     if (!open) {
       return null;
     }
 
     return (
-      <Popper as={as} ref={forwardedRef} anchorEl={buttonRef} {...otherProps} />
+      <Popper
+        as={as}
+        ref={forwardedRef}
+        anchorEl={buttonRef}
+        offsetFn={offsetFn}
+        placement={isContextMenu.current ? 'bottom-start' : undefined}
+        {...otherProps}
+      />
     );
   }
 );

package/src/Menu/context.ts

@@ -1,3 +1,4 @@
+import type { OffsetsFunction } from '@popperjs/core/lib/modifiers/offset';
 import type {
   KeyboardEvent,
   MouseEvent,
@@ -10,7 +11,7 @@ export type ItemObject = { text: string; value: any; id: string | undefined };
 
 // MenuRoot
 export interface MenuContextProps {
-  buttonRef: MutableRefObject<HTMLButtonElement | null>;
+  buttonRef: MutableRefObject<HTMLElement | null>;
   menuListIdRef: MutableRefObject<undefined | string>;
   openWithArrowKeyRef: MutableRefObject<string | null>;
   onChange?: (
@@ -21,6 +22,9 @@ export interface MenuContextProps {
     isOpen: boolean
   ) => void;
   open: boolean;
+  offset: MutableRefObject<[number, number]>;
+  offsetFn: OffsetsFunction;
+  isContextMenu: MutableRefObject<boolean>;
 }
 
 const menuContext = createContext<MenuContextProps>(null as any);

package/src/Menu/index.ts

@@ -1,5 +1,6 @@
 export * from './Menu';
 export * from './MenuButton';
+export * from './ContextMenuTrigger';
 export * from './MenuItem';
 export * from './MenuList';
 export * from './MenuPopover';