ContextMenu

A menu of actions opened from a target context.

#Import

import {
  ContextMenu,
  ContextMenuContainer,
  ContextMenuItem,
  ContextMenuProvider,
} from 'bmates-ui';

#Basic usage

The example below mirrors the primary Storybook composition and can be used as a starting point.

<ContextMenuProvider>
  <ContextMenuContainer>Right-click me</ContextMenuContainer>
  <ContextMenu>
    <ContextMenuItem>Rename</ContextMenuItem>
    <ContextMenuItem>Delete</ContextMenuItem>
  </ContextMenu>
</ContextMenuProvider>

#Preview

<ContextMenuProvider>
  <ContextMenuContainer>Right-click me</ContextMenuContainer>
  <ContextMenu>
    <ContextMenuItem>Rename</ContextMenuItem>
    <ContextMenuItem>Delete</ContextMenuItem>
  </ContextMenu>
</ContextMenuProvider>

#Prop previews

The examples below isolate the props that change visual output or interaction.

#Disabled item

<ContextMenuItem disabled>Delete</ContextMenuItem>

#Component API

#Usage notes

• Every component in the table is exported from bmates-ui.
• Unless noted otherwise, a component also accepts the standard props of its underlying HTML element.
• For application-owned state, use a controlled value and its change handler instead of only a default* prop.