Pointer-positioned world actions using Minecraft menu parts.
Preview
Example source could not be loaded: context-menu-example. Reload this page to retry.Usage
ContextMenuTrigger is the actual primitive trigger rather than an automatic Button. Give its region meaningful content. Right-click the example to invoke an action or change the controlled coordinates preference.
Composition
Content opens at the pointer with right/start alignment and owns its portal. CheckboxItem uses checked and onCheckedChange; RadioGroup uses value and onValueChange. Sub/SubTrigger/SubContent provide nested commands. Supported surfaces are popup and suggestions.
Interaction and limits
Provide a reachable alternative for critical actions on touch devices. Shortcut labels do not register shortcuts. Only the default Item variant is supported. Native menu constituents have captured references, while pointer anchoring, nesting and overall menu composition are web adaptations.
See the upstream API for the underlying part and event contracts.
Installation
Component source
This is the component implementation. Its supporting styles, helpers and resources are also required. See complete manual installation.
"use client";
import { ContextMenu as Primitive } from "@base-ui/react/context-menu";
import * as React from "react";
import { minecraftCardSprite } from "./minecraft-card-sprite";
import { MinecraftMenuCheckboxSprite } from "./minecraft-menu-checkbox";
import {
MenuScaleContext,
MinecraftMenuText,
menuTextNodes,
} from "./minecraft-menu-text";